如何测试一个点是否是二次贝塞尔曲线的一部分？

Question

我有一个形状，在 HTML5 画布中，用 JavaScript 绘制：

ctx.beginPath();
ctx.moveTo(25,0);
ctx.quadraticCurveTo(50,50,40,100);
ctx.lineTo(33,100);
ctx.quadraticCurveTo(50,50,20,0);
ctx.fill();
ctx.closePath();

如果点击我的画布，我如何检测到我点击了这个形状？

canvas.addEventListener("click",function(e){
     alert(isItPartOfTheShape(e.clientX,e.clientY));
})

function isItPartOfTheShape(x,y){
     /* Here comes the code which detects is it part of the shape */
     return isIt;
}

Answer 1

你有两个选择

1. 在 Javascript 中实现多边形点代码和贝塞尔曲线计算
2. 您可以使用context.isPointInPath，但它要求您在进行测试时重建形状（该函数仅根据当前路径检查指定点，即调用fill 填充的路径）