Leafletjs光標懸停在WMS層上時

我正在使用Leafletjs。目前它非常簡單，我可以從開放式地圖中看到街景。Leafletjs光標懸停在WMS層上時

var streets = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
     maxZoom: 18, 
     attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors' 
    });

我也有一個來自geoserver的WMS圖層。它具有標準的getFeatureInfo，並且所有內容都正確顯示。

L.tileLayer.wms("GEOSERVERURL", { 
      layers: 'layers', 
      format: 'image/png' 
      ,transparent: true 
     }).addTo(map);

wms圖層也是可點擊的，我使用getFeatureInfo獲取該圖層的信息。問題在於用戶不知道其可點擊的原因，因爲當鼠標懸停在wms圖層上時，光標始終不會改變。我的問題是如何在光標懸停在圖層上時更改光標？

以前有沒有人實現過這個功能或有想法實現它？迄今爲止我唯一遇到過的研究是在地圖上使用鼠標懸停並調用getFeatureInfo來判斷它是否在圖層上。但是，這似乎會導致很多討論只是爲了確定光標區域。

編輯：爲了澄清，我希望光標只有當它懸停在填充的wms層時纔會更改。儘管它在技術上適用於整個地圖，但它只有一部分內容。哪種提出'我可以將wms圖層限制爲僅限內容區域然後顯示光標？'的問題。也許是一個邊界區域或沿着這些線？

編輯2：下面是它的樣子的一個例子。街道地圖的部分我想保持正常的光標，但我想要一個指針時，懸停在彩色WMS地圖部分。 Example

來源

2015-02-23 Kalel Wade

的tileLayer的容器上設置一個ID，然後使用CSS來改變光標：

的Javascript：

var wms = L.tileLayer.wms("GEOSERVERURL", { 
    layers: 'layers', 
    format: 'image/png', 
    transparent: true 
}).addTo(map); 

wms.getContainer().setAttribute('id', 'wmsContainer');

樣式表：

#wmsContainer { 
    cursor: grab; /* or any other cursor: https://developer.mozilla.org/en-US/docs/Web/CSS/cursor */ 
}

注意：你需要做的這個圖層被添加到地圖後。在將其添加到地圖之前，getContainer方法將返回undefined。問題編輯和評論後

編輯：

不幸的是這是不可能的。至少不是我所知道的。由於L.TileLayer.WMS是圖像層，是絕對沒有扣除方式，也瓷磚對他們features，並且是透明的。

，你可以做一個變通方法是什麼工作，你的對象的邊界，用它來創建沒有中風透明的多邊形，並把那在你的WMS層。多邊形是交互式的，因此您可以獲得包含的光標變化，作爲額外的獎勵，您可以做其他奇特的事情，比如顯示輪廓或類似鼠標懸停的東西。我已經從註釋中提供的WMS示例中創建了一個小示例。

http://plnkr.co/edit/1HGn6IUzdrn1N5KGazXQ?p=preview

請注意，我使用的是一個功能，而不是一個多邊形GeoJSON的層，因爲它更容易找到美國GeoJSON格式導出的輪廓。但在你的情況下，一個四點多邊形就可以做到這一點。

希望有幫助，讓我知道如果有什麼不清楚。

來源

2015-02-23 17:43:03 iH8

關閉。它按預期改變光標，除了它在整個地圖上。我通過一些澄清更新了我的問題。 – 2015-02-23 18:04:12

你能否分享'GEOSERVERURL'（或類似的東西），我可以做一些測試？ – iH8 2015-02-23 18:06:48

不幸的是，客戶不會允許它。但是，您可以使用此https://www.mapbox.com/mapbox.js/example/v1.0.0/wms/作爲示例。在這種情況下，如果他們將鼠標懸停在不是基本映射的任何內容上，則會顯示一個光標。所以對於臨時層來說，這將是整個美國。 – 2015-02-23 18:13:57

Leafletjs光標懸停在WMS層上時

回答

相關問題