Canvas 路径线段厚度 lineWidth
前面我们绘制路径时使用的都是默认粗细，默认值为 1.0
其实 Canvas 还提供了 lineWidth 属性用来设置路径的粗细
ctx.lineWidth 属性
lineWidth 属性用于设置线段厚度的属性 ( 即线段的宽度 )
当获取属性值时，它可以返回当前的值 ( 默认值是1.0 )
当给属性赋值时， 0、 负数、 Infinity 和 NaN 都会被忽略；除此之外，都会被赋予一个新值
语法
ctx.lineWidth = value;
| 值 | 说明 |
|---|---|
| value | 描述线段宽度的数字。 0、 负数、 Infinity 和 NaN 会被忽略 |
范例
下面的代码使用 lineWidth 属性设置线段的宽度
<!DOCTYPE html> <meta charset="utf-8"> <canvas id="canvas-1" width="300" height="150"> </canvas> <script> var c = document.getElementById("canvas-1"); var ctx = c.getContext("2d"); ctx.beginPath(); ctx.moveTo(50,50); ctx.lineWidth = 15; ctx.lineTo(100, 50); ctx.stroke(); </script>
运行结果如下