Question

我试图使用区域标记在 HTML5 中制作矩形和多边形，因为我们知道何时更改任何部分或div的位置或我们可以看到的任何更改。当我们改变时，它显示结果的同一时刻（使用Chrome）。但是当我试图给RECT或POLY提供不同的线时，结果不能显示，我必须点击其他地方的屏幕才能看到生成的线，它们现在所处的位置 E.G

<map name="usaMap" id="usaMap">
  <area id="ak" shape="rect" coords="76,347,138,408" href="#" alt="Usa_map" />
</map>

现在，当我更换电线时，我想要RECT中的实时更改，是否可能？在任何浏览器中或通过任何技术？

Answer 1

SVG似乎是一个很好的解决方案。

有许多美国各州的SVG地图可供免费使用。

每个州都由一个路径表示 - 就像一个CSS区域地图。

但由于每个状态路径都是DOM元素，因此您可以为这些SVG路径分配事件处理程序，当用户将鼠标悬停在每个状态上时，这些路径会突出显示各个状态。

您还可以使用CSS访问器获取任何状态路径，并使用javascript更改该状态的属性。例如，您可以以编程方式将阿拉斯加的填充颜色更改为绿色。

以下是美国的SVG地图示例，用于突出显示悬停时的每个州。

http://jqvmap.com/

我看到你在你的问题上放了Html5-Canvas标签。这是一个以SVG地图开始并在Canvas上绘制地图的示例。

http://davidlynch.org/projects/maphilight/docs/demo_usa.html

映射图像以显示国家/地区的状态

1 个答案: