[GIS] Openlayers 3 Circle Vectors Not Visible

circleopenlayersvector

I have two coordinates which are projected in EPSG: 3857

coord1 = [-10399758.486973494, 5604341.818491254] 
coord2 = [-10402629.416641055, 5593700.936383396]

I'm trying to get them to appear, symbolized by a circle, in a map, like so:

markerLayer = new ol.layer.Vector({
    source: new ol.source.Vector({
        features: [
            new ol.Feature({
                geometry: new ol.geom.Circle(coord1, 50)
            }),
            new ol.Feature({
                geometry: new ol.geom.Circle(coord2, 50)
            })
        ]
    }),
    projection: "EPSG:3857",
    style: function (feature, resolution) {
        return [new ol.style.Style({
            image: new ol.style.Circle({
                radius: 50,
                fill: new ol.style.Fill({
                    color: '#0000FF'
                }),
                stroke: new ol.style.Stroke({
                    color: '#000000'
                })
             })
        })]
    },
    visible: true   
});

map.addLayer(markerLayer);

And while I can see that the features are added to the layer, which is added to the map, they don't appear and I can't tell why. Any ideas?

Best Answer

Use a stroke and fill directly instead of an image style.

..
style: new ol.style.Style({
  stroke: new ol.style.Stroke({
    color: '#000000',
    width: 1
  }),
  fill: new ol.style.Fill({
    color: '#0000FF'
  })
}),
..
Related Question