Canvas reference: The lineDashOffset property

The lineDashOffset property is used to set the offset into the dash setting at which to begin

The lineDashOffset option is an array property, that is used to set the pattern of the lineDash when drawing lines. For example you can use this setting to make a dotted line or a spaced out dash pattern. By increasing this property over time you can also create an animation effect.

An example

<script>
    window.onload = function ()
    {
        var canvas  = document.getElementById("cvs");
        var context = canvas.getContext('2d');

        context.lineDashOffset = 3;
        context.setLineDash([3,6]);
        context.beginPath();
        context.arc(125,125,50,0,2 * Math.PI, false);
        context.stroke();
    }
</script>

See also:

• The getLineDash function
• The setLineDash function
• An example of HTML5 canvas dotted and dashed lines