canvascontext.setlinedash(number[] segments)
支付宝客户端 支持
支小宝客户端 支持
安诊儿客户端 支持
主体: 企业支付宝小程序 、 个人支付宝小程序
相关文档: 旧版 canvas 迁移指南
设置虚线样式。
影响后续、
、
使用的线条样式。
若要重置为实线,可传入空数组。
效果示例
代码示例运行效果
默认标题0
number[] segments
一组用于描述交替绘制线段和间距长度的数字。奇数长度的数组会被复制拼接成偶数长度的数组再处理,例如,[1, 2, 3] 会被当做 [1, 2, 3, 1, 2, 3] 处理。如果传入空数组,则线条将重置为实线。
代码示例
.js
.axml
const ctx = my.createcanvascontext('canvas')
ctx.beginpath()
// 画10像素实线,空出20像素,画10像素实线,空出20像素...以此交替
ctx.setlinedash([10, 20])
ctx.moveto(0, 50)
ctx.lineto(300, 50)
ctx.stroke()
ctx.beginpath()
// 会变成 [5, 15, 25, 5, 15, 25]
ctx.setlinedash([5, 15, 25])
ctx.moveto(0, 80)
ctx.lineto(300, 75)
ctx.stroke()
ctx.beginpath()
// 画20像素实线,空出3像素,画3像素实线,空出3像素...
ctx.setlinedash([20, 3, 3, 3, 3, 3, 3, 3])
ctx.moveto(0, 100)
ctx.lineto(300, 100)
ctx.setfontsize(50)
ctx.stroketext('hello world', 50, 150)
ctx.stroke()
ctx.draw()
<canvas id="canvas">canvas>