context.stroke()
结合前面的几步,就可以得到画出一条直线,如下所示:
4、线的样式
1、线的宽度
使用画布中的lineWidth属性可以定义线的宽度,该属性的取值为数值(不带单位),以像素为计量。
语法如下:
context.lineWidth=‘10’;
2、描边颜色
使用画布中的strokeStyle属性可以定义线的描边颜色,该属性的取值为十六进制颜色值或颜色英文。
语法如下:
//以下两种方式都可以设置
context.strokeStyle=‘#f00’;
//context.strokeStyle=‘red’;
3、端点形状
默认情况下,线的端点是方形的,通过画布中的lineCap属性可以改变端点的形状。
lineCap=’属性值’
常见的属性值有:
| 属性值 | 显示效果 |
| — | — |
| butt(默认值) | 默认效果,无端点,显示直线方形边缘 |
| ro