小程序 将图片文字变成一整张图片海报,判断其中字符串宽度可通过计算字符串.length*字符宽度

//test.xml
<canvas bindtap='showhaibao' canvas- />
//test.js
data:{ canvasw: '', canvash: '' } //获取小程序码 wx.getSystemInfo({ success: function (res) { that.setData({ canvasw: res.windowWidth + 'px', canvash: res.windowHeight + 'px' }) } }) wx.request({ url: rootDocment + '/a/fenxiang.json', // url: app.globalData.serverUrl + 'getChengXuMa', data: { id: options.id }, success: function (res) { console.log(res.data.data.pic,"aaaaaaaaaaaaa") var res4 = res.data.data.pic//获取小程序二维码 wx.downloadFile({ url: res4, success: function (res) { var res3 = res.tempFilePath//小程序码 console.log(res.tempFilePath, "bbbbbbb") wx.downloadFile({ url: options.pic, success: function (res) { var res2 = res.tempFilePath//商品图片码 wx.getSystemInfo({ success: function (res) { var w = res.windowWidth; var h = res.windowHeight; const ctx = wx.createCanvasContext('myCanvas') ctx.setFillStyle('rgb(243, 243, 243)') ctx.fillRect(0, 0, w, h) ctx.drawImage(res2, (w - 180) / 2, 25, 180, 180)//商品图 ctx.setTextAlign('center') ctx.setFillStyle('rgb(43, 43, 43)') ctx.setFontSize(18) ctx.fillText(options.title, w / 2, 230) ctx.setFillStyle('rgb(255, 0, 0)') ctx.setFontSize(18) ctx.fillText('¥' + options.price, w / 2, 255) ctx.drawImage(res3, (w - 110) / 2, 325, 110, 110)//小程序二维码 ctx.setFillStyle('rgb(43, 43, 43)') ctx.setFontSize(14) ctx.fillText('扫码查看详情', w / 2, 450) ctx.draw(); }, fail: function (e) { console.log(e) } }) } }) } }); } })