OpenLayers3: лучший способ отобразить несколько слоев WMS в прозрачности

Question

Я пишу js-скрипт для добавления нескольких слоев WMS на карту с помощью OpenLayers3
Код выглядит примерно так:

<script type="text/javascript">
var l1 = new ol.layer.Tile({
    source: new ol.source.MapQuest({layer: 'sat'})
});
var l2 = new ol.layer.Image({
    source: new ol.source.ImageWMS({
      url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms',
      params: {'LAYERS': 'aree_protette1'},
    })
})
var l3 = new ol.layer.Image({
    source: new ol.source.ImageWMS({
      url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms',
      params: {'LAYERS': 'aree_protette2'},
    })
})
var map = new ol.Map({
  target: 'map-dashboard',
  view: new ol.View({
    center: [-10997148, 4569099],
    zoom: 4
  })
});
map.addLayer(l1);
map.addLayer(l2);
map.addLayer(l3);
</script>

Таким образом, слои WMS не все видны. Первые скрыты последними.
Читая документы по API, я нашел объект ol.layer.TileWMS, поэтому возможным решением было бы заменить объекты ImageWMS:

var l2 = new ol.layer.Tile({
    source: new ol.source.TileWMS({
      url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms',
      params: {'LAYERS': 'aree_protette1'},
    })
})
var l3 = new ol.layer.Tile({
    source: new ol.source.TileWMS({
      url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms',
      params: {'LAYERS': 'aree_protette2'},
    })
})

Мне нужно видеть все слои видимыми и перекрывающимися. Я не уверен, что это рабочее решение. Любые дальнейшие предложения приветствуются!

Answer 1

Вам тоже нужны два слоя в двух отдельных слоях ol3? если нет, то вы можете попробовать (в зависимости от данных)

var layers = new ol.layer.Tile({
source: new ol.source.TileWMS({
  url: 'http://pubblicazioni.provincia.fi.it/geoserver/wms?',
  params: {'LAYERS': 'aree_protette1, aree_protette2 '},
})

Как два отдельных слоя, попробуйте установить прозрачный параметр и изображение (gif или png)

'LAYERS': 'aree_protette1',
'FORMAT': 'image/png', //depending what the GetCapabilities says
'TRANSPARENT': 'true'

Изменить: Конечно, это зависит от предоставленных данных, если параметр прозрачности будет полезен. Если это так, вы можете установить непрозрачность слоя в ol3.