const testImg="../../assets/img/01.jpg"
Component({
properties: {
},
data: {
canvas:{
width:'',
height:''
}
},
ready(){
this._init();
},
methods: {
_init(){
let _this=this;
let { windowWidth, windowHeight } = wx.getSystemInfoSync();
wx.getImageInfo({
src: testImg,
success(res){
if (res.errMsg === "getImageInfo:ok"){
let {width,height}=res;
console.log(`开始图片=>width${res.width},height${res.height}`);
let $width = windowWidth
let _radio = $width /width;
let $height = height*_radio;
_this.setData({
canvas:{
width: $width,
height:$height
}
});
_this._drawImg();
}
}
})
},
_drawImg(){
let _this=this;
let { width,height}=_this.data.canvas;
const ctx = wx.createCanvasContext('myCanvas', _this);
ctx.drawImage(testImg, 0, 0, width, height);
ctx.draw(true,()=>{
wx.canvasToTempFilePath(
{
canvasId: 'myCanvas',
success: function (res) {
if (res.errMsg == 'canvasToTempFilePath:ok') {
wx.getImageInfo({
src: res.tempFilePath,
success(res) {
console.log(`压缩之后=>width${res.width},height${res.height}`);
}
});
}
},
fail(err) {
}
},
_this
);
});
}
}
});
|
麻烦给个相关的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html），我们定位下问题
wechatide://minicode/6IqTPBm17tI6
刚没有描述明确 是在component 中使用canvas 组件 canvas 的宽高 都是正确的
wx.canvasToTempFilePath(
{
canvasId: 'myCanvas',
success(res){
//导出的图片之后1/3 左右
//开发工具上边正常
//手机是小米mix2
//不知道大家遇到过没
}
},this
）