javascript - 风险类（基于区域）地图和 HTML/JavaScript

Question

假设我们有一个类似风险的世界地图，它被划分为自定义形状的区域。

如何使用户能够使用 HTML5/JavaScript 选择单个区域？我假设 Canvas2D 是第一步，但接下来呢？

Answer 1

有数以万计的伟大图书馆。仅举几例：

• http://d3js.org/
• http://raphaeljs.com/
• http://paperjs.org/
• http://box2d-js.sourceforge.net/
• http://threejs.org/

具体例子：

• http://bl.ocks.org/mbostock/2206590
• http://raphaeljs.com/world/
• http://raphaeljs.com/australia.html

Answer 2

您可以创建一个地图标签，然后将其添加到您的 img 标签中。在您的地图标签中，您定义了用户可以单击的不同区域。然后，您可以定义要在每个区域的 mousedown 事件上调用的 javascript 函数。

我不喜欢解释，我更喜欢例子！所以这里有一个我刚刚发现的链接可以更好地描述这种技术：

http://www.tutorialspoint.com/javascript/javascript_image_map.htm

顺便说一句，您不需要手动创建区域。有大量所见即所得的工具可以为您创建它！