нарисовать интерактивную карту с помощью HTML5?

Question

как нарисовать интерактивную версию этой карты http://www.toytowngermany.com/munich/ubahn_english_small.jpg

Я хочу, чтобы пользователь мог щелкать по промежуточным узлам и добавлять данные!я должен использовать тэг html5 canvas с файлами .svg?

Answer 1

Вы можете просто использовать SVG и писать его напрямую с помощью DOM.

Тебе стоит взглянуть на Рафаэля. Это позволяет делать кросс-браузерную векторную графику.

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>