0
저는 javascript를 처음 사용하고 리플릿으로지도를 만들려고합니다. 내 목표는 선택할 수있는 레이어가있는 드롭 다운 상자를 만드는 것입니다. 레이어를 선택하면 해당 레이어가 나타나야하며지도의 기존 레이어는 사라집니다. 새 레이어를 표시 할 수 있지만 다른 레이어가 선택되면 사라지지 않습니다. 그들은 단지 서로를 쌓아 놓습니다.리플릿에 문제가 있습니다. removeLayer
나는 "onchange를"사용 (두 단지 자바 스크립트에서 호출하고 <select>
요소에서 JS 함수를 호출의 다양한 반복을 시도했습니다. 아래는 내가 함께 일하고 있어요 데모 코드입니다.
<select id='map-ui' onchange="toggle_layer();">
<option>Please choose a layer</option>
<option value="examples.bike-lanes">bike lanes</option>
<option value="examples.bike-locations">bike stations</option>
</select>
<div id='map'></div>
<script>
var map = L.map('map').setView([38.902, -77.001], 13);
var base_map = 'examples.map-zgrqqx0w'
map.addLayer(L.mapbox.tileLayer(base_map));
var mapUI = document.getElementById("map-ui");
var shown_layer;
function toggle_layer(){
var selectedValue = mapUI.options[mapUI.selectedIndex].value;
if (shown_layer != selectedValue){
map.removeLayer(L.mapbox.tileLayer(shown_layer));
};
map.addLayer(L.mapbox.tileLayer(selectedValue));
shown_layer = selectedValue;
};
</script>