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、微信运营的品牌整合营销服务，让客户通过网络品牌建立与网络传播提高业绩。

Canvas画布 怎么使用Canvas画布