收藏
回答

canvas 2d设置较大canvas.height和canvas.width真机会卡住不执行?

需要绘制高清大图使用 canvas2d 在 真机(ios跟安卓)设置尺寸大于4000px时,会卡住不执行,请问该怎么处理?

代码片段:https://developers.weixin.qq.com/s/tzKNiDmP7Urx

wx.showLoading({

title: '绘制中',

})

wx.createSelectorQuery().select('#canvas')

.fields({ node: true, size: true })

.exec(function (res) {

let canvas = res[0].node

let context = canvas.getContext('2d');

canvas.width = 5000;

canvas.height = 5000;

wx.hideLoading()

const image = canvas.createImage();

image.onload = () => {

context.drawImage(image, 0, 0, 5000, 5000);

// 生成图片

wx.canvasToTempFilePath({

x: 0,

y: 0,

width: 5000,

height: 5000,

destWidth: 2500,

destHeight: 2500,

canvas: canvas,

quality: 1,

fileType: 'jpg',

success(res) {

console.log(res.tempFilePath)

},

fail(err) {

console.log(err)

}

});

}

image.onerror = function (ret) {

return console.log(ret)

}

image.src = "../static/img.png" // 要加载的图片 url

})

最后一次编辑于  2021-07-08
回答关注问题邀请回答
收藏

2 个回答

  • Liaoyin
    Liaoyin
    2022-04-11

    楼主解决了吗

    2022-04-11
    有用
    回复
  • Jeremy_Ts
    Jeremy_Ts
    2021-09-28

    楼主解决了吗

    2021-09-28
    有用
    回复
登录 后发表内容