首页 > 代码库 > canvas 的学习

canvas 的学习

canvas 绘制直线的API有:

1.moveTo()起点坐标。

2.lineTo()绘制的直线

3. fillStyle以及 flii()是绘制实体的

4. strokeStyle 和stroke()用来绘制边框的

5. beginPath()和closePath()开始新的状态。

注意: 

1.canvas的作用于直线的时候是基于状态的处理。一般都在beginPath()和closePath() 中使用


线条line的各种属性:

1.lineWidth

2.lineCap有几个值butt(default),round,square等,作用于非链接处。

3.lineJoin 的值有miter(default),bevel,round作用于链接处。这里的注意一点是:miter的时候有个默认的

miterlimit=10。如果尖锐程度超过10则会转成bevel。当然可以手动的调节miterlimit值大小。

 

在进行图形变换的时候,有以下变换函数:

translate(x,y)平行的位移

rotate(deg) 旋转度

scale(sx,sy)缩放的倍数。 

由于canvas的图形变换是叠加进行的,所以又有两个API :save(),restore()。 

 这样状态这间就不会相互叠加啦。

当然tranform是 一个综合的矩阵函数。可以进行研究下。

 

canvas 的学习