Клуб API Карт

Управление группами объектов с помощью меню

Пост в архиве.

есть статья http://api.yandex.ru/maps/articles/tasks/overlays.xml#how-to-control-groups-from-menu

в ней описанно как сделать отображение групп объектов с помощью меню. Конкретно в примере представлены группы меток.

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

Если не сложно с примером)

7 комментариев
Создайте по аналогии с функцией createPlacemark функцию для создания ломаных, например createPolyline и используйте ее.

Как вариант, она может выглядеть следующим образом:

function createPolyline (points, name, description) {
   var polyline = new YMaps.Polyline(points);
   polyline.name = name;
   polyline.description = description;
   retrun polyline;
}

Все остальное остается идентичным.
Стиль также можете передавать дополнительными параметром.
function createPolyline (points, name, description, style) {
   var polyline = new YMaps.Polyline(points, { style : style });
   polyline.name = name;
   polyline.description = description;
   retrun polyline;
}

А на последний вопрос вы сможете найти ответ в одном из обсуждений по тегу: "меню объектов".
Антон Карцев
28 января 2016, 06:54
спасибо получилось, теперь можете подсказать как сделать пункт меню который будет активен поумолчанию, и как деактивировать другие пункты меню при выборе одного
Антон Карцев
28 января 2016, 06:54
Конкретно как изменить этот код

// Добавление одного пункта в список
        function addMenuItem (group, map, menuContainer) {

            // Показать/скрыть группу на карте
            YMaps.jQuery("" + group.title + "")
                .bind("click", function () {
                    var link = YMaps.jQuery(this);

                    // Если пункт меню "неактивный", то добавляем группу на карту,
                    // иначе - удаляем с карты
                    if (link.hasClass("active")) {
                        map.removeOverlay(group);
                    } else {
                        map.addOverlay(group);
                    }
                    // Подчеркиваем все ссылки и задаем цвет
                     menuContainer.find('a').css('text-decoration', 'underline');
                     menuContainer.find('a').css('color', '#00F');
                               
                    // Кроме той, на которую щелкнули и меняем цвет
                    YMaps.jQuery(this).css('text-decoration', 'none');
                    YMaps.jQuery(this).css('color', '#000');


                    // Меняем "активность" пункта меню
                    link.toggleClass("active");

                    return false;
                })

                // Добавление нового пункта меню в список
                .appendTo(
                    YMaps.jQuery("
  • ").appendTo(menuContainer)
                    )
            };



    что бы первый пункт меню был активен при загрузке страницы, а при активации последующих деактивировались все остальные
    Чуть поменять обработчик клика по ссылке.

    // Добавление одного пункта в список
    function addMenuItem (group, map, menuContainer) {

        // Показать/скрыть группу на карте
        YMaps.jQuery("" + group.title + "")
            .bind("click", function () {
                map.removeAllOverlays();
                menuContainer.find("a").removeClass("active");
    Антон Карцев
    28 января 2016, 06:54
    не получается, скрываются вообще все данные с карты по клику. линии не отображаются
    можно вот для этого примера конкретно http://www.starline-auto.ru/map3.html ?
    как понимаю нужно по клику что бы все полилинии  совершили map.removeOverlay и после этого сработало map.addOverlay(group).
    как поумолчанию задать активной первую ссылку «Все направления»?
    Линии отображаются при щелчке по ссылкам.
    Вы не вставили код, который я вам написал в предыдущем комментарии.

    В одном из обсуждений в теге "меню объектов" объяснялось как отобразить все объекты сразу. Думаю, что по аналогии вы сможете сделать так, чтобы по умолчанию был выделен первый элемент.