Как сделать интерактивную карту?

Question

[dimasibirak]

Добрый день уважаемые форумчане, поставили мне задачу сделать карту России , на ней отметить точки, при наведении должен подсвечиваться регион , при клике должен переходить на страницу региона, так вот в чем вопрос, с помощью каких технологий это будет максимально быстро реализовать?
Что подтянуть и вообще куда копать?
Буду очень благодарен за любой ответ

Comments

[Hyubert]

Начало работы с API
Регионы

Answer 1

[imhuman]

SVG карту с нужным оформлением и маркерами можно сгенерировать тут pixelmap.amcharts.com

Answer 2

[Дима Паутов]

svg. Дизайнер рисует тебе карту России в векторе и отмечает на ней точки, а дальше сам. Иначе ищешь векторную карту в интернете. Если на ней нет нужных точек, то открываешь карту в илюстраторе, рисуешь кружки в нужных местах,. Делов то!!

Есть например такой сервис. Там есть разные карты. Я скинул карту РФ. Но она какая-то не полная, хотя я в географии не силён. Сам часто использовал эту карту

Answer 3

[dummyman]

Есть такой фреймворк openlayers
Вот ссылка на пример openlayers.org/en/latest/examples/select-features.html
там разделение по государствам, нужно будет вместо https://openlayers.org/.../geojson/countries.geojson составить свой файл geojson по областям
Данные берем отсюда gis-lab.info/qa/osm-adm.html
Стили карт берем тут https://www.mapbox.com/maps/
15-30 минут на все и карта готова.

Comments

[Валентин]

Вместо openlayers данные положить можно ведь и на leaflet?
А как конвертнуть это для highcharts компонента? тут прямоугольная система координат.

[dummyman]

Не понимаю что там конвертировать. Данные highcharts уже в формате geojson. Проекция WGS84. Вроде не нарушая стандартов.
С начала файла вырезать вот это:

Highcharts.maps["countries/ru/custom/ru-all-disputed"] =

Остальное - чистый JSON

Answer 4

[svetlov97]

Используй SVG графику.
Документация: https://developer.mozilla.org/ru/docs/Web/SVG

Answer 5

[Валентин]

Вот еще инструмент
https://code.highcharts.com/mapdata/