微信_小游戏_canvas_基础_笔记2
小技巧
var ctx = canvas.getContext("2d")
console.log("ctx_s_2",ctx);
打印出来的ctx_s_2可以查看信息
上图可以理解是ctx的属性
下图可以理解是ctx的内置函数(展示不完整,可自行打印查看)
下图是函数arc
以函数arc为例,其中length : 5,表示需要5个参数
弧形
ctx.beginPath();
ctx.arc(
100,550, // 圆心坐标 x , y
50, // 圆半径
0, // 开始角度(弧度计算)
Math.PI/180*270, // 结束角度(弧度计算)
false // true为逆时针 false为顺时针
);
ctx.stroke();
Math.PI 可以理解为一个常量
有兴趣的同学可以自行研究 PI / 180 * 度数(参数)
饼状图
画饼状图,其实理解2点
1,弧线闭合
2,第二个开始的弧线,是第一个弧线的结尾
// 画饼状图
ctx.beginPath(