如何在小册子地图中显示从Geoserver WMS图层显示要素属性的弹出窗口？

Question

我对Leaflet很新，我试图在我的webmap上获得一些非常基本的（或者我认为）功能。简而言之，我在Geoserver上托管了许多（179）WMS图层，我希望用户能够单击任何功能并显示弹出窗口，以显示有关该功能的信息。

我有179个图层，每个图层都代表我为之工作的地图库的纸质地图图纸的多边形覆盖区。每个图层代表集​​合中的一系列“地图”。每个图层的属性字段是相同的。其中一些功能堆叠在一起（同一地图不同版本的多个记录）。为了让您了解我有兴趣创建的内容，下面是我在ArcGIS在线中制作的link to my pilot application（仅显示3个图层）。原谅基本的HTML，这只是一个例子，展示我需要做什么。

我已经创建了一个传单图，其中显示了两个图层，我想在添加其他图层后再找出此功能。

是否可以创建一个弹出窗口，可以显示来自多个图层的多个要素的信息？

我可以控制显示在弹出窗口中的属性吗？

做某种“信息窗口”而不是弹出窗口会更容易吗？

真的，任何建议，以防止我放弃这个项目将不胜感激。

var map; 

function mapinitialize() { 

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

map = new L.Map('map', 
    { 
     center: new L.LatLng(46, -90), 
     zoom: 6, 
     layers: [osm], 
     zoomControl: true 
    }); 



//This is all for the layer control: 

var f0999 = new L.TileLayer.WMS(GEOSERVERBASE + "/geoserver/Geodex/wms", 
{ 
    layers: "Geodex:f0999", 
    format: 'image/png', 
    styles: 'F0999', 
    transparent: true, 
    attribution: "" 
}); 


var f0177 = new L.TileLayer.WMS(GEOSERVERBASE + "/geoserver/Geodex/wms", 
{ 
    layers: "Geodex:f0177", 
    format: 'image/png', 
    styles: 'F0177', 
    transparent: true, 
    attribution: "" 
}); 

var baseMaps = { 
"osm": osm 
}; 

var overlayMaps = { 
"f0999 Messing Around Layer": f0999, 
"f0177 Nautical Charts": f0177 
}; 

L.control.layers(baseMaps, overlayMaps).addTo(map); 
//End layer control 

当前弹出：

map.on('click', function(e){ 

var popupContent = "You have clicked the map at " + e.latlng.lat + ", " + e.latlng.lng; 

var marker = new L.marker(e.latlng).addTo(map) 
     .bindPopup(popupContent) 
     .openPopup(); 

}); 

} 

所有在传单，我可以找到被分配到的标记，并且你可以在代码中看到弹出窗口中的引用，我已经能够分配弹出到一个标记。

理想情况下，我想在用户点击并显示下面的功能的属性时放置一个标记。目的是用户可以使用此应用程序来查询我们针对特定区域的地图。

Answer 1

如果您使用的是7.X版本的小册子，则不能直接在此框中提供支持。幸运的是，对于我们所有人来说，库支持通过插件和对象扩展进行自定义。

就我个人而言，我已将此example改编为类似需求。它不适合显示多个图层的细节，但是可以实现一些额外的定制。您一定能够控制显示的属性。它扩展了提供WMS瓦片层的框架，增加了执行WMS GetFeatureInfo请求的能力，这是您所需要的核心。

好像GeoServer的OpenLayers支持图层预览功能确实这样做，但结果加载到另一个div，而不是弹出。如果你不想让自己的手太脏，OpenLayers可能会支持这个更多的盒子。另外，如果使用WFS图层是一个选项，那么使用该图层的onEachFeature事件附加onclick事件会更容易。如果功能数量很少，则可以将弹出窗口绑定到要显示的数据上 - 点击时用onclick监听器显示弹出窗口。如果它很有趣，我可以提供一些例子。