小程序的canvas怎么插入图片呀?
发布于 4 年前 作者 cwu 12911 次浏览 来自 官方Issues
js代码
//定义全局canvas
    let that = this
    const ctx = wx.createCanvasContext('shareCanvas');
    //绘制背景色
    ctx.setFillStyle('#42d7c8')
    ctx.fillRect(00350700)
    // 标题
    ctx.setFillStyle('#333333')
    ctx.setFontSize(20)
    ctx.font = 'normal bold 15px sans-serif'
    ctx.fillText('绿地新都会'2020)
    // 二维码
    // 填充一个白色矩形
    ctx.setFillStyle('white')
    ctx.setShadow(0516'rgba(185,185,185,0.5)');// 设置阴影
    ctx.fillRect(17140280200)
    wx.downloadFile({
      url'https://file-skg.skg.com/skg.com/20210113/e0abb00dae6f4e0782b002f0831662e6.jpg',
      successres =>{
        console.log("Res",res.tempFilePath)
        ctx.drawImage(res.tempFilePath,10,10,150,150)
      }
    })
    ctx.draw();  //实例化完成

// wxml 代码
<view class="container">
  <canvas  canvas-id="shareCanvas" class='canvas-style'>
  </canvas>
  <view class="linkcopy">
    <text>分享链接</text>
    <text bindtap="uploads">保存图片</text>
  </view>
</view>

2 回复

cardImg 可以是本地或网络路径

放在这,fail 还是要处理一下的还有就是获取图片 建议还是用getImageInfo吧

回到顶部