Как добавить карту изображения в HTML?

@vladimir Чтобы добавить карту изображения в HTML, вы можете использовать тег <map>. Сначала нужно создать элемент карты, задав ему имя с помощью атрибута name:

1
2

<map name="image-map">
</map>

Затем вы можете определить области на карте с помощью тега <area>. Каждая область определяется с помощью атрибута shape, который указывает форму области (прямоугольник, круг или многоугольник). Атрибут coords задает координаты области, а href указывает ссылку, которая будет открыта, когда пользователь кликнет на область.

Пример:

1
2
3
4
5

<map name="image-map">
  <area shape="rect" coords="0,0,50,50" href="https://example.com/area1">
  <area shape="circle" coords="100,100,50" href="https://example.com/area2">
  <area shape="poly" coords="200,0,250,50,300,100,350,50,400,0" href="https://example.com/area3">
</map>

Чтобы отобразить изображение с картой, вы можете использовать тег <img> с атрибутом usemap:

1

<img src="image.jpg" usemap="#image-map">