Клуб API Карт

Footer в Яндекс.Картах

Святослав Поляков
12 ноября 2013, 14:20

 

Почему в выделеном я не могу установить правильные телефонные номера? Указывается только последний. Дело в асинхронности? Если да то как быть?

 

type="text/javascript"></script>
<script type="text/javascript">
// Как только будет загружен API и готов DOM, выполняем инициализацию //window.onload = function () { ymaps.ready(tinit);};
ymaps.ready(tinit);
var cgs_whArray = [{
    id: "304481",
    request: "428000, Чувашская Республика - Чувашия, Чебоксары г, Лапсарский проезд, дом № 2",
    phone: "+7 (8352) 50 50 28, 50 50 01",
    state: "Чувашская Республика - Чувашия",
    coordAr: []
}, {
    id: "304482",
    request: "300031, Тульская обл, Тула, ул. Металлургов 100 а",
    phone: "8-800-700-14-61",
    state: "Тульская обл",
    coordAr: []
}, {
    id: "304475",
    request: "301602, Тульская обл, Узловский р-н, Узловая г, 14 Декабря ул, дом № 3, корпус 1",
    phone: "",
    state: "Тульская обл",
    coordAr: []
}, {
    id: "304474",
    request: "300012, Тульская обл, Тула г, Ф.Энгельса ул, дом № 149",
    phone: "+7 (4872) 35 14 68",
    state: "Тульская обл",
    coordAr: []
}, {
    id: "304472",
    request: "300036, Тульская обл, Тула г, Одоевское ш, дом № 75",
    phone: "+7 (4872) 70 10 81, 70 23 25, 70 23 26",
    state: "Тульская обл",
    coordAr: []
}, {
    id: "304480",
    request: "430030, Мордовия Респ, Саранск г, Титова ул, дом № 8",
    phone: "+7 (8342) 24 35 50, 24 59 14",
    state: "Мордовия Респ",
    coordAr: []
}, {
    id: "304479",
    request: "160000, Вологодская обл, Вологда г, Гагарина ул, дом № 89",
    phone: "+7 (8172) 52 77 49, факс 52 77 48",
    state: "Вологодская обл",
    coordAr: []
}, {
    id: "304478",
    request: "603108, Нижегородская обл, Нижний Новгород г, Кузбасская ул, дом № 1",
    phone: "+7 (831) 274 87 57, 274 87 58",
    state: "Нижегородская обл",
    coordAr: []
}, {
    id: "304477",
    request: "440034, Пензенская обл, Пенза г, Металлистов ул, дом № 9 В",
    phone: "+7 (8412) 20 58 01, 20 58 02",
    state: "Пензенская обл",
    coordAr: []
}, {
    id: "304473",
    request: "150044, Ярославская обл, Ярославль г, Промышленная ул, дом № 16",
    phone: "+7 (4852) 67 27 31, 67 27 32",
    state: "Ярославская обл",
    coordAr: []
}, {
    id: "304471",
    request: "170017, Тверская обл, Тверь г, Подъездной проезд, дом № 6",
    phone: "+7 (4822) 49 46 47",
    state: "Тверская обл",
    coordAr: []
}, {
    id: "304470",
    request: "392000, Тамбовская обл, Тамбов г, Бастионная ул, дом № 23",
    phone: "+7 (4752) 73 79 83, 44 57 30",
    state: "Тамбовская обл",
    coordAr: []
}, {
    id: "304469",
    request: "214000, Смоленская обл, Смоленск г, Соболева ул, дом № 104",
    phone: "+7 (4812) 38 16 89, 38 24 51",
    state: "Смоленская обл",
    coordAr: []
}, {
    id: "304468",
    request: "390000, Рязанская обл, Рязань г, Полевая ул, дом № 73",
    phone: "+7 (4912) 25 79 59, 25 36 64",
    state: "Рязанская обл",
    coordAr: []
}, {
    id: "304467",
    request: "302016, Орловская обл, Орел г, Городская ул, дом № 48",
    phone: "+7 (4862) 73 72 74, 73 72 90",
    state: "Орловская обл",
    coordAr: []
}, {
    id: "304466",
    request: "398032, Липецкая обл, Липецк г, Универсальный проезд, дом № 2",
    phone: "+7 (4742) 50 50 22, 50 50 23",
    state: "Липецкая обл",
    coordAr: []
}, {
    id: "304465",
    request: "305023, Курская обл, Курск г, Нижняя Луговая 1-я ул, дом № 1",
    phone: "+7 (4712) 74 06 01, 74 06 02, ф. 74 06 00",
    state: "Курская обл",
    coordAr: []
}, {
    id: "304464",
    request: "156000, Костромская обл, Кострома г, Петрковский б-р, дом № 24",
    phone: "+7 (4942) 42 40 21, 42 40 11",
    state: "Костромская обл",
    coordAr: []
}, {
    id: "304463",
    request: "248011, Калужская обл, Калуга г, Трифоновская ул, дом № 16 А",
    phone: "+7 (4842) 22 12 88, 22 50 76",
    state: "Калужская обл",
    coordAr: []
}, {
    id: "304462",
    request: "153009, Ивановская обл, Иваново г, Лежневская ул, дом № 183",
    phone: "+7 (4932) 23 06 67, 23 06 57, 49 16 57",
    state: "Ивановская обл",
    coordAr: []
}, {
    id: "304461",
    request: "394026, Воронежская обл, Воронеж г, Московский пр-кт, дом № 11",
    phone: "+7 (4732) 61 09 49, 39 28 91, ф. 46 61 86",
    state: "Воронежская обл",
    coordAr: []
}, {
    id: "304460",
    request: "600035, Владимирская обл, Владимир г, Куйбышева ул, дом № 4",
    phone: "+7 (4922) 36 19 48",
    state: "Владимирская обл",
    coordAr: []
}, {
    id: "304459",
    request: "241035, Брянская обл, Брянск г, Бурова ул, дом № 20",
    phone: "+7 (4832) 71 79 60",
    state: "Брянская обл",
    coordAr: []
}, {
    id: "304458",
    request: "308015, Белгородская обл, Белгород г, Левобережная ул, дом № 22",
    phone: "+7 (4722) 20 73 59",
    state: "Белгородская обл",
    coordAr: []
}];
var myMap;
var myPlacemark;
function tinit() {
    // Создание экземпляра карты и его привязка к контейнеру с // заданным id ("map")
    var myMap = new ymaps.Map('map', {
        center: [ymaps.geolocation.latitude,
            ymaps.geolocation.longitude
        ],
        zoom: 5,
        behaviors: ['default',
            'scrollZoom'
        ]
    });
    myMap.controls
    // Кнопка изменения масштаба
    .add('zoomControl')
    // Список типов карты
    .add('typeSelector')
    // Стандартный набор кнопок
    .add('mapTools');
    for(var key in cgs_whArray) {
        var search_query = cgs_whArray[
            key].request;
        ymaps.geocode(search_query, {
            results: 1
        })
            .then(function (res) {
                res.geoObjects.get(0)
                    .properties
                    .set(
                        'balloonContentFooter',
                        cgs_whArray[key]
                        .phone);
                console.log(res.geoObjects
                    .get(0)
                    .properties.getAll()
                );
                myPlacemark = new ymaps
                    .Placemark(res.geoObjects
                        .get(0)
                        .geometry
                        .getCoordinates(), {
                            hintContent: res
                                .geoObjects
                                .get(0)
                                .properties
                                .get(
                                    'text'
                            ),
                            balloonContentHeader: res
                                .geoObjects
                                .get(0)
                                .properties
                                .get(
                                    'description'
                            ),
                            balloonContentBody: res
                                .geoObjects
                                .get(0)
                                .properties
                                .get(
                                    'name'
                            ),
                            balloonContentFooter: res
                                .geoObjects
                                .get(0)
                                .properties
                                .get(
                                    'balloonContentFooter'
                            )
                        }, {
                            // Опции. // Необходимо указать данный тип макета.
                            iconLayout: 'default#image',
                            // Своё изображение иконки метки.
                            iconImageHref: '/outpost/paw.png',
                            // Размеры метки.
                            iconImageSize: [
                                30, 42
                            ],
                            // Смещение левого верхнего угла иконки относительно // её "ножки" (точки привязки).
                            iconImageOffset: [-
                                3, -42
                            ]
                        });
                myMap.geoObjects.add(
                    myPlacemark);
            });
    }
};

 

14 комментариев
Подписаться на комментарии к посту

Вам надо почитать, как работают замыкания в JavaScript. У вас в переменной  key хранится последнее значение, которое эта переменная приняла при итерациях цикла. Это решается разными программными способами.

Святослав Поляков
13 ноября 2013, 07:43

Ято почитаю, а про способы можно конкретнее?

Использование замыкания и есть один из способов

Святослав Поляков
13 ноября 2013, 11:24

Разобрался. Еще вопрос. Какой способ, кроме неработающего

https://github.com/dimik/ymaps/blob/master/bounds-collection.js

есть еще вместо GeoCollectionBounds в картах 2.0?

 

Неработает, потому что постоянно выдает ошибки. Я с яваскриптом недавно поэтому надеюсь на помощь.

У коллекций уже давно есть метод getBounds

тот способ что Вы указали работал пока его не было

Святослав Поляков
13 ноября 2013, 11:53

Но какой объект создавать для коллекции. Можно пример как для массива координат получить этот getBounds? В песочнице не нашел. Бабушка. Помоги.:))))))))))))

Через АПИ так сделать не получится.

Твои координаты должны быть добавлены на карту в качестве меток или иной геометрии.

Если надо без добавления меток, ты можешь использовать алгоритм из того примера с гитхаба (считать через Math.min, Math.max) для каждой метки, но этот способ не учитывает переход через нулевой меридиан, т.е. если у тебя есть точки в районе Берингова пролива, он будет считать неправильно, а для России, пойдет.

Святослав Поляков
13 ноября 2013, 12:26

Они добавлены. 

 

var myMap;

var myPlacemark;

 

 

        function tinit() {

// Создание экземпляра карты и его привязка к контейнеру с

            // заданным id ("map")

myMap = new ymaps.Map('map', {

center: [ymaps.geolocation.latitude, ymaps.geolocation.longitude],

zoom: 5,

behaviors: ['default', 'scrollZoom']

});

            myMap.controls

                    // Кнопка изменения масштаба

                    .add('zoomControl')

                    // Список типов карты

                    .add('typeSelector')

                    // Стандартный набор кнопок

                    .add('mapTools');

            

            for (var key in cgs_whArray)( function(key)  

{

                var search_query = cgs_whArray[key].request;

                ymaps.geocode(search_query, {results: 1}).then(function (res) {

 

cgs_whArray[key].coordAr = res.geoObjects.get(0).geometry.getCoordinates();

 

//console.log(res.geoObjects.get(0).properties.getAll());

 

myPlacemark = new ymaps.Placemark(res.geoObjects.get(0).geometry.getCoordinates(), {

hintContent:  res.geoObjects.get(0).properties.get('text'),

balloonContentHeader: res.geoObjects.get(0).properties.get('description'),

balloonContentBody: res.geoObjects.get(0).properties.get('name'),

balloonContentFooter: 'Тел: ' + cgs_whArray[key].phone

}, {

// Опции.

// Необходимо указать данный тип макета.

iconLayout: 'default#image',

// Своё изображение иконки метки.

iconImageHref: '/outpost/paw.png',

// Размеры метки.

iconImageSize: [30, 42],

// Смещение левого верхнего угла иконки относительно

// её "ножки" (точки привязки).

iconImageOffset: [-3, -42]

});

                  

myMap.geoObjects.add(myPlacemark);

});

})(key);

        };

 

Просто храняться в виде массива.

var cgs_whArray = [{    id: "304481",    request: "428000, Чувашская Республика - Чувашия, Чебоксары г, Лапсарский проезд, дом № 2",    phone: "+7 (8352) 50 50 28, 50 50 01",    state: "Чувашская Республика - Чувашия",    coordAr: []}, {    id: "304482",    request: "300031, Тульская обл, Тула, ул. Металлургов 100 а",    phone: "8-800-700-14-61",    state: "Тульская обл",    coordAr: []}, {    id: "304475",    request: "301602, Тульская обл, Узловский р-н, Узловая г, 14 Декабря ул, дом № 3, корпус 1",    phone: "",    state: "Тульская обл",    coordAr: []}, {    id: "304474",    request: "300012, Тульская обл, Тула г, Ф.Энгельса ул, дом № 149",    phone: "+7 (4872) 35 14 68",    state: "Тульская обл",    coordAr: []}];

Ну так выстави область видимости по области занимаемой коллекцией myMap.geoObjects

Святослав Поляков
13 ноября 2013, 12:41

А можно не добавлять их на карту второй раз? Т.е.

 

var collection = new ymaps.GeoObjectCollection();

            for(var k_tmp_indAr in tmp_indAr)

{

                for(var k_cgs_whArray in cgs_whArray)

{

                    if((cgs_whArray[k_cgs_whArray]).id == tmp_indAr[k_tmp_indAr])

{

var placemark = new ymaps.Placemark(cgs_whArray[k_cgs_whArray].coordAr);

collection.add(placemark);

                    }

                }

            }

myMap.setBounds(collection.getBounds(), {checkZoomRange: true});

можно, как я писал выше myMap.geoObjects - тоже коллекция,

можно сделать так

myMap.setBounds(myMap.geoObjects.getBounds());

 

Святослав Поляков
13 ноября 2013, 12:53

Без привязки к карте можно? Мне не все объекты нужны. А лишь часть. Ну к примеру.... ПОказать все магазины в питере и/или ленинградской области. 

Святослав Поляков
13 ноября 2013, 12:55

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

Добавлять метки в отдельные коллекции, и выставлять bounds по ним

илбо хранить его значение отдельно для каждой области