Как при помощи api Яндекс Карт выводить разные карты?

Question

[unlik]

В общем при помощи ymaps.geolocation.city определяем город и выводим разные контактные данные.

Но также нужно выводить точку на карте в зависимости от города. Как лучше это сделать?

Answer 1

[Кирилл Ушаков]

У Яндекс есть геокодер https://tech.yandex.ru/maps/geocoder/

Скармливаешь ему адрес (который у вас судя по всему в контактах имеется), он возвращает тебе координаты.

Comments

[unlik]

А как эти координаты подставить в карту?

[Кирилл Ушаков]

Сохроняй их в переменную. И вместо массива координаты передавай их в карту. А вообще штруди api. Мне с телефона не удобно код строчить.

[unlik]

Кирилл Ушаков, Вообще мне нужно не много не так.
У меня сделано на сайте определение города. Если это город А, то нужно вывести карту 1, если город Б, то вывести карту 2, иначе карту 3.

Вывод названия города сделан так

window.onload = function () {
         var city = ymaps.geolocation.city;
         if(city == 'Санкт-Петербург'){
          jQuery("#user-city").text('Санкт-Петербург');
         } else {
          jQuery("#user-city").text('Москва'); }

[Кирилл Ушаков]

Ну тогда задай переменную с координатами и в каждый if присваивайте ей свое значение.

var coords;
If (a)
    coords = [lat1, lng1]
elseif (b)
    coords = [lat2, lng2]
и т.д.

А при сборе карты вместо координат отдаешь ей переменную.

[unlik]

window.onload = function () {
         var city = ymaps.geolocation.city;
         if(city == 'Санкт-Петербург'){
          jQuery("#user-city").text('Санкт-Петербург');
         var coords = [54.633032, 39.719822];
         } else {
          jQuery("#user-city").text('Москва'); }
          var coords = [54.633032, 39.719822];

Вот так почему-то не работает.

[Кирилл Ушаков]

unlik, попробуй вынести переменную за блок, как у меня в примере.

[Кирилл Ушаков]

И у тебя координаты одни и те же. Это просто для примера? Или невнимательность?)

[unlik]

Кирилл Ушаков, Просто для примера. Если из блока переменную вытаскиваю то все работает.

А если объявляю переменную вне блока, а значения присваиваю внутри, то не работает.

[unlik]

Кирилл Ушаков, Все. Разобрался. Нужны было функцию карты внести в блок.

[Кирилл Ушаков]

Не красиво, и не совсем правильно... Но коль пока работает, а там уж красоту в коде навести успеете)

[unlik]

Кирилл Ушаков, Теперь еще один вопрос возник. У меня по всем городам по 1 адресу. А в Москве 3. Как тут быть?

[Кирилл Ушаков]

https://yandex.ru/blog/mapsapi/19856

[unlik]

Кирилл Ушаков, Да не. Как создать третью, четвертую метку я знаю.

Но правильно ли будет если в остальных городах первая метка будет какая нужна, а остальные нулевые?

[Кирилл Ушаков]

А зачем тебе пустые метки. Я так понял, что у тебя теперь в каждом блоке по карте. Для московской создавай несколько маркеров.

[unlik]

Кирилл Ушаков, Не. Карта у меня одна. Но в каждую подставляются разные координаты.

[Кирилл Ушаков]

Создай массив меток, и выводи их в карте перебором. Будет одна, выведется одна, будет три выведется три.

[Кирилл Ушаков]

А вообще покажи код полностью

[unlik]

Кирилл Ушаков,

<script type="text/javascript">

        window.onload = function () {
            var city = ymaps.geolocation.city;
            if (city == 'Наро-фоминск') {
                jQuery("#user-city").text('НАРО-ФОМИНСКИЙ РАЙОН');
            } else if (city == 'Апрелевка') {
                jQuery("#user-city").text('Апрелевка');
            } else if (city == 'Балашиха') {
                jQuery("#user-city").text('Балашиха');
            } else if (city == 'Бронницы') {
                jQuery("#user-city").text('Бронницы');
            } else if (city == 'Видное') {
                jQuery("#user-city").text('Видное');
            } else if (city == 'Дзержинский') {
                jQuery("#user-city").text('Дзержинский');
            } else if (city == 'Дмитров') {
                jQuery("#user-city").text('Дмитров');
            } else if (city == 'Долгопрудный') {
                jQuery("#user-city").text('Долгопрудный');
            } else if (city == 'Домодедово') {
                jQuery("#user-city").text('Домодедово');
            } else if (city == 'Железнодорожный') {
                jQuery("#user-city").text('Железнодорожный');
            } else if (city == 'Жуковски') {
                jQuery("#user-city").text('Жуковский');
            } else if (city == 'Звенигород') {
                jQuery("#user-city").text('Звенигород');
            } else if (city == 'Ивантеевка') {
                jQuery("#user-city").text('Ивантеевка');
            } else if (city == 'Истра') {
                jQuery("#user-city").text('Истра');
            } else if (city == 'Клин') {
                jQuery("#user-city").text('Клин');
            } else if (city == 'Коломна') {
                jQuery("#user-city").text('Коломна');
            } else if (city == 'Королев') {
                jQuery("#user-city").text('Королев');
            } else if (city == 'Котельники') {
                jQuery("#user-city").text('Котельники');
            } else if (city == 'Красноармейск') {
                jQuery("#user-city").text('Красноармейск');
            } else if (city == 'Красногорск') {
                jQuery("#user-city").text('Красногорск');
            } else if (city == 'Лобня') {
                jQuery("#user-city").text('Лобня');
            } else if (city == 'Лосино-Петровский') {
                jQuery("#user-city").text('Лосино-Петровский');
            } else if (city == 'Луховицы') {
                jQuery("#user-city").text('Луховицы');
            } else if (city == 'Лыткарино') {
                jQuery("#user-city").text('Лыткарино');
            } else if (city == 'Люберцы') {
                jQuery("#user-city").text('Люберцы');
            } else if (city == 'Мытищи') {
                jQuery("#user-city").text('Мытищи');
            } else if (city == 'Ногинск') {
                jQuery("#user-city").text('Ногинск');
            } else if (city == 'Одинцово') {
                jQuery("#user-city").text('Одинцово');
            } else if (city == 'Павловский-Посад') {
                jQuery("#user-city").text('Павловский-Посад');
            } else if (city == 'Подольск') {
                jQuery("#user-city").text('Подольс');
            } else if (city == 'Пушкино') {
                jQuery("#user-city").text('Пушкино');
            } else if (city == 'Раменское') {
                jQuery("#user-city").text('Раменское');
            } else if (city == 'Реутов') {
                jQuery("#user-city").text('Реутов');
            } else if (city == 'Серпухов') {
                jQuery("#user-city").text('Серпухов');
            } else if (city == 'Солнечногорск') {
                jQuery("#user-city").text('Солнечногорск');
            } else if (city == 'Фрязино') {
                jQuery("#user-city").text('Фрязино');
            } else if (city == 'Химки') {
                jQuery("#user-city").text('Химки');
            } else if (city == 'Чехов') {
                jQuery("#user-city").text('Чехов');
            } else if (city == 'Щелково') {
                jQuery("#user-city").text('Щелково');
            } else if (city == 'Электрогорск') {
                jQuery("#user-city").text('Электрогорск');
            } else if (city == 'Электросталь') {
                jQuery("#user-city").text('Электросталь');
            } else if (city == 'Очаковское шоссе') {
                jQuery("#user-city").text('Очаковское шоссе');
            } else {
                jQuery("#user-city").text('МОСКВА');
                coords = [55.763833, 37.620393];
                coords_two = [55.824617, 37.609082];
            }

            ymaps.ready(init);

            function init() {

                var myMap;

                myMap = new ymaps.Map("map", {
                    center: coords,
                    zoom: 8
                });

                myMap.behaviors.disable('scrollZoom');

                myMap.controls.add("zoomControl", {
                    position: { top: 15, left: 15 }
                });

                var myPlacemark = new ymaps.Placemark(coords, {
                    // Чтобы балун и хинт открывались на метке, необходимо задать ей определенные свойства.
                    balloonContentBody: "Содержимое <em>балуна</em> метки",
                });
                myMap.geoObjects.add(myPlacemark);

                var myPlacemark = new ymaps.Placemark(coords_two, {
                    // Чтобы балун и хинт открывались на метке, необходимо задать ей определенные свойства.
                    balloonContentBody: "Содержимое <em>балуна</em> метки",
                });
                myMap.geoObjects.add(myPlacemark);

                var circle = new ymaps.Circle([coords, 50000], {}, {
                    geodesic: true,
                    fillColor: "#DB709377",
                    strokeColor: "#990066",
                    strokeOpacity: 0.8,
                    strokeWidth: 2
                });
                myMap.geoObjects.add(circle);
            }

        }

    </script>

[Кирилл Ушаков]

Ну, вместо coords, coords_two будет
coordsArray = [[],[]]

А на карту добавляй через тот же for.

for(var i = 0; i < coordsArray.length; i++) {
var myPlacemark = new ymaps.Placemark(coordsArray[i], {})
Mymap.geoObjects.add(myPlacemark)
}

[unlik]

Ага, спасибо большое! Буду разбираться.

[unlik]

Кирилл Ушаков, Разобрался. Спасибо!!!

Answer 2

[Andrey Tsvetkov]

Хранить заодно geo координаты центра города и формировать карту через тот же яндекс

Comments

[unlik]

Да мне надо проще сделать. Если город А, то вывести карту 1. Если город Б то вывести карту 2.