帶用戶輸入的傳單cql_filter

我已經構建了一個帶有PostGIS，Geoserver和Leaflet的Web地圖。但是，我絕望地堅持應用一個接受用戶輸入並更新顯示的WMS層的cql_filter。該地圖使用靜態cql_filter正確加載。我給我的層JavaScript是如下面並容納在一個函數MYMAP（）：帶用戶輸入的傳單cql_filter

var contours = L.tileLayer.wms('http://gis01-dbn:8080/geoserver/Inyaninga_243-198/wms', { 
      layers: 'Inyaninga_243-198:contours_3857', 
      format: 'image/png', 
      transparent: true, 
     }); 

contours.setParams({CQL_FILTER:"elevation = 100"});

我然後創建了一個函數來傳遞作爲更新cql_filter這將覆蓋並更新先前所述濾波器參數：

function updateParams() { 
    var x = document.getElementById("myInput").value; 
    var filter = "elevation = '" + x + "'"; 
    return contours.setParams({CQL_FILTER:filter}); 
}

我的HTML創造了一個形式，是爲了接受用戶輸入，並將其應用到cql_filter但我不能讓它相應工作：

<body> 
    <form> 
     Elevation(m):<br> 
     <input type="text" id="myInput"> 
     <input type="button" value="Elevation" onclick="updateParams()"> 
    </form> 
    <div id="map" class="map"</div> 
    <script type="text/javascript"> 
     myMap(); 
    </script> 
</body>

我很新的這是第一次嘗試，我可能錯過了什麼？任何幫助正確的方向將不勝感激。

來源

2017-03-09 CamMuller

你應該進一步調試一下。放置一些'console.log（）'來查看'updateParams（）'的運行時間，以及'filter'在更改時的樣子。還可以使用瀏覽器開發人員工具中的網絡檢查員查看所請求圖像的URL。 – IvanSanchez

非常感謝Ivan，我檢查了Firefox調試文件並獲取錯誤信息：'ReferenceError：updateParams is not defined'當我單擊該函數鏈接到的按鈕時。 – CamMuller

我終於設法解決這個問題，並得到了一個過濾器來處理按鈕。

我必須將var輪廓從myMap（）函數中移出，並將其放置在HTML的腳本部分中。不是最乾淨的方法，但只有選擇我可以工作。

我假設這是在另一個函數中調用函數的問題。

來源

2017-03-10 05:12:55 CamMuller

帶用戶輸入的傳單cql_filter

回答

相關問題