ホームページ  >  記事  >  ウェブフロントエンド  >  HTML5 在canvas中绘制矩形附效果图_html5教程技巧

HTML5 在canvas中绘制矩形附效果图_html5教程技巧

WBOY
WBOYオリジナル
2016-05-16 15:47:291463ブラウズ
一、绘制矩形

canvas使用原点(0,0)在左上角的坐标系统,x坐标向右递增,y坐标向下递增。

使用绘图环境的矩形绘制函数来绘制矩形。

fillRect(x,y,width,height) : 绘制一个实心的矩形。
strokeRect(x,y,width,height) : 绘制一个空心的矩形。
clearRect(x,y,width,height) : 清除指定的矩形区域,使之完全透明。

二、在canvas中绘制矩形 

复制代码
代码如下:






HTML5





提示:你的浏览器不支持标签




三、绘制效果
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。