1.标签绑定(例举:小程序)
<canvas class=‘canvas‘ id=‘myCanvas‘></canvas> //canvas-id属性:绑定到canvas画布
2.定义canvas小程序APImy.createCanvasContext - 支付宝开放平台 (alipay.com)
const ctx = wx.createCanvasContext(‘myCanvas‘)
3.假如页面进入时需要每秒执行一次(例举:小程序的生命周期)
onShow: function(e) { setInterval(show, 1000); //每秒执行1次 function show() { secshow() minshow() houshow() backshow() numbershow() ctx.draw() //true保留上一次绘制。false不保留上一次绘制 } },
4.绘制的方法
fillRect(x, y, width, height)
绘制一个填充的矩形
strokeRect(x, y, width, height)
绘制一个矩形的边框
clearRect(x, y, widh, height)
清除指定的矩形区域,然后这块区域会变的完全透明。
beginPath()
新建一条路径,路径一旦创建成功,图形绘制命令被指向到路径上生成路径
moveTo(x, y)
把画笔移动到指定的坐标(x, y)。相当于设置路径的起始点坐标。
closePath()
闭合路径之后,图形绘制命令又重新指向到上下文中
stroke()
通过线条来绘制图形轮廓
fill()
通过填充路径的内容区域生成实心的图形
原文:https://www.cnblogs.com/black-eyes/p/14657148.html