CODEWITHSUNDEEP
openlayers-3
GoinOff
GoinOff

Reputation: 1802

points not showing on map using a source.Vector loader function

I am having a problem showing a few points on the map where the geojson file is loaded from the server. The geojson file changes so I want a good way to refresh the map layer. To do this, I created the source.Vector (Version 3.17.1 of OpenLayers)

var locationSource = new ol.source.Vector({
  format: new ol.format.GeoJSON({
    defaultDataProjection :'EPSG:4326' 
  }),
  loader: vectorLoader,
  strategy: ol.loadingstrategy.all
});

function vectorLoader which executes a XHR call to retrieve the latest version of the geojson file. This has been simulated in the jsfiddle below

jsfiddle

The geojson file has valid json because the points on the map show if I use a source.Vector object which uses the url property instead of a loader like this:

  var locationSource = new ol.source.Vector({
     url: '/openlayers/location.geojson',
     format: new ol.format.GeoJSON({
        defaultDataProjection :'EPSG:4326' 
      })
  });

I would use this but it is horrible about using cached versions of the geojson file when a new file is available. I want something that is more reliable which is why I'm trying to get this to work with a loader.

The jsfiddle link above has all the code and it seems to run fine but the the points never show up on the map after addFeatures, located here:

onSuccess: function(response) {
  var format = new ol.format.GeoJSON();
  var features = format.readFeatures(response, {
    featureProjection: 'EPSG:4326'
  });
  source.addFeatures(features);
  console.info(source.getFeatures());
  map.updateSize();
  source.changed();

You will see that no points show on the map for the data provided in the jsfiddle. I feel like I am missing something basic here but after finding many solutions, none work..I seems like the style function needs to be executed again after the 'addFeatures` load completes. This can be seen in the console log for the jsfiddle above.

Upvotes: 1

Views: 981

Answers (1)

west efan
west efan

Reputation: 609

Indeed this is just a minor issue you were missing.

First of all radius was not defined, this is probably pulled from a variable which you haven't copied to your fiddle.

The main issue though is the wrong projection used when you read your features featureProjection: 'EPSG:4326', it should be changed to featureProjection: 'EPSG:3857', since the default projection in an OpenLayers view is Web Mercator. It could also be the case, that you wanted to define the data projection explicitly while reading your GeoJSON, for this you should set dataProjection: 'EPSG:4326'.

A working example can be found in this fiddle: https://jsfiddle.net/9oukr51t/

Upvotes: 1

Related Questions