canvas生成海报，动态计算图片的大小适配海报的高度

1.js代码

// pages/nav/nav.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    nav: ['全部', '水果蔬菜', '家电', '图书', '生活用品', '测试', '还是测试', '依然是测试'],
    // 当前项目
    current: 2,
    // 滚动栏滚动距离
    scrollLeft: 0,
    // 窗体宽度
    windowWidth: 0,
    canvasImg: '',
    share: false, //是否分享
    base64Qr: '', //二维码接口获取的base64的图片
    drawing: false, //是否绘制海报中
    loading: false, //点击分享时，是否绘制海报中
    sourceUrl1: "https://purchasing-miniapp-cdn.a2milk.com/a2/img/invitenow/share1.png", //网络图片
    sourceUrl: "http://campaigncdn.herdsric.com/a2/adjust/100.jpg", //网络图片
    sizeHeight: '',
    newheight: '',
    pixelRatio: '',
    windowH: '',
    windowW: '',
    tempNum: '',
    testTop: ''
  },

  onLoad: function (options) {
    // 设置标题
    wx.setNavigationBarTitle({
      title: '导航栏案例',
    });

    // 获取窗体宽度
    wx.getSystemInfo({
      success: (result) => {
        this.setData({
          windowW: result.windowWidth,
          windowH: result.windowHeight,
          windowWidth: result.windowWidth,
          pixelRatio: result.pixelRatio
        })
      },
    })
    // this.shareShow()
  },
  //显示遮罩层
  shareShow() {
    this.setData({
      canvasImg: '',
      drawing: true
    })
    setTimeout(() => {
      this.setShareCanvas(); // 分享绘图
    }, 800)

    // wx.showLoading({
    //   title: '海报生成中',
    // })
  },

  setShareCanvas() {
    const that = this;
    const query = wx.createSelectorQuery();
    query.select('#shareCanvas')
      .fields({
        node: true,
        size: true
      }).exec((res) => {
        const canvas = res[0].node //拿到canvas对象
        that.setData({ //这里保存canvas对象是因为下面保存相片要用这个对象
          canvas
        })
        const ctx = canvas.getContext('2d') //返回用于在画布上绘图的环境
        const dpr = that.data.pixelRatio //拿到设备像素比
        canvas.width = res[0].width * dpr //缩放画布
        canvas.height = res[0].height * dpr
        ctx.scale(dpr, dpr)
        // 设置背景为白色