javascript - 使用 javascript 将 css 样式应用于 openlayers3 中的图层

Question

使用 openlayers3 API 定义图层和样式。我需要为图层应用 2 个 css 样式。因为该代码在下面使用

//applying styles for wms layer
var fill = new ol.style.Fill({color: 'rgba(237, 26, 170, 0.82)'});
var stroke = new ol.style.Stroke({color: '#4A12ED',width: 1.25});
var text = new ol.style.Text({color: '#F21A6C'});

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

var wms = new ol.layer.Tile({
     source: new ol.source.TileWMS({
         title: "Population Density",
         url: 'http://sedac.ciesin.columbia.edu/geoserver/wms',
         params: {LAYERS: 'gpw-v3:gpw-v3-population-density_2000'}
     }),
     style: styles
});

/*****************************************************************************/
//applying styles for unescap layer

var unescap = new ol.layer.Tile({
     source: new ol.source.TileWMS({
          url: 'http://203.159.29.11:8200/geoserver/unescap/wms?',
          params: {LAYERS: 'unescap:rg_di_any_all'}
     }),
     style: new ol.style.Style({
          stroke: new ol.style.Stroke({color: '#319FD3',width: 1}),
          fill: new ol.style.Fill({color: 'rgba(17, 224, 36, 0.66)'}),
          text: new ol.style.Text({
                font: '12px Calibri,sans-serif',
                fill: new ol.style.Fill({color: '#ff0'}),
                stroke: new ol.style.Stroke({ color: '#09C',width: 3})
          })
     })
});

但样式未应用错误消息在控制台中不可用我想知道这段代码有什么问题以及如何正确应用样式。

Answer 1

ol3 样式用于矢量图层，不适用于 WMS 层。但是您可以在 params 中手动设置 styles、SLD 或 SLD_BODY 属性来设置样式。