微信小程序wx.createCameraContext() ctx.fillText拍照时图片加文字水印保存本地时更改medium和low分辨率时，无法加上水印

今天在微信小程序给同一张图片不同分辨率的图片加文字水印时，发现只有最高分辨的图片可以成功加上水印，花了半天找BUG，分享一下

//源代码，可以用多个filltext来给同个图片加位置不同的水印
      ctx.fillText('产品名称' + ' ' + this.data.productName, 10 , 460 ) //水印内容，位置
      ctx.fillText('分辨率his.data.productName, 10 , 480 //水印内容，位置
      ctx.fillText('图尺寸this.data.productName, 10 , 500 //水印内容，位置

原因

CanvasContext.fillText(string text, number x, number y, number maxWidth)中的 number x,number y指绘制文本的左上角 x y坐标位置而不是照片的X y位置,如图

而当我们更改分辨率后，图片尺寸变了，如图

解决办法：

利用成功回调函数获取当前图片的宽高度 ress.width和ress.height，并计算出当前宽高占最高分辨率的百分比,在原来的X Y距离基础上 * 这个百分比即可

  
                    wx.getImageInfo({
                        src: res.tempImagePath,
                        success: (ress) => {
                        //这里获取图片的宽高
                            const hg = ress.height / 1719;
                            const wd = ress.width / 1080;
                        //这里在原来的X Y距离上 乘以当前分辨率与最高分辨率图片宽高的百分比
                            ctx.fillText('产品名称' + ' ' + this.data.productName, 10 * wd, 460 * hg) //水印内容，位置