Web前端开发QQ群 110939958-业余程序员

学习canvas

<canvas 是HTML5 中新加入的一个标记
功能是创建一个“画板”对象及一组供javascript使用的API
基本标签的写法是这样的

<canvas width="100" height="100" id="canvas"></canvas>

创建了这个对象以后我们就可以用js来在上面画东西了

首先取得这个对象的引用

var canvas = document.getElementById("canvas");
然后取得绘制对象
var ctx = canvas.getContext("2d");

现在用ctx画一条直线

先把“画笔”放到起始点(0, 0)

ctx.moveTo(0, 0);

然后画线到(50, 50)

ctx.lineTo(50, 50);

把线画出来
ctx.stroke();

就这么简单, 更多的测试看 canvas测试页
Canvas tutorial

没有评论 to “学习canvas”

留下评论:

昵称(必须):
邮箱地址 (不会被公开) (必须):
站点
验证码:
评论 (必须)
XHTML: 您可以使用这些标记: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>