[GIS] Loading WFS point layer with OpenLayers3

geoserveropenlayerswfs

I am trying to get a point layer from GeoServer to load in my web app as a WFS. I can get a sample set of polygon data to load, but my points will not. Here is the code I am using for this:

var geojsonFormat = new ol.format.GeoJSON();

var vectorSource = new ol.source.Vector({
  loader: function(extent, resolution, projection) {
    var url = 'http://........?service=WFS&' +
        'version=1.1.0&request=GetFeature&typename=Store:layer&' +
        'outputFormat=text/javascript&format_options=callback:loadFeatures' +
        '&srsname=EPSG:3857&bbox=' + extent.join(',') + ',EPSG:3857';
    $.ajax({url: url, dataType: 'jsonp', jsonp: true});
  },
  strategy: ol.loadingstrategy.tile(ol.tilegrid.createXYZ({
    maxZoom: 19
  }))
});
window.loadFeatures = function(response) {
  vectorSource.addFeatures(geojsonFormat.readFeatures(response));
};

var centerlocations = new ol.layer.Vector({
  source: vectorSource,
  style: new ol.style.Style({
    stroke: new ol.style.Stroke({
      color: 'rgba(0, 0, 255, 1.0)',
      width: 5
   })
  })
});

Is there something different that needs to be done for loading point data?

Best Answer

The style you have defined is not applied on points. For point you need to set an imageStyle like this:

new ol.style.Style({
  image: new ol.style.Circle({
    stroke: new ol.style.Stroke({
      color: 'rgba(0, 0, 255, 1.0)',
      width: 5
     }),
    radius: 5
  })
});
Related Question