小程序画海报

create_poster:function(){

    let that = this;

    let poster = that.data.poster;

    var ctx = wx.createCanvasContext('poster');

    ctx.drawImage(poster, 0, 0, 640, 1008);

    let element = that.data.poster_element;

    for(let key  in element){

      // console.log(key + '---' + element[key]['type'])

      ctx.save();

      switch(key){

        case 'roundhead':

          ctx.beginPath();

          ctx.arc(element[key]['width'] / 2 + element[key]['left'], element[key]['height'] / 2 + element[key]['top'], element[key]['width'] / 2, 0, Math.PI * 2, false);

          ctx.clip();

          ctx.drawImage(that.data.avatar, element[key]['left'], element[key]['top'], element[key]['width'], element[key]['height'])

          ctx.restore();

          break;

        case 'head':

        case 'img':

        case 'roundqr':

        case 'qr':

          let p_src = '';

          if(key=='head') p_src = that.data.avatar;

          else if(key=='img' || key=='roundqr' || key=='qr') p_src = element[key]['src'];

          ctx.drawImage(p_src, element[key]['left'], element[key]['top'], element[key]['width'], element[key]['height'])

          break;

        case 'realname':

        case 'mobile':

        case 'companyname':

        case 'brandname':

        case 'nickname':

          let t_value = '';

          if(key=='realname') t_value = element[key]['title']+that.data.realname;

          else if(key=='mobile') t_value = element[key]['title']+that.data.mobile;

          else if(key=='companyname') t_value = element[key]['title']+that.data.company;

          else if(key=='brandname') t_value = element[key]['title']+that.data.job_intention;

          else if(key=='nickname') t_value = element[key]['title']+that.data.status;

          ctx.setTextAlign(element[key]['align']?element[key]['align']:'left');

          ctx.setFontSize(element[key]['size']);

          ctx.fillStyle=element[key]['color'];

          ctx.fillText(t_value, element[key]['left'], element[key]['top']+element[key]['height']);

          break;

      }

    }

    ctx.draw();

    setTimeout(function(){

      wx.canvasToTempFilePath({

        destWidth: 640,

        destHeight: 1008,

        canvasId: 'poster',

        success(res) {

          that.setData({

            poster: res.tempFilePath,

            poster_hide: false,

          })

        }

      })

    },800);

  },