Nano Hash - криптовалюты, майнинг, программирование

Держите одну боковую панель листовки открытой одновременно

Я работаю над проектом карты Leaflet с несколькими маркерами, которые открывают соответствующие боковые панели (маркер A открывает боковую панель A, маркер B открывает боковую панель B и т. д.). Вот что выглядит код для этого:

HTML

<div id="sidebar">
    <h1>Sidebar 1</h1>
</div>

<div id="sidebar-two">
    <h1>Sidebar 2</h1>
</div>

JavaScript:

 var sidebar = L.control.sidebar('sidebar', {
            closeButton: true,
            position: 'left'
        });
        map.addControl(sidebar);


    var marker = L.marker([51.2, 7]).addTo(map).on('click', function () {
        sidebar.toggle();
    });

    var sidebarTwo = L.control.sidebar('sidebar-two', {
        closeButton: true,
        position: 'left'
    });
    map.addControl(sidebarTwo);

    var marker = L.marker([52.2, 7]).addTo(map).on('click', function () {
        sidebarTwo.toggle();
    });

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

Что я хотел бы сделать, так это если вы нажмете маркер A и появится боковая панель A, вы можете щелкнуть маркер B, и он закроет боковую панель A и отобразит боковую панель B. Я бы хотел, чтобы это было взаимозаменяемо, поэтому любой маркер закроет текущий открытый и принесет свою боковую панель. Это возможно? Я включил JSFIDDLE, чтобы показать, что такое базовая карта, маркеры и боковая панель выглядит так. ПРИМЕЧАНИЕ. Вам потребуется растянуть демонстрационное окно шире, чтобы оно отображалось на ширине экрана по умолчанию.

Демо также включает в себя исходный код плагина. Я возился с этим и чувствую этот фрагмент кода:

toggle: function () {
        if (this.isVisible()) {
            this.hide();
        } else {
            this.show();
        }
    },

Может быть, где мой ответ. Я не уверен.


  • Спасибо за очень подробную запись. Я думаю, что ответ @yarl или что-то подобное - это правильный путь. 09.12.2014
  • Спасибо. Его метод сработал. Для карты. 10.12.2014

Ответы:


1

Вы можете закрыть другую боковую панель внутри функции onclick:

    var marker = L.marker([52.2, 7]).addTo(map).on('click', function () {
        if(sidebar.isVisible())
            sidebar.hide();
        sidebarTwo.toggle();
    });
08.12.2014
Новые материалы

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

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

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

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

Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..

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

Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..