首页 > 解决方案 > 地理服务器层到传单

问题描述

我将文件存储在 wms 服务的 Geoserver 中,我想将数据显示到传单中。

这是链接

编码:

  <!DOCTYPE html -->
<html>
<head>
<title> leaflet webviewer with Geoserver</title>
<!--Load the style stylesheet of leaflet -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512-Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
<!--Load leaflet -->
<script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>

  <!--Load vectorGrid plugin for Leaflet -->
  <script src="https://unpkg.com/leaflet.vectorgrid@latest/dist/Leaflet.VectorGrid.bundled.js"></script>


<style>
/*Set the dimensions of our map */
.map {
height: 100%;
width: 100%;
}
</style>

</head>
<body>
<!--Create our map object -->
<div id="map" class="map"></div>
</body>
</html>

<script>
// Find our map id
var map = L.map('map')
// Set open openstreetmap
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);


 var wmsLayer= L.tileLayer.wms("localhost:8080/geoserver/cite/wms?service=WMS", {
        layers: 'cite:vnm_adm3',
        format: 'image/png',
        transparent: false
    });
    map.addLayer(wmsLayer);

// Set our initial location and zoomlevel
map.setView([16.4637, 107.59], 6);



</script>

这是错误

localhost:8080/geoserver/cite/wms?service=WMS&service=WMS&request=GetMap&layers=cite%3Avnm_adm3&styles=&format=image%2Fpng&transparent=false&version=1.1.1&width=256&height=256&srs=EPSG%3A3857&bbox=11897270....net:: ERR_UNKNOWN_URL_SCHEME

我该如何解决?

标签: javascriptleafletgeoserver

解决方案


推荐阅读