- canvasToTempFilePath部分ios手机导出图片裁剪?
真机截图(正常): [图片] iphone 7中截图(图片发生了裁剪): [图片] 核心代码片段(具体见代码片段:https://developers.weixin.qq.com/s/fUJ4d3m17UxT): <view class="page"> <canvas type="2d" style="width:{{canvasWidth}}px;height:{{canvasHeight}}px;" id="myCanvas" class="myCanvas" ></canvas> <image src="{{imageSrc}}" mode="widthFix"></image> </view> const app = getApp() Page({ data: { imageSrc: "", canvasWidth: '', canvasHeight: '', imageSrc:"" }, onLoad: async function () { let imageSrc = './1.jpg'; let imageInfo = await this.getImageInfo(imageSrc); let r = 2.165914247136675; let canvasWidth = Math.abs(imageInfo.width / r); let canvasHeight = Math.abs(imageInfo.height / imageInfo.width*canvasWidth); this.setData({ canvasWidth, canvasHeight },async ()=>{ let { canvas, context } = await this.initCanvas('#myCanvas', 1); let img = await this.createImage(canvas, imageSrc); context.drawImage(img, 0, 0, imageInfo.width, imageInfo.height, 0, 0, canvasWidth, canvasHeight) let src = await wx.canvasToTempFilePath({ x: 0, y: 0, width:canvasWidth, height:canvasHeight, destWidth:canvasWidth, destHeight:canvasHeight, canvas, success:(res)=>{ this.setData({ imageSrc:res.tempFilePath }) } }) }) }, getImageInfo(src) { return new Promise(async (resolve, reject) => { wx.getImageInfo({ src, success: (result) => { resolve(result); }, fail: (e) => { reject(e); } }); }); }, initCanvas(selector, dpr) { return new Promise((resolve, reject) => { wx.createSelectorQuery() .select(selector) .fields({ node: !0, size: !0 }) .exec((res) => { let canvasWidth = res[0].width; let canvasHeight = res[0].height; let canvas = res[0].node; let context = canvas.getContext('2d'); canvas.width = canvasWidth * dpr; canvas.height = canvasHeight * dpr; context.scale(dpr, dpr); resolve({ context, canvas, canvasWidth, canvasHeight }); }); }); }, createImage(ctxNode, imageSrc) { return new Promise((resolve, reject) => { const img = ctxNode.createImage(); img.src = imageSrc; img.onload = () => { resolve(img); }; }); } }) drawImage这一步是正常的,就是canvasToTempFilePath的时候发生了裁剪
2022-02-14 - canvasToTempFilePath导出图片被裁剪?
微信版本: 8.0.18 基础库:2.16.1 机型:Iphone 13 pro max、iPhone 7 可复现的代码片段:https://developers.weixin.qq.com/s/tZmC1Wm57rwO canvasToTempFilePath导出图片被裁剪 [图片] 真机和安卓测试正常: [图片] 视频地址: 链接:https://pan.baidu.com/s/1sm1vtw5XbbCraovbSoWBsQ 提取码:79si 视频中是用IPhone 7进行测试,多次点击了重新打开小程序,最后一次操作时,发生了裁剪。
2022-02-10