工具/材料
dw等代码编辑软件
操作方法
- 01
先在HTML5页面主体里面添加一个<canvas>标签，定义一张画布（大小，背景颜色）代码如图1；
- 02
在html5的头部嵌入JS代码，并把画布加载到页当中去；如图2
- 03
运行程序，这样我们就可以看到一张刚才定义好的画布了，如图3
- 04
在起点为（50，50）至（200，400）的地方划一条斜线，颜色为红色，如图4
- 05
运行代码，这时候会发现，画布里面多了一条划线，如图5
- 06
在端点为（50，200）的地方在添加一条斜线，线的精细为10，如图6
- 07
运行程序，如图7
- 08
通过linejoin的三种属性“miter、round、bevel”可以把两条线的端点变为尖角、圆角、钝角，代码如图8（变为圆角）
- 09
运行程序，如图9（怎么样，你看到小圆角了吗？）
- End
