使用html5绘制交互式地图？

Question

如何绘制此地图http://www.toytowngermany.com/munich/ubahn_english_small.jpg的交互式版本

我希望用户能够点击中间节点并添加数据！我应该在.svg文件中使用html5画布标签吗？

Answer 1

您可以只使用SVG，并直接使用DOM编写脚本。

你应该看看Raphaël，它允许你做跨浏览器的矢量图形。

http://raphaeljs.com/

Answer 2

有HTML4和标签，可以用来在图片上添加交互区域。

示例：

<img src="image.gif" usemap="#mymap" />

<map name="mymap">
  <area shape="rect" coords="10,10,80,80" onclick="..." />
  <area shape="circle" coords="100,100,80" onclick="..." />
</map>