在线工具_生成带Logo的二维码图片 - Yuan天空>### 简单易用的生成带logo二维码的在线工具 只需两步即可生成带logo的二维码 logo二维码的在线工具 已迁移至在线工具栏目 本功能已经迁移至 在线工具栏目 一键将任意文本转换成显示logo图标的个性二维码
Logo图像(30*30)
window.onload = loadtool;
function loadtool() {
var ad = document.createElement("script");
ad.src = "https://cdn.bootcdn.net/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(ad, s);
$("#logoImgSrc").change(function() {
loadImg(this);
});
function loadImg(input_file) {
if (typeof (FileReader) === 'undefined')
{
layer.msg("抱歉,你的浏览器不支持 FileReader,不能将图片转换为Base64,请使用现代浏览器操作!");
}
else {
try {
/*图片转Base64 核心代码*/
var file = input_file.files;
for (var i = 0; i < file.length; i++) {
//这里我们判断下类型如果不是图片就返回 去掉就可以上传任意文件
if (!/image\/\w+/.test(file[i].type)) {
layer.msg("请确保文件为图像类型");
return false;
}
var reader = new FileReader();
reader.onload = function() {
$("#logoImg").attr("src", this.result);
// load(this.result);
}
return reader.readAsDataURL(file[i]);
}
} catch (e) {
layer.msg('图片转Base64出错啦!' + e.toString())
}
}
}
$("#start").click(function() {
$("#qrcodeDiv canvas,#demo").remove();
var qrmessage = $("#qr-message").val();
var logoImg = $("#logoImg")[0];
if (qrmessage == "") {
layer.msg("请输入二维码文本信息");
return;
}
if (typeof ($("#logoImg").attr("src")) == "undefined") {
layer.msg("请选择logo图标信息");
return;
}
//计算宽,高,中心坐标,logo大小
var width = 200;
var height = 200;
var x = width * 0.4;
var y = height * 0.4;
var lx = width * 0.2;
var ly = height * 0.2;
//生成二维码
$("#qrcodeDiv").qrcode({
width: width,
height: height,
text: qrmessage
});
//画logo
var canvas = $("canvas")[0];
canvas.getContext("2d").drawImage(logoImg, x, y, lx, ly);
});
}