Set background color and opacity for a WKT layer vector in OpenLayers3

Question

I have this function:

function drawLayer(wktRegion, name,colour = "transparent"){
      var format = new ol.format.WKT();
      var feature = format.readFeature(wktRegion);
      feature.getGeometry().transform('EPSG:4326', 'EPSG:3857');

      var myStyle = new ol.style.Style({
                   fill: new ol.style.Stroke({
                      color: 'red'
                   })
                });

      var layerVector = new ol.layer.Vector({
            source: new ol.source.Vector({
            features: [feature],
            style: myStyle
        })
      });
      layerVector.set('name',name);
      map.addLayer(layerVector);
}

wktRegion can be:

• POLYGON(.....)
• POINT (LONG LAT)

This function give the WKT description and draw the vector layer on the map.

I am trying to set a background color for the vector layer and an opacity, but with this code I obtain always transparent vector layer.

What I am doing wrong?

Answer 1

Try defining your style like this:

var myStyle = new ol.style.Style({
  fill: new ol.style.Fill({
    color: 'rgba(255, 100, 100, 0.3)'
  }),
  stroke: new ol.style.Stroke({
    color: 'rgba(255, 80, 80, 0.9)' ,
    width: 2
  }),
});