CanvasRenderingContext2D:getLineDash() 方法
CanvasRenderingContext2D 接口的 getLineDash() 方法用于获取当前的虚线样式。
语法
js
getLineDash()
参数
无。
返回值
一个数字 Array,用于指定交替绘制线条和间隙(以坐标空间单位)的距离。如果设置元素时的数字是奇数,则数组中的元素会被复制并连接。例如,将虚线设置为 [5, 15, 25] 会得到 [5, 15, 25, 5, 15, 25]。
示例
获取当前虚线设置
此示例演示了 getLineDash() 方法。
HTML
html
<canvas id="canvas"></canvas>
JavaScript
由 setLineDash() 设置,描边由 10 个单位宽的线条组成,每条线之间有 20 个单位的间隙。
js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");
ctx.setLineDash([10, 20]);
console.log(ctx.getLineDash()); // [10, 20]
// Draw a dashed line
ctx.beginPath();
ctx.moveTo(0, 50);
ctx.lineTo(300, 50);
ctx.stroke();
结果
规范
| 规范 |
|---|
| HTML # dom-context-2d-getlinedash-dev |
浏览器兼容性
加载中…