学PHP >> HTML5专题 >> 关于HTML5 的canvas

关于HTML5 的canvas

查看次数53362 发表时间2012-11-26 22:38:29

<!DOCTYPE HTML>
<html>
<body>

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;">
Your browser does not support the canvas element.
</canvas>

<script type="text/javascript">

var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.fillStyle="#FF0000";
cxt.beginPath();
cxt.arc(70,18,15,0,Math.PI*2,true);//画了一个圆形
cxt.closePath();
cxt.fill();
cxt.moveTo(70,32);//这是一条线，这个坐标表示 线段开始的 x,y
cxt.lineTo(70,50);//这是线段结束的x,y坐标
cxt.stroke();//绘制图形的边线
cxt.moveTo(70,50);
cxt.lineTo(50,80);

cxt.stroke();
cxt.moveTo(70,50);
cxt.lineTo(90,80);
cxt.stroke();
cxt.moveTo(70,32);
cxt.lineTo(50,60);
cxt.stroke();
cxt.moveTo(70,32);
cxt.lineTo(90,60);
cxt.stroke();
</script>

</body>
</html>

(转发请注明转自:学PHP)

学PHP >> HTML5专题 >> 关于HTML5 的canvas

关于HTML5 的canvas

最新发布...

最新推荐...

浏览最多...