最近开始重新拾起HTML5的东西,这里把简单的图形的画法总结一下(参考韩顺平老师的视频,讲的很不错)
<!--告诉浏览器,这是HTML5网页-->
<!DOCTYPE HTML>
<html>
<!---->
<head>
<!--网页编码采用gbk2312-->
<meta = charset = "gbk2312"/>
<!--网页标题-->
<title>
HTML5 Canvas 测试
</title>
</head>
<body>
HTML5 Canvas
<br>
<img id="image" src="image.jpg"/>
<br>
<!--画布-->
<canvas id = "can1" width = "1000px" height = "600px" style = "border:1px solid red">
</canvas>
<!--定义客户端脚本-->
<script type = "text/javascript">
//1.得到画布
var canvas1 = document.getElementById("can1");
//2.得到上下文引用,可以理解为画笔
var context = canvas1.getContext("2d");
//画直线
//moveTo设置起点的位置
context.moveTo(20