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

Posted 2023-03-05

【中文标题】如何测试一个点是不是是二次贝塞尔曲线的一部分？

【英文标题】：How can I test whether a point is part of the quadratic Bézier curve?如何测试一个点是否是二次贝塞尔曲线的一部分？

【发布时间】：2015-07-12 04:16:43

【问题描述】：

我有一个形状，在 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;

【问题讨论】：

Html5 Canvas method isPointInPath determines only the last object 的可能重复项

【参考方案1】：

你有两个选择

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

【讨论】：

谢谢，我需要 isPointInPath :)