Как реализована эта интерактивная карта?

A
На сайте с 12.10.2011
Offline
193
167

Всем привет.

Есть опыт работы с Yandex Map API. Делал небольшой проект, метки проставлял в js вручную (а точнее скриптом, их много).

Заинтересовала такая карта turistka.ru/altai/map.php

Хочу повторить, но не пойму как она делается? Неужели вручную каждую метку или есть конструктор? В js коде вроде не нашел по метках, значит как-то по другому..

Спасибо

T7
На сайте с 19.09.2018
Offline
63
#1
alexverem :

Всем привет.

Есть опыт работы с Yandex Map API. Делал небольшой проект, метки проставлял в js вручную (а точнее скриптом, их много).

Заинтересовала такая карта turistka.ru/altai/map.php

Хочу повторить, но не пойму как она делается? Неужели вручную каждую метку или есть конструктор? В js коде вроде не нашел по метках, значит как-то по другому..

Спасибо

https://yandex.ru/dev/maps/jsbox/2.0/placemark

https://yandex.ru/dev/maps/jsbox/2.0/clusterer_create

Для начала.

Потом, F12 и можно найти XHR, которые содержат примерно такое:

"features": [
{"o_type": 7, "id": "o10", "geometry": {"type": "Point", "coordinates": [50.156721, 86.306668]}, "properties": { "hintContent": "Турбаза &#147;Высотник&#148;", "balloonContent": "<div class=desc style='line-height: 1.3;'><a target=_blank href=/altai/info.php?ob=10><img align=left style='padding-right:10px;' src=/im/11/t_bazavisotnik_14.jpg> <b>Турбаза &#147;Высотник&#148;</b></a> &#151; Расположена на берегу Катуни возле поселка Тюнгур. Проживание в 2-х и 4-х местных номерах благоустроенной деревянной гостиницы или турприюте, в своих палатках. Баня, кафе, аил для семинаров, тренингов на 100 человек, пантовые ванны, экскурсии.</div>", "clusterCaption": "Турбаза &#147;Высотник&#148;"}},

.....

А дальше все ясно.

Песочница — Технологии Яндекса
  • yandex.ru
JavaScript API Яндекс.Карт: описание, документация, примеры использования. JS API позволяет встроить на сайт или в приложение через WebView карту с поиском по топонимам и организациям, строить маршруты и смотреть панорамы. JavaScript API можно использовать в проектах для геоаналитики и визуализации данных.
LEOnidUKG
На сайте с 25.11.2006
Offline
1742
#2
timo-71 #:


А дальше все ясно.

Вы вопроса не поняли. Человек хочет щёлкнуть 1 раз на кнопку "Сделать круто!" и у него по волшебству расставятся точки на карте. Это же программирование, там же все волшебники.

✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/ ✅ Настройка и оптимизация серверов https://getmanyspeed.ru/
S
На сайте с 30.09.2016
Offline
469
#3
alexverem :
Хочу повторить, но не пойму как она делается
Через Yandex Map API и делается.

Подгрузка объектов через /altai/objson.php

Странный вопрос, если "есть опыт работы с Yandex Map API".

Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.
A
На сайте с 12.10.2011
Offline
193
#4
LEOnidUKG #:

Вы вопроса не поняли. Человек хочет щёлкнуть 1 раз на кнопку "Сделать круто!" и у него по волшебству расставятся точки на карте. Это же программирование, там же все волшебники.

В гугле вроде через конструктор можно сделать, или я что-то путаю? Вот напр (сделано в интерфейсе):

https://www.google.com/maps/d/embed?mid=1gDqPm51Ip5Nzhnhqr-8jtORL0-ENILPc

Может я не въехал и функционала меньше, но вроде все необходимое есть.

Карта Горного Алтая (Google Мои карты)
Карта Горного Алтая (Google Мои карты)
  • www.google.com
Карта Горного Алтая с основными туристическими местами
LEOnidUKG
На сайте с 25.11.2006
Offline
1742
#5

Ну и у Яндекса есть конструктор: https://yandex.ru/map-constructor

Вопрос же был, про как расставить точки? Через скрипты или в ручную.

A
На сайте с 12.10.2011
Offline
193
#6
LEOnidUKG #:

Ну и у Яндекса есть конструктор: https://yandex.ru/map-constructor

Вопрос же был, про как расставить точки? Через скрипты или в ручную.

Скажите в чем преимущество API перед конструктором? Кроме того случая, когда из базы данных нужно расставить много точек с данными на лету, тут да, API рулит. В начале топика я привел пример карты, конструктором такую реально сделать?

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий