anvasRenderingContext2D
.getLineDash()
是 Canvas 2D API 获取当前线段样式的方法。
语法
ctx.getLineDash();
返回值
一个 Array
数组。一组描述交替绘制线段和间距(坐标空间单位)长度的数字。如果数组元素的数量是奇数,数组元素会被复制并重复。 例如, 设置线段为 [5, 15, 25]
将会得到以下返回值 [5, 15, 25, 5, 15, 25]。
示例
使用 getLineDash
方法
这是一段使用 getLineDash
方法的简单的代码片段。
HTML
<canvas id="canvas"></canvas>
JavaScript
var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); ctx.setLineDash([5, 15]); console.log(ctx.getLineDash()); // [5, 15] ctx.beginPath(); ctx.moveTo(0,100); ctx.lineTo(400, 100); ctx.stroke();
修改下面的代码并在线查看 canvas 的变化:
规范描述
Specification | Status | Comment |
---|---|---|
WHATWG HTML Living Standard CanvasRenderingContext2D.getLineDash |
Living Standard |
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | 27 (27) | 11 | (Yes) | (Yes) |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | 27.0 (27) | (Yes) | (Yes) | (Yes) |
Gecko-specific 注解
- 从 Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4) 开始,不标准并且不赞成使用的属性
mozDash
已经实现了设置和获取线段列表的功能。这个属性不被赞成使用,将来会被移除,请看 bug 931643。 使用getLineDash()
代替。
WebKit-specific 注解
- 基于 WebKit-based 的浏览器 (例如 Safari),除了此方法外,不标准并且不赞成使用的属性
webkitLineDash
已经被实现。 使用getLineDash()
代替。