canvasToTempFilePath后导出图片被裁剪(线上部分机型发现此问题)?
发布于 5 年前 作者 gangren 10268 次浏览 来自 问答

线上部分机型发现有此问题:如Nova 6 5G,由于手上没真机没验证。       

// 初始化canvas
let canvasWidth = res[0].width;
let canvasHeight = res[0].height;
let canvasNode = res[0].node;
canvasNode.width = canvasWidth * dpr; 
canvasNode.height = canvasHeight * dpr;
ctx.scale(dpr,dpr)

// 绘制图片   img就是下面的原图
ctx.drawImage(img,0,0,canvasWidth,canvasHeight)  

//导出图片
mwx.canvasToTempFilePath({
  canvas: canvasNode,
  x: 0,
  y: 0,
  width: canvasWidth,
  height: canvasHeight,
  destWidth: canvasWidth * dpr,
  destHeight: canvasHeight * dpr
});

线上收集导出的图片数据时,发现存在部分机型导出的图片被裁剪了

这个是原图,会通过drawImage话到canvas上。canvas的会按照原图的比例进行初始(计算时存在小数,所以2者并不完全相等)

下面是canvas导出的图片

从结果图看出,由于执行了ctx.scale,绘制图片时放大了,但导出图片时还是按照原canvas比例(未执行scale)。

目前线上只发现少部分机型存在此问题

2 回复

你好,麻烦提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

尺寸对不上而已,慢慢调,建议查看一下width,destWidth和绘图元素width三者

回到顶部