Я работаю над проектом карты 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();
}
},
Может быть, где мой ответ. Я не уверен.