算是自己学习做的笔记吧
学习路径:MDN,canvas教程
canvas标签
<canvas id="tutorial" width="150" height="150"></canvas>
//定义图形,比如图表和其他图像
//只是图形的容器,需要使用脚本绘图
//没有设置宽高时,初始化宽度为300px高度为150px
//css也可以设置样式,但建议使用width和height属性
浏览器不支持canvas的时候
<canvas id="tutorial" width="150" height="150">不支持canvas</canvas>
//在浏览器不支持画布的时候,会显示标签包裹的内容,支持时不显示
//可以包裹图片,如下
<canvas id="tutorial" width="150" height="150">
<img src="images/clock.png" width="150" height="150" alt=""/>
</canvas>
渲染上下文
var canvas = document.getElementById('tutorial');
var ctx = canvas.getContext('2d');
检查支持性
var canvas = document.getElementById('tutorial');
if(canvas.getContext){
var ctx = canvas.getContext('2d');
//true
}else{
//false
}
方法
getContext("2d")//获取渲染上下文