Specifies the number of pixels to offset the dash pattern.
Property of apis/canvas/CanvasRenderingContext2Dapis/canvas/CanvasRenderingContext2D
Syntaxvar result = CanvasRenderingContext2D.lineDashOffset;
CanvasRenderingContext2D.lineDashOffset = value;
Return Value
Returns an object of type NumberNumber
Default is 0.
ExamplesThis example sets line dash parameters and draws a dashed line across the canvas, using an offset of 3px. The effect of the offset is difficult to see without comparing to the un-offset version. lineDashOffset is often used to achieve simple animation, as in the so-called “marching ants” line effect.
<canvas id="myCanvas" width="300" height="150" style="border:1px solid blue;"></canvas>
. . .
<script>
var can = document.getElementById("myCanvas");
var ctxt = can.getContext("2d");
ctxt.setLineDash([10, 15]);
ctxt.beginPath();
ctxt.lineDashOffset = 3;
ctxt.moveTo(0,75);
ctxt.lineTo(300, 75);
ctxt.stroke();
</script>
Related specifications
Microsoft Developer Network: Windows Internet Explorer API reference Article
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4