画布元素作为链接

Question

我的画布中有一张国家的互动地图。用户可以移动和缩放它。 该地图由该国家的不同地区组成。

我要做的下一件事是当用户在地图上悬停特定国家/地区时（每个区域由功能组成：beginPath，moveTo，lineTo，closePath，fill，stroke），此区域会突出显示，然后在用户点击时在该地区，会出现一些弹出窗口。

实现这个的方法是什么？

Answer 1

感谢GameAlchemist和markE条评论（也感谢markE链接http://dougx.net/map/usmap.html）

我已经解决了：每次mousemove事件触发时，我都会绘制每个区域。但我既不打击也不填补它。因此，在每个closePath方法之后，我使用IsPointInPath（）方法检查鼠标是否悬停在该区域，从那时起我可以突出显示它或做我需要的任何事情。

那里的关键是（感谢https://shifteleven.com/demo/canvas-hit-detection/）我没有填充和描边区域 - 需要计算机资源的东西。我只是绘制隐藏的路径，并检查鼠标是否徘徊这条路径 - 区域。按照上面的链接，它提供了在画布上绘制的多达100000个行星的示例。您可能会注意到绘制这些行星需要一些时间以及它确定点击哪个行星的速度有多快。