离屏2d canvas canvasToTempFilePath报错？
drawCanvas(mapName, fullSteps) {
// wx.createSelectorQuery().select('#cert').fields({
// node: true,
// size: true
// }).exec(res => {
const dpr = wx.getSystemInfoSync().pixelRatio;
const widthRatio = wx.getSystemInfoSync().windowWidth / 375;
const width = wx.getSystemInfoSync().windowWidth * dpr;
const height = wx.getSystemInfoSync().windowHeight * dpr;
const canvas = wx.createOffscreenCanvas({
type: '2d',
width: wx.getSystemInfoSync().windowWidth * dpr,
height: wx.getSystemInfoSync().windowHeight * dpr
});
const ctx = canvas.getContext('2d');
ctx.scale(dpr, dpr);
ctx.scale(widthRatio, widthRatio);
let bg = canvas.createImage();
bg.src = '../../../images/cert-bg.jpg';
bg.onload = () => {
// 绘制背景图
ctx.drawImage(bg, 0, 0, canvas.width / dpr, canvas.height / dpr);
// 头部文字
ctx.fillStyle = "#777873";
ctx.font = "14px 'PingFang SC'";
ctx.fillText('健行四季｜悦动人生', 123, 146);
ctx.font = "16px 'PingFang SC'";
ctx.fillText('2021年中国人寿“700健行”活动', 73, 163);
ctx.font = "36px 'PingFang SC'";
ctx.fillStyle = "#0B3836";
ctx.fillText('风景线路完成证书', 44, 206);
// 地图信息文字
ctx.font = "bold 18px 'PingFang SC'";
ctx.textAlign = 'center';
ctx.fillStyle = "#0B3836";
ctx.fillText(`${mapName}风景线 全程${fullSteps}步`, 375 / 2, 346);
// 详细信息背景
ctx.beginPath();
ctx.moveTo(47, 385);
ctx.lineTo(47, 547);
ctx.arc(57, 547, 10, Math.PI, Math.PI / 2, true);
ctx.lineTo(318, 557);
ctx.arc(318, 547, 10, Math.PI / 2, 0, true);
ctx.lineTo(328, 385);
ctx.arc(318, 385, 10, 0, 1.5 * Math.PI, true);
ctx.lineTo(57, 375);
ctx.arc(57, 385, 10, 1.5 * Math.PI, Math.PI, true);
ctx.fillStyle = "#CDDDDA";
ctx.fill();
ctx.closePath();
// 详细信息
ctx.fillStyle = "#9AACAB";
ctx.textAlign = 'left';
ctx.font = "bold 14px 'PingFang SC'";
ctx.fillText('完成者：', 64, 402);
ctx.fillText('完成时间：', 64, 432);
ctx.fillText('完成时长：', 64, 462);
ctx.fillStyle = "#316C6A";
ctx.fillText(wx.getStorageSync('userInfo').nickName, 140, 402);
ctx.fillText('2021.06.21', 140, 432);
ctx.fillText('04:36:22', 140, 462);
ctx.fillText(`11.00 km ${fullSteps}步`, 64, 502);
ctx.fillText(`${mapName}风景线`, 64, 532);
// 完成图片
const finish = canvas.createImage();
finish.src = '../../../images/finished.png';
finish.onload = () => {
ctx.drawImage(finish, 224, 456, 136, 136);
}
// 公司logo
const logo = canvas.createImage();
logo.src = '../../../images/chinalife-logo.png';
logo.onload = () => {
ctx.drawImage(logo, 108, 94, 160, 28);
}
// 用户头像
const avatar = canvas.createImage();
avatar.src = wx.getStorageSync('userInfo').avatarUrl;
avatar.onload = () => {
ctx.save();
ctx.arc(188, 276, 36, 0, 2 * Math.PI);
ctx.clip();
ctx.drawImage(avatar, 152, 240, 72, 72);
ctx.restore();
console.log(canvas);
wx.canvasToTempFilePath({
canvas: canvas,
x: 0,
y: 0,
width,
height,
destWidth: width,
destHeight: height,
success: res => {
console.log(res);
}
}, this)
}
}
以上是代码片段，报错信息如下[图片] 这里的意思是需要我传入离屏canvas 但是我传入了依旧报错
