canvas 两个圆相交重叠区域颜色填充_canvas-isPointPath

含义: Canvas中很多交互的行为离不开这个属性，isPointInPath(x , y)是Canvas 2D API用于检测某点是否在路径的描边内（包括路径上）的方法，返回值是布尔值
语法：
isPointInPath(x , y): x代表的横坐标，y代表的纵坐标
注意: 要记住其方法是针对路径的，canvas中绘制路径 arc rect方法都是可以使用该方法，判断鼠标是否位于该路径范围内，包括路径上
isPointInPath()不支持canvas自带的两个方法fillRect(),strokeRect();
可以使用下面两种方法替换

ctx.rect(x,y,w,h);
ctx.stroke(); //替代strokeRect();

ctx.rect(x,y,w,h);
ctx.fill(); //替代fillRect();

栗子：
我们来一个饼状图，每一块都是一个闭合的路径区域，当鼠标移动至某一块区域内则，填充色为红色

isPointPath.gif

JS

1. 初始

var canvas =