2023年微信小程序API 绘图setLineWidth（设置线条宽度）
作者: --时间: 2025-06-11 13:57:15
阅读量：150
微信小程序开发中，绘图功能是非常重要的一部分。而setLineWidth方法，便是绘图接口和方法中的一个重要组成部分。
1. 设置线条宽度
在canvasContext中，setLineWidth方法被用来设置线条的宽度，单位为像素px。
2. 参数说明
setLineWidth方法只有一个参数：
| 参数 | 类型 | 说明 |
|---|---|---|
| lineWidth | Number | 表示线条的宽度，单位为px。 |
3. 使用示例
以下代码展示了如何使用setLineWidth方法来设置不同宽度的线条：
const ctx = wx.createCanvasContext('myCanvas')
ctx.beginPath()
ctx.moveTo(10, 10)
ctx.lineTo(150, 10)
ctx.stroke()
ctx.beginPath()
ctx.setLineWidth(5)
ctx.moveTo(10, 30)
ctx.lineTo(150, 30)
ctx.stroke()
ctx.beginPath()
ctx.setLineWidth(10)
ctx.moveTo(10, 50)
ctx.lineTo(150, 50)
ctx.stroke()
ctx.beginPath()
ctx.setLineWidth(15)
ctx.moveTo(10, 70)
ctx.lineTo(150, 70)
ctx.stroke()
ctx.draw()以上代码中，我们首先创建了一个Canvas绘图上下文对象，然后调用beginPath方法开始一条新的路径。接着调用moveTo方法将路径移动到起始点，并用lineTo方法绘制直线，最后调用stroke方法描边。
在绘制多条不同宽度的线段时，可以使用setLineWidth方法来指定不同的线条宽度。
