创建 Javascript 地图时替代 AREA 标记答案

【问题标题】：Alternatives to AREA tag when creating Javascript map创建 Javascript 地图时替代 AREA 标记
【发布时间】：2011-06-25 03:17:27
【问题描述】：

我有一张非常大的地图图片。现在我想创建一个地图 UI，用户可以在其中单击以突出显示区域，并且还具有放大地图的功能。

AREA 标签是解决这个问题的唯一方法吗？我唯一的问题是当我放大地图时，它会被放大，它包含的图像也会被放大，但是我将如何根据我的缩放级别扩展 AREA 坐标？有没有解决这个问题的好方法？

【问题讨论】：

【解决方案1】：

不幸的是，AREA 是表示多边形的唯一方法。您可以从 AREA 标签中读取坐标，对其进行缩放，然后将其写回。舍入重叠是一个痛苦的处理。

另一种方法是使用 BING 地图 API，它允许自定义叠加层。不过，您需要为每个缩放级别创建一个叠加层。

【讨论】：

【解决方案2】：

Apply css to AREA MAP

我建议在那里使用 SVG，这也可以解决您的缩放问题。唯一的问题是 IE8 及以下不支持它，而且 IE9 还没有通过 Windows Update 推送给非 beta 用户。

【讨论】：

【解决方案3】：

简单的选项：ImageMapster 即时为您计算出大多数图像区域地图内容。 IE6+，需要jQuery。

更复杂、更强大的选项：Raphael.js 使您能够在 IE6+（不需要 Flash）中创建完全可控、完全可缩放的 SVG 矢量图形。有点陡峭的学习曲线，但它非常强大。

【讨论】：