Canvas lineWidth 属性
示例
绘制一条线宽为 10 像素的lineWidth
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 10;
// 开始新的路径
ctx.beginPath();
ctx.moveTo(0, 100);
ctx.lineTo(200, 100);
// 绘制路径
ctx.stroke();
尝试一下 »
以下还有更多示例。
描述
lineWidth 属性设置或返回当前线宽，以像素为单位。
默认值为 1 像素。
另请参阅
strokeStyle 属性 (设置描边颜色/样式)
beginPath() 方法 (开始新的路径)
moveTo() 方法 (将路径移动到一个点)
lineTo() 方法 (向路径添加一条线)
stroke() 方法 (绘制当前路径)
strokeRect() 方法 (绘制矩形)
语法
| context.lineWidth = number |
属性值
| 值 | 描述 | 运行 |
|---|---|---|
| number | 当前线宽，以像素为单位 | 运行 » |
示例
绘制一条线宽为 10 像素的lineWidth
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.lineWidth = 10;
ctx.strokeRect(20, 20, 80, 100);
尝试一下 »
浏览器支持
<canvas> 元素是 HTML5 标准 (2014)。
lineWidth 在所有现代浏览器中都得到支持
| Chrome | Edge | Firefox | Safari | Opera | IE |
| 是 | 是 | 是 | 是 | 是 | 9-11 |
❮ Canvas 参考
