css - openlayers-3更改外部wms图层样式

是否可以更改外部wms图层的样式？

我试图使用这一层：

https://firms.modaps.eosdis.nasa.gov/wms/?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetMap&LAYERS=fires24&width=400&height=250&BBOX=-26,34,35,82

在openlayers3上使用此代码

var fill = new ol.style.Fill({color: 'GREEN'});
var stroke = new ol.style.Stroke({color: 'GREEN'});

var styles = [new ol.style.Style({
    image: new ol.style.Circle({
        fill: fill,
        stroke: stroke,
        radius: 5
    })
})];


var fires = new ol.layer.Image({
    name: 'fires',
    source: new ol.source.ImageWMS({
        url: 'https://firms.modaps.eosdis.nasa.gov/wms/',
        params: {
            'LAYERS': 'fires24',
            'VERSION': '1.1.1'
        }
    }),
    style: styles
});

图层显示正确，但没有我自己的样式。

是否可以这样做或将其替换为自定义图标？

最佳答案

您使用的WMS链接返回的是PNG文件，我相信OpenLayers不能在“事后”设置样式。一旦获得它，它是不可变的-它不是“数据”，而是覆盖在基础地图源之上的具有透明性的图像。

您可以将一些参数传递给wms调用（已完成），并且标准看起来像它可以支持您将样式传递给WMS服务器的调用，以使其在渲染图像时使用这些参数。

我从geoserver网站（一个GIS服务器）中获得了可能的参数列表-http://docs.geoserver.org/stable/en/user/services/wms/reference.html

查看该链接，看起来sld或sld_body参数可能有效。 SLD类似于OL样式，但采用XML。这些样式表的详细信息在这里-http://docs.geoserver.org/stable/en/user/styling/index.html#styling

我已经尝试过这个jsfiddle：https://jsfiddle.net/y7fj57dj/，但它不能这样工作-可能是我的SLD（我不了解它的情况）或NASA服务器不知道如何处理它/正在忽略它。

您可能需要联系NASA服务器管理员，以确认是否可以设置WMS调用的样式（[email protected]，可通过https://firms.modaps.eosdis.nasa.gov/wms/?SERVICE=WMS&VERSION=1.1.1&REQUEST=GetCapabilities进行检索）。

关于css - openlayers-3更改外部wms图层样式，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31315651/