canvasrenderingcontext2d.beginpath()
基础库 或更高版本; 若版本较低,建议采取 兼容处理。
主体: 企业支付宝小程序 、 个人支付宝小程序
开始新的路径。
效果示例
代码示例执行效果
代码示例
.js
.axml
page({
oncanvasready() {
my.createselectorquery().select('#canvas').node().exec((res) => {
const canvas = res[0].node
const ctx = canvas.getcontext('2d')
// 第一条路径
ctx.beginpath()
// 设置描边颜色
ctx.strokestyle = "blue"
ctx.moveto(20, 20)
ctx.lineto(200, 20)
ctx.stroke()
// 第二条路径
ctx.beginpath()
ctx.strokestyle = "green"
ctx.moveto(20, 20)
ctx.lineto(120, 120)
ctx.stroke()
// 第三条路径,有两条子路径
ctx.beginpath()
ctx.strokestyle = "red"
// 子路径 1
ctx.moveto(100, 50)
ctx.lineto(280, 50)
// 子路径 2
ctx.moveto(100, 50)
ctx.lineto(200, 150)
ctx.stroke()
})
},
})
<canvas id="canvas" type="2d" onready="oncanvasready">canvas>