2015-10-29 48 views
1

Estação酒店RBMC)使用HTML選擇對象:?過濾Json的特點由HTML對象選擇我已經<a href="http://brasilgeotube.herobo.com/" rel="nofollow noreferrer">Brazil1</a>和<a href="http://brasilgeotube.tk" rel="nofollow noreferrer">Brazil2</a></p> <p>我上傳了一些GPS站(JSON點功能),我需要選擇一個特定的GPS站下面的網站(基於站名「

<select name="sometext" > 
    <option value="MGRP">mgrp</option> 
    <option value="MGV1">mgv1</option> 
    <option value="VICO">vico</option> 
    <option value="MGBH">mgbh</option> 
    </select> 

我第一次嘗試是URL,但我不明白多少

可能有人給小費上

謝謝你的時間。

回答

0

要在select元素中指定的重要事項是id,因爲這將用於添加事件偵聽器。事情是這樣的:

<select id="sta_select"> 
    <option>(select station)</option> 
    <option value="MGRP">mgrp</option> 
    <option value="MGV1">mgv1</option> 
    <option value="VICO">vico</option> 
    <option value="MGBH">mgbh</option> 
</select> 

然後,您可以添加基於事件偵聽器id

var sta_select = L.DomUtil.get("sta_select"); 
L.DomEvent.addListener(sta_select, 'click', function (e) { 
    L.DomEvent.stopPropagation(e); 
}); 
L.DomEvent.addListener(sta_select, 'change', changeHandler); 

click監聽器與stopPropagation方法是防止在選擇點擊從通過傳播到地圖中,如果它們與地圖窗格重疊,這可能(取決於您的設置)立即取消選擇您要突出顯示的圖層。 change監聽器將運行一個處理函數,您可以設置它來執行任何您想要的操作。這裏,我將其設置其相應的option被選擇時打開彈出一個標記(基於在選項元素的屬性value和以GeoJSON層的SG_RBMC特性之間的匹配):

function changeHandler(e) { 
    for (i in estacoes_rbmc._layers) { 
     if (estacoes_rbmc._layers[i].feature.properties.SG_RBMC === e.target.value) { 
      estacoes_rbmc._layers[i].openPopup(); 
     } 
    } 
} 

下面是顯示它在工作中小提琴:

http://jsfiddle.net/nathansnider/80qcstLf/

,也有點票友版本,把地圖上的選擇元素的單張控件內部自動填充選項屬性:

http://jsfiddle.net/nathansnider/avn0ph1p/

+0

你能告訴我如何改變leaflet.css,所以選擇器的小葉控件離開底圖覆蓋的區域嗎?選擇器位置設置在地圖的右上角,但我希望它位於我的html的右上角,並且位於地圖的外面。 – HelpOverFlow

相關問題