时间戳

首页 > 解决方案 > 在 Leaflet.js 中消除光栅图像上的白色、无数据像素时遇到问题，通过 GeoServer 提供服务

javascript - 在 Leaflet.js 中消除光栅图像上的白色、无数据像素时遇到问题，通过 GeoServer 提供服务

问题描述

我正在学习leaflet.js，并希望能够创建一个可以与GeoServer 一起使用的网络地图。我现在的主要问题是从我导入的栅格图层中消除白色背景，通过L.tileLayer.wms. 我以前遇到过这个问题，尽管是矢量数据，我通过设置transparent: true和解决了这个问题zIndex: 2，而底图设置为1。当我将新的栅格图层透明度设置zIndex为相同的参数值时，整个图层就会消失；现在我能看到的只有我的底图。我可以在网上找到消除这种白色背景的所有方法是设置zIndex和设置transparent: true。希望那里有人以前遇到过这个问题，并且可以教我一些我缺少的东西。

附上我的代码示例：

var esri = L.esri.basemapLayer('Imagery').addTo(map);

var test_layer = L.tileLayer.wms('http://localhost:8080/geoserver/learn_js/wms',{
    layers: 'learn_js:geotiff_coverage',
    format: 'image/png',
    zIndex: 2,
    transparent: true
  //opacity: 0.5
}).addTo(map);

标签： javascriptleafletgeoserverwms

解决方案

问题似乎与我正在使用的光栅图像有关。我将光栅图像切换到我感兴趣的区域内的一个，现在图像似乎正在加载，背景像素被消除。我仍然不知道为什么一个有效而另一个无效，但至少我知道没有编码或地理服务器问题出问题。也许是光栅图像的内部结构导致了这种挂断。我确实知道，对于我的原始图像，geoserver 仪表板中的切片图层预览不会将图像显示为 png，而是显示为 jpeg。使用我的新图像，geoserver 的切片图层预览会以所有格式显示图像。

推荐阅读