我对 Web 服务很陌生,但我遇到了问题。我有一个与 WMS 链接的地图。我添加了一个底图和我的 WMS 日期作为 tileLayer,并且在我的地图上正确显示。现在,当我单击地图上的任意位置时,我想要最接近 PopUp 的功能。我已经在网上搜索过,但找不到我理解的解决方案。(https://gist.github.com/rclark/6908938)谁能帮我解决这个问题?
到目前为止,这是我的代码:
<!DOCTYPE html>
<html>
<head>
<title>XXX</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"
integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="
crossorigin=""></script>
<style type="text/css">
#nrwMap { height: 800px; width: 1300px;}
</style>
</head>
<body>
<div id="Map"></div>
<script type="text/javascript">
var mymap = L.map('Map').setView([51.28, 7.33], 8);
var url = 'http://www.xxx.xxx.com/wms/';
var basemap = L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 18,
attribution: 'Map data © <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
'Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
id: 'mapbox/streets-v11'
})
basemap.addTo(mymap);
var featureLayer = L.tileLayer.wms(url, {
layers: 'layerName',
format: 'image/png',
transparent: true
});
featureLayer.addTo(mymap);
</script>
</body>
</html>