定义和用法
<canvas> 标签定义图形,比如图表和其他图像。
<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。
属性 描述
height:设置 canvas 的高度,width:设置 canvas 的宽度。
定义和用法
getContext("2d") 方法返回一个用于在画布上绘图的环境。
body中创建canvas标签
<canvas id="canvas" width="200" height="200">你的设备不支持canvas标签,请下载最新版本浏览器<canvas>
在脚本中写入
<script>
var canvas = documemt.getElementById("canvas");
var cxt = canvas.getContext("2d");// 获取上下文对象(画笔)
cxt.beginPath();//开始绘制
cxt.moveTo(50,50);//设置开始点
cxt.lineTo(100,100);//放置点
cxt.lineWidth = 20;//设置线的宽度
cxt.strokeStyle = "red";//设置线的颜色
cxt.lineJoin = "round";//设置线变成圆角
cxt.lineCap = "round";
cxt.closePath();//绘制结束
</script>