manyi/static/1.0/js/services/QRCode.js

app.service("QRCodeOptions", ['$rootScope', function ($rootScope) {

    //生成二维码
    function getQRCodeImageData(option) {
        var text = option.text, label = option.label, logoDom = option.logoDom;

        var size = 200;
        var labelHeight = 0;
        var logoSize = 40;

        if (label != null) {
            labelHeight = 30;
        }

        //生成二维码
        var qrDom = $("<div></div>");
        qrDom.qrcode({
            render: "canvas", // 渲染方式有table方式（IE兼容）和canvas方式
            width: size, //宽度
            height: size, //高度
            text: text, //内容
            typeNumber: -1,//计算模式
            correctLevel: 2,//二维码纠错级别
            background: "#ffffff",//背景颜色
            foreground: "#000000"  //二维码颜色
        });
        var canvas = qrDom.find("canvas")[0];
        var context = canvas.getContext("2d");
        var imgData = context.getImageData(0, 0, size, size);//获取到二维码图片数据流

        //生成背景（用来绘制标签、背景图等）
        var backDom = $("<canvas></canvas>");

        var maxW = size;
        var maxH = size + labelHeight;
        var left = 0;
        var top = 0;

        backDom.attr({"width": maxW, "height": maxH});

        var backCanvas = backDom[0];
        var ctx = backCanvas.getContext("2d");

        //填充背景为白色
        ctx.fillStyle = "#fff";
        ctx.fillRect(0, 0, maxW, maxH);

        ctx.putImageData(imgData, left, top);//合并二维码到带背景信息的画布

        if (label) {
            //绘制标题
            ctx.font = "bold 24px Arial";//使用粗体，稍大的字号，否则打印出来的不清晰
            ctx.textAlign = "center";
            ctx.fillStyle = "#000";
            ctx.fillText(label, size / 2 + left, (size + labelHeight - 8) + top);
        }

        //绘制logo
        if (logoDom) {
            var logoBorder = 4;
            var centerSize = 2 * logoBorder + logoSize;

            if ($("#qrcodeOptPreviewLogo").length > 0) {
                //清空中心区域用来绘制logo
                ctx.rect((size - centerSize) / 2 + left, (size - centerSize) / 2 + top, centerSize, centerSize);
                ctx.fillStyle = "#fff";
                ctx.fill();

                //logo图片
                ctx.drawImage(logoDom, (size - logoSize) / 2 + left, (size - logoSize) / 2 + top, logoSize, logoSize);
            } else {
                console.log("请在页面中放置一个qrcodeOptPreviewLogo")
            }

        }

        var dataURL = backCanvas.toDataURL("image/png");
        return dataURL;
    }

    return {
        getQRCodeImageData: getQRCodeImageData
    };
}]);