[{
 {
  name: 'bg',
  src: '../img/bg.jpg'
 }, {
  name: 'z',
  src: '../img/z.png'
 }]

var i = 1;
  arr.forEach(function(obj, index, array) {
  function onLoad() {
   _self[obj.name] = img;
   if (i < array.length) {
   ++i;
   } else {
   console.log('complete');
   };
  }
  var img = new Image();
  img.onload = onLoad;
  img.onerror = onLoad;
  img.src = obj.src;

init: function() {
  var LCanvasImg_canvas = document.querySelector('#LCanvasImg_canvas');
  if (LCanvasImg_canvas) {
  LCanvasImg_canvas.width = this.params.cw;
  LCanvasImg_canvas.height = this.params.ch;
  LCanvasImg_canvas.style.display = this.params.display;
  this.canvas = LCanvasImg_canvas;
  } else {
  var canvas = document.createElement('canvas');
  canvas.id = 'LCanvasImg_canvas';
  canvas.width = this.params.cw;
  canvas.height = this.params.ch;
  canvas.style.display = this.params.display;
  document.body.appendChild(canvas);
  this.canvas = canvas;
  }
  this.clear();
 },

addImg: function(obj, callback) {
  var _self = this;
  var canvas = _self.canvas;
  var ctx = canvas.getContext("2d");
  if (obj.hasOwnProperty('sx') && obj.hasOwnProperty('sy') && obj.hasOwnProperty('sw') && obj.hasOwnProperty('sh') && obj.hasOwnProperty('x') && obj.hasOwnProperty('y') && obj.hasOwnProperty('width') && obj.hasOwnProperty('height')) {
  ctx.drawImage(_self[obj.name], obj.sx, obj.sy, obj.sw, obj.sh, obj.x, obj.y, obj.width, obj.height);
  } else if (obj.hasOwnProperty('x') && obj.hasOwnProperty('y') && obj.hasOwnProperty('width') && obj.hasOwnProperty('height')) {
  ctx.drawImage(_self[obj.name], obj.x, obj.y, obj.width, obj.height);
  } else if (obj.hasOwnProperty('x') && obj.hasOwnProperty('y')) {
  ctx.drawImage(_self[obj.name], obj.x, obj.y);
  } else {
  ctx.drawImage(_self[obj.name], 0, 0);
  }
  _self.showImg();
 },

addFont: function(obj) {
  var _self = this;
  var canvas = _self.canvas;
  var ctx = canvas.getContext("2d");
  ctx.font = obj.fontsize + "px " + obj.fontfamily; //文字的字体大小和字体系列
  var ftop = obj.ftop; //文字top
  var fleft = obj.fleft; //文字left
  ctx.textBaseline = "top"; //设置绘制文本时的文本基线。
  ctx.fillText(obj.txt, fleft, ftop);
  ctx.lineWidth = 1;
  ctx.fillStyle = "#000";
  ctx.strokeStyle = "rgba(255,255,255,0.4)";
  ctx.strokeText(obj.txt, fleft, ftop);
 },

/**
 * 
 * 初始化二维码生成插件
 * 
 */
 var qrdata = '';
 var myqr = document.querySelector('#myqr');
 var qrcode = document.querySelector('#qrcode');
 var qr = new QRCode(qrcode, {
 width: 300,
 height: 300,
 colorDark: "#000000",
 colorLight: "#ffffff",
 correctLevel: QRCode.CorrectLevel.L
 });

function buildQr () {
 var img = qrcode.querySelector('img');
 img.onload = function() {
 qrdata = img.src;
 main();
 };
 qr.makeCode(myqr.value);
 }

var canvasImg = null;
 function main() {
 //初始化
 canvasImg = new LCanvasImg({
  cw: 768,//canvas width
  ch: 1163,//canvas height
  iw: '100%',//output img width
  ih: 'auto',//output img height
  display:'none'//canvas display
 });
 //资源加载
 canvasImg.load([{
  name: 'qr',
  src: qrdata
 }, {
  name: 'bg',
  src: '../img/bg.jpg'
 }, {
  name: 'z',
  src: '../img/z.png'
 }], build);
 };

function build() {
 var farr = [{
  txt: document.querySelector('#mytxt1').value,
  fontsize: 26,
  fontfamily: 'fzjt',
  ftop: 140,
  fleft: 194
 }, {
  txt: '胡鑫',
  fontsize: 26,
  fontfamily: 'fzjt',
  ftop: 220,
  fleft: 394
 }, {
  txt: '邓逸昕',
  fontsize: 26,
  fontfamily: 'fzjt',
  ftop: 220,
  fleft: 294
 }, {
  txt: document.querySelector('#mytxt1').value,
  fontsize: 26,
  fontfamily: 'fzjt',
  ftop: 220,
  fleft: 194
 }];
 canvasImg.addImg({
  name: 'bg',
  x: 0,
  y: 0,
  width: 768,
  height: 1163
 });
 farr.forEach(function(obj) {
  canvasImg.addFont(obj);
 });
 canvasImg.addImg({
  name: 'z',
  x: 0,
  y: 0,
  width: 100,
  height: 100
 });
 canvasImg.addImg({
  name: 'z',
  sx: 0,
  sy: 0,
  sw: 150,
  sh: 150,
  x: 100,
  y: 100,
  width: 100,
  height: 100
 });
 canvasImg.addImg({
  name: 'qr',
  x: 400,
  y: 800,
  width: 200,
  height: 200
 });
 };
 window.onload = buildQr;