canvas要素で線の太さを設定する
canvas要素で線の太さを設定するには、context.lineWidthプロパティを使用します。
構文
context.lineWidth = value;プロパティ値
| 値名 | 型 | 説明 |
|---|---|---|
| value | number | 0以上の数値（単位なし） |
指定する値は単位なしで（pxとして）数値で指定します。
また、線は中心から外側へ広がるように描画されます。
サンプルコード
HTML
<canvas width="150" height="150" id="sample"></canvas>JavaScript
var canvasElem = document.getElementById('sample'),
ctx = canvasElem.getContext('2d');
ctx.beginPath();
ctx.lineWidth = 5;
ctx.moveTo(25, 25);
ctx.lineTo(25, 125);
ctx.stroke();デモ
左から1、5、10を設定されたデモです。