在小程序中使用Canvas繪圖需要先在頁面的wxml文件中添加一個canvas標簽，然后在js文件中獲取canvas的上下文對象進行繪圖操作。
以下是一個簡單的示例：
在wxml文件中添加canvas標簽：
<canvas canvas-id="myCanvas"></canvas>
在js文件中獲取canvas的上下文對象并進行繪圖操作：
Page({
onReady: function() {
const ctx = wx.createCanvasContext('myCanvas');
// 設置畫筆顏色
ctx.setFillStyle('red');
// 繪制矩形
ctx.fillRect(10, 10, 50, 50);
// 繪制文字
ctx.setFontSize(20);
ctx.fillText('Hello, Mini Program!', 10, 80);
// 繪制圖片
wx.getImageInfo({
src: 'https://example.com/image.jpg',
success: function(res) {
ctx.drawImage(res.path, 10, 120, 100, 100);
ctx.draw();
}
});
}
});
以上代碼中，我們通過wx.createCanvasContext(‘myCanvas’)獲取了canvas的上下文對象ctx，并使用ctx進行了一些簡單的繪圖操作，包括繪制矩形、文字和圖片。最后通過ctx.draw()方法將繪制的內容顯示在canvas上。
