<link rel="stylesheet" type="text/css" href="css/amazeui.min.css"/>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/amazeui.min.js"></script>
<div id="div1">
</div>
AMUI.qrcode.prototype.createCanvas =
function(qrCodeAlg) {
//创建canvas节点
var canvas = document.createElement('canvas'
);
canvas.width =
this.options.width;
canvas.height =
this.options.height;
var ctx = canvas.getContext('2d'
);
//计算每个点的长宽
var tileW = (
this.options.width / qrCodeAlg.getModuleCount()).toPrecision(4
);
var tileH =
this.options.height / qrCodeAlg.getModuleCount().toPrecision(4
);
//绘制
for (
var row = 0; row < qrCodeAlg.getModuleCount(); row++
) {
for (
var col = 0; col < qrCodeAlg.getModuleCount(); col++
) {
ctx.fillStyle = qrCodeAlg.modules[row][col] ?
this.options.foreground :
this.options.background;
var w = (Math.ceil((col + 1) * tileW) - Math.floor(col *
tileW));
var h = (Math.ceil((row + 1) * tileW) - Math.floor(row *
tileW));
ctx.fillRect(Math.round(col * tileW), Math.round(row *
tileH), w, h);
}
}
//====== 二维码ICON start=========
function roundedRect(context, cornerX, cornerY, width, height, cornerRadius) {
if (width> 0) context.moveTo(cornerX +
cornerRadius, cornerY);
else context.moveTo(cornerX -
cornerRadius, cornerY);
context.arcTo(cornerX+width,cornerY,cornerX + width,cornerY+
height,cornerRadius);
context.arcTo(cornerX+width,cornerY + height,cornerX,cornerY+
height,cornerRadius);
context.arcTo(cornerX,cornerY+
height,cornerX,cornerY,cornerRadius);
if(width> 0
) {
context.arcTo(cornerX,cornerY,cornerX+
cornerRadius,cornerY,cornerRadius);
}
else{
context.arcTo(cornerX,cornerY,cornerX-
cornerRadius,cornerY,cornerRadius);
}
}
function drawRoundedRect(context, strokeStyle,fillStyle,cornerX,cornerY,width,height,cornerRadius) {
context.beginPath();
roundedRect(context, cornerX, cornerY, width, height, cornerRadius);
context.strokeStyle =
strokeStyle;
context.fillStyle =
fillStyle;
context.stroke();
context.fill();
}
if(
this.options.icon.url !=
null){
var img =
new Image,
iw =
this.options.icon.iwidth,
ih =
this.options.icon.iheight,
ix = (
this.options.width - iw) / 2
,
iy = (
this.options.height - ih) / 2
,
ibc =
this.options.icon.ibcolor,
ibgc =
this.options.background;
//img.crossOrigin = ''; //解决跨域
img.src =
this.options.icon.url;
img.onload =
function(){
drawRoundedRect(ctx, ibc, ibgc, ix - 5, iy - 5, iw + 10, ih + 10, 5
)
ctx.drawImage(img, ix, iy, iw, ih);
}
}
//====== 二维码ICON end=========
//返回绘制的节点
return canvas;
};
//2.使用
var cfg =
{
text: "http://devfm.ld-kj.cn/?dlsHusBbqjj",
// 要生产二维码的文字
icon: {
url: "http://devfm.ld-kj.cn/?dlsHusBbqjj",
// icon 地址
iwidth: 20,
// icon 显示的宽度
iheight: 20,
// icon 显示的高度
ibcolor: "red"
// icon 边框颜色
},
// background:'lightblue',
// foreground:'red'
};
$('#div1').qrcode(cfg);
转载于:https://www.cnblogs.com/sheqiuluo/p/7218329.html
相关资源：数据结构—成绩单生成器
