小程序画布实现

1. 在.wxml文件中添加以下代码，用于展示画布：

   <canvas canvas-id="myCanvas"></canvas>
   

   2.在.js文件中添加以下代码，用于获取画布对象和绘制

   Page({
     onReady: function (e) {
       // 获取画布对象
       const ctx = wx.createCanvasContext('myCanvas')
   
       // 绘制矩形
       ctx.fillRect(10, 10, 150, 75)
    
       // 绘制圆形
       ctx.beginPath()
       ctx.arc(75, 75, 50, 0, 2 * Math.PI)
       ctx.stroke()
   
       // 绘制文字
       ctx.font = 'bold 20px Arial'
       ctx.fillText('Hello World', 50, 50)
    
       // 绘制图片
       wx.getImageInfo({
         src: 'https://example.com/image.png',
         success(res) {
           ctx.drawImage(res.path, 200, 200, 100, 100)
           ctx.draw()
         }
       })
     }
   })
   

   以上代码实现了在画布上绘制矩形、圆形、文字和图片的功能。需要注意的是，在绘制图片时需要先调用wx.getImageInfo方法获取图片信息。最后需要调用ctx.draw方法将绘制的内容显示在画布上。