This page is Ready to Use

Notice: The WebPlatform project, supported by various stewards between 2012 and 2015, has been discontinued. This site is now available on github.

setLineDash

Summary

Sets the line dash properties for the stroke.

Method of apis/canvas/CanvasRenderingContext2Dapis/canvas/CanvasRenderingContext2D

Syntax

var object = object.setLineDash(sequence);

Parameters

sequence

Data-type
Array

An array of integers that specifies the length of each “on” and “off” segment.

Return Value

Returns an object of type DOM NodeDOM Node

Examples

This example sets line dash parameters and draws a dashed line across the canvas; it then retrieves the line dash parameters used and writes them into the document.

<canvas id="myCanvas" width="300" height="150" style="border:1px solid blue;"></canvas>
<p>. . .</p>
<script>
var can = document.getElementById("myCanvas");
var ctxt = can.getContext("2d");
ctxt.setLineDash([10, 15]);
ctxt.beginPath();
ctxt.moveTo(0,75);
ctxt.lineTo(300, 75);
ctxt.stroke();
var ldash = ctxt.getLineDash();
for (var i=0; i<ldash.length; i++) {

 document.write(ldash[i] + " ");

}
</script>

Related specifications

W3C HTML Canvas 2D Specification
W3C Candidate Recommendation

Attributions

  • Microsoft Developer Network: Article