lineWidth property
Gets or sets the current line width, in pixels.
![]() ![]() |
Syntax
| JavaScript | |
|---|
Property values
Type: number
Standards information
- HTML Canvas 2D Context, Section 6
Examples
The following code example draws a series of lines by using increasing values for the lineWidth property.
<html> <head> <script type="text/javascript"> function draw() { var canvas = document.getElementById("MyCanvas"); if (canvas.getContext) { var ctx = canvas.getContext("2d"); var lStart = 0; var lEnd = 200; var yStart = 5; for (i = 1; i < 16; i++) { ctx.lineWidth = i; ctx.beginPath(); yStart = yStart + (i * 2) + ctx.lineWidth; ctx.moveTo(lStart, yStart); ctx.lineTo(lEnd, yStart); ctx.stroke(); ctx.textBaseline = "middle"; ctx.fillText(ctx.lineWidth, lEnd + 10, yStart); } } } </script> </head> <body onload="draw();"> <canvas id="MyCanvas" width="300" height="600">This browser or document mode doesn't support canvas</canvas> </body> </html>
See also
Show:

