1.Html5简介
万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改,目标:HTML5取代HTML4和XHTML2.0成为新标准
2.Canvas基础知识
<canvas>标签的基本结构如下:
<canvas id="myCanvas" width="200" height="200">< /canvas>
var cvs = document.getElementById("myCanvas");
注意:IE 6 7 8不支持 <canvas>标签
var ctx = cvs.getContext("2d");
3.绘制
简单绘制
绘制矩形
rect(x,y,w,h):x、y为起始坐标,w、h为矩形的宽、高
支持这么写:ctx.fillRect(x,y,w,h) 及 ctx.strokeRect(x,y,w,h)
绘制圆形
arc(x,y,r,sa,ea,true/false):
x、y为圆心坐标,r为半径,sa、ea分别为起始角度和结束角度,
true是逆时针画圆,false是顺时针画圆;360度角即2PI弧度,1度就是2PI/360=PI/180弧度
贝塞尔曲线
quadraticCurveTo (cx,cy,ex,ey) 二次贝塞尔曲线,一个控制点,一个结束点
bezierCurveTo (cx1,cy1,cx2,cy2,ex,ey) 三次贝塞尔曲线,两个控制点,一个结束点
远近互联前端小华整理发布,希望能对学习技术的你有所帮助
远近互联专业提供网站建设、APP开发、网站优化、外贸网站SEO、微信运营的品牌整合营销服务,让客户通过网络品牌建立与网络传播提高业绩。