一、先来简单介绍画时钟需要的canvas知识
1.在HTML页面中添加canvas元素,必须定义canvas元素的id属性值以便接下来的调用。
HTML代码:
<canvas id="canvas" class="canvas" width="400" height="400" border:></canvas>
2.使用id寻找canvas元素,在js代码中使用document.getElementById()等方法获取id。
var canvas = document.getElementById("canvas");
3.通过canvas元素的getContext方法来获取其上下文(Context),即创建Context对象,以获取允许绘画的2D环境。
var ctx = canvas.getContext("2d");
4.先来认识一下canvas的绘制方法。
(1)绘制矩形的两种方法:fillRect 和 strokeRect
前者用于绘制用颜色填充(fill)区域的矩形,后者用于绘制轮廊(stroke)或线条。图形指定颜色用到了两个属性,即fillStyle 和 strokeStyle,前者用于指定要