2014-03-01 3 views
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> 

답변

0

..

,292,181,779 : 귀하의 shown_layer 변수가 L.mapbox.tileLayer(selectedValue)해야 다음 map.removeLayer(shown_layer); 일을해야 어쨌든

, 여기에 jQuery를 (JSFiddle)를 사용하여 코드의 예입니다3210