欢迎来到it培训的黄埔军校——智游教育!

小强的html5移动开发之路(6)——canvas图形绘制基础-永利国际

于2017-04-10 14:56:16 发表在html5知识库

在前面提到canvas是html5中一个重要特点,canvas功能非常强大,用photoshop可以实现的效果canvas也同样可以实现,下面我们用canvas实现基本图形的绘制。

一、canvas标签的使用



可以看到canvas就像一块画布,我们可以在这个画布上面绘制我们需要的图形。canvas 元素本身是没有绘图能力的。所有的绘制工作必须在 javascript 内部完成。

二、画矩形

 



三、画线条


 
  
 
 

 
 

四、画圆形

 

  

 

 

  

 

  

 



五、渐变

 

  

 

 

  

 

  



六、绘制图片

 

your browser does not support the canvas element.

 

 



七、多边形