内容整理承接:
《数据可视化基础 - canvas基础篇(一):描边与绘制》
2.3.7 填充(fill)
语法:ctx.fill();
解释:填充,是将闭合的路径的内容填充具体的颜色。默认黑色;
图2-14:
2.3.8 快速创建矩形 rect()方法
语法:ctx.rect(x, y, width, height);
解释:x, y是矩形左上角坐标, width和height都是以像素计;
rect方法只是规划了矩形的路径,并没有填充和描边。
2.3.9 快速创建描边矩形和填充矩形
语法: ctx.strokeRect(x, y, width, height);
- 参数跟2.3.8相同,注意此方法绘制完路径后立即进行stroke绘制语法:ctx.fillRect(x, y, width, height);
- 参数跟2.3.8相同, 此方法执行完成后。立即对当前矩形进行fill填充。
2.3.10 清除矩形(clearRect)
语法:ctx.clearRect(x, y, width, hegiht);
解释:清除某个矩形内的绘制的内容,相当于橡皮擦。