Клуб API Карт

Три разных слоя с метками: как сделать?

Пост в архиве.
delfinmotorsport
29 ноября 2010, 13:24

Здравствуйте, коллеги!

Стоит такая задача: для карты России нужно сделать три разных слоя меток (условно, красные, жёлтые и зелёные флажки).

По клику вне карты эти слои должны открываться / закрываться. Никаких проблем, всё сделал по этим рекомендациям: http://api.yandex.ru/maps/articles/tasks/map.xml#how-to-add-multiple-maps (то есть создал три дива, в каждом по карте со своим слоем флажков).

А теперь вопрос: как сделать так, чтобы все три слоя флажков отображались одновременно? Можно ли в карте сделать так, чтобы НЕ отображалась подложка (то есть сама карта), а отображались только метки, принадлежащие этой карте?

11 комментариев
у вас судя по всему идеалогическая проблема.
по первому вопросу - просто сделайте так чтобы код создания "флажков" создавал их в одной и тойже карте, если с этим есть проблемы - приведите код

по второму вопросу - да, подложку карты можно убрать\заменить\выключить. Нужное подчеркнуть.
По первому - спасибо, разобрался, сделал разные флажки на одной и той же карте.

Теперь второй вопрос: как по клику на элемент вне карты сделать так, чтобы нужные флажки убирались, а нужные - оставались.

Вот типичный код одного флажка:

var dmitrov = new YMaps.Placemark(new YMaps.GeoPoint(37.511025,56.345073), {style: s});
dmitrov.setBalloonContent("Дмитров

Здесь пройдёт соревнование."+"");
map.addOverlay(dmitrov);

Что нужно сделать, чтобы этот флажок не отображался?
запомнить его где либо во внешних структурах и после чего скрыть.
пример

map.addOverlay(dmitrov);
$("li.dmitrov a").click(function(){
 map.removeOverlay(dmitrov);
 или
 map[$(this).hasClass('selected')?'addOverlay':'removeOverlay](dmitrov);
 $(this).toggleClass('selected);
});



тут подразумевается что у вас есть список с элементом li и классом dmitrov а внутри у него ссылка на которую и кликаем.
Посмотрите вот этот пример:
http://api.yandex.ru/maps/articles/tasks/overlays.xml#how-to-control-groups-from-menu

В нем решается схожая задача.
Хороший пример, спасибо!

Сразу вопрос: там метки показываются по клику на li -a. А как сделать так, чтобы при загрузке все метки были уже показаны?
Эффективнее всего - вызвать на у них click

for (var i = 0; i < groups.length; i++) {
addMenuItem(groups[i], map, YMaps.jQuery("#menu"));
}
YMaps.jQuery('#menu li a').click();

это самый стабильный вариант
Клёвая штука, это ваш Jquery :) Работает, но открываются только две группы меток из трёх - первая и третья...
в начале сделайте

function addMenuItem (group, map, menuContainer) {

// Показывает/скрывает группу меток на карте
-->return...

в цикле

for (var i = 0; i < groups.length; i++) {
addMenuItem(groups[i], map, YMaps.jQuery("#menu")).click();
}
такая конструкция точно должна сработать.
Пожалуйста, уточните.

Было у меня так:

// Создание списка групп
            for (var i = 0; i < groups.length; i++) {
                addMenuItem(groups[i], map, YMaps.jQuery("#menu"));
                YMaps.jQuery('#menu li a').click();
            }
// Показать/скрыть группу на карте
            YMaps.jQuery("" + group.title + "")
                .bind("click", function () {
                    var link = YMaps.jQuery(this);


Делаю так:

// Создание списка групп
for (var i = 0; i < groups.length; i++) { addMenuItem(groups[i], map, YMaps.jQuery("#menu")).click();
}

// Показать/скрыть группу на карте
return YMaps.jQuery;


- получаю пустое место. Что не так?
вы меня совсем не правильно поняли
давайте вернемся на вариант Саши.
после чего я сказал написать

YMaps.jQuery('#menu li a').click();

напишите это ПОСЛЕ цикла.
эта команда совешает клик на всех ссылках

у вас


for (var i = 0; i < groups.length; i++) {
                addMenuItem(groups[i], map, YMaps.jQuery("#menu"));
                YMaps.jQuery('#menu li a').click();
            }



клик на ВСЕХ элементах проиходит каждую итерацию.
итого если у вас три пункта меню будет
создали первый, кликнули(включен)
создали второй, первый выключили, включили второй
создали третий, первый включили, второй выключили, включили третий
Ага, всё понятно! Работает, спасибо большое!