createSrc: function (qrcodeImg) {
console.log("生成海报");
var that = this
var dom = document.querySelector('#big-content');
// 创建 canvas 画布
var canvas = document.createElement("canvas");
// 2d 渲染对象
var context = canvas.getContext("2d");
// 整个文档的宽高
canvas.width = dom.offsetWidth * 2;
canvas.height = dom.offsetHeight * 2;
var width = dom.offsetWidth;
var height = dom.offsetHeight;
// 缩放到两倍大小
context.scale(2, 2);
// document.getElementById('big-content')
html2canvas(dom, {
// 用于渲染的比例。默认为浏览器设备像素比率, 设置两倍没有明显效果
scale: 2,
canvas: canvas, //自定义 canvas
width: width,
height: height,
useCORS: true,
onrendered: function (canvas) {
that.imgCreateUrl = canvas.toDataURL(); //图片地址
// document.body.appendChild(canvas);
console.log("生成成功了?" + that.imgCreateUrl);
mui.previewImage();
},
});
},
参考:https://segmentfault.com/a/1190000011478657
文档:http://html2canvas.hertzen.com/configuration
网友评论