开发工具上使用CanvasContext.drawImage 括号9个参数那种方法：
在开发工具上可以正常裁剪图片 真机上打开调试模式也可以正常裁剪 但是关掉调试就不行了 图片变形
对比图：
3 个回答
请 登录 后发表内容
相关问题
相关文档
- CanvasContext.drawImage: 小程序/开发/API/画布/CanvasContext/CanvasContext.drawImage
- 真机调试2.0: 小程序/开发/工具/小程序调试/真机调试/真机调试2.0
- CanvasContext.drawImage#功能描述: 小程序/开发/API/画布/CanvasContext/CanvasContext.drawImage
- CanvasContext.drawImage#参数: 小程序/开发/API/画布/CanvasContext/CanvasContext.drawImage
- CanvasContext.drawImage#示例代码: 小程序/开发/API/画布/CanvasContext/CanvasContext.drawImage
答主这个解决了吗，我这里工具都裁剪不了
你好，麻烦提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
iphonexr 微信7.05 ios12.4
代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）给下
_this.data.pic_url：前一个页面传过来的服务器图片地址
path:返回下载下来的图片地址
----------------------------------------------
_this.downloadPicImg(_this.data.pic_url, function (path) {
wx.getImageInfo({
src: path,
success: function success(res) {
_this.setData({
imgWidth: res.width,
imgHeight: res.height
})
}
})
_this.drawTopPicImg(path)
})
//裁剪图片方法
drawTopPicImg: function (wxShareTopImageUrl) {
console.log("绘制顶部bananer");
console.log("wxShareTopImageUrl=", wxShareTopImageUrl);
let context = this.canvas;
let headX = this.getCanvasX(0);
let headY = this.getCanvasY(0);
let w = this.data.imgWidth // 图片的宽
let h = this.data.imgHeight //图片的高
let headWidth = this.getCanvasX(660); //展示区域的宽
let headHeight = this.getCanvasY(400); //展示区域的高
// canvas与图片的宽高比
var dw = headWidth / w
var dh = headHeight / h
// 裁剪图片中间部分
if (w > headWidth && h > headHeight || w < headWidth && h < headHeight) {
if (dw > dh) {
console.log('1')
console.log(wxShareTopImageUrl, 0, (h - headHeight / dw) / 2, w, headHeight / dw, headX, headY, headWidth, headHeight)
context.drawImage(wxShareTopImageUrl, 0, (h - headHeight / dw) / 2, w, headHeight / dw, 0, 0, headWidth, headHeight)
context.draw(true);
} else {
console.log('2')
context.drawImage(wxShareTopImageUrl, (w - headWidth / dh) / 2, 0, headWidth / dh, h, 0, 0, headWidth, headHeight)
context.draw(true);
}
}
},
麻烦按照这里的格式https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html