0

I'm trying to change the style of some points of a GeoJSON file loaded in OpenLayers and I getting this error:

RangeError: Maximum call stack size exceeded

I want to modify the point style related to a GRID_CODE value, located inside the file. I can access the value and iterate the whole array of values with no problem, the error only shows when I try to modify the feature. I tried to change only the point color, but the same error happens.

My code:

var myVectorLayer = new VectorLayer({
  source: new VectorSource ({
    format: new GeoJSON({dataProjection: 'EPSG:31982'}),
    url: '/geojson/flowdirection.geojson'
  }),
  zIndex: 55
});

// Change style to a arrow image, relative to the GRID_CODE
myVectorLayer .getSource().on('change', function(evt){
  var newsource = evt.target;
  var myFeatures = newsource.getFeatures();

  if (newsource.getState() === 'ready') {
    var numFeatures = newsource.getFeatures().length;
    for (var i=0; i < numFeatures; i++) {
      // Get the grid code
      var gridCode = myFeatures[i].get("GRID_CODE");
      // Change the point style to an arrow image
      if (gridCode == 1) {
        myFeatures[i].setStyle(new Style({
          image: new Icon({
            src: 'img/arrow.png'
          })
        }))
      }
    }
  }
});
  • 1
    Try defining icon style iconStyle = new Style({ ... only once outside loop and then apply this style to features: myFeatures[i].setStyle(iconStyle). – TomazicM Feb 26 at 17:42
3

It would be more efficient to use a style function

var style1 = new Style({
  image: new Icon({
    src: 'img/arrow.png'
  })
});
....

var myVectorLayer = new VectorLayer({
  source: new VectorSource ({
    format: new GeoJSON({dataProjection: 'EPSG:31982'}),
    url: '/geojson/flowdirection.geojson'
  }),
  style: function(feature){
      var gridCode = feature.get("GRID_CODE");
      // Change the point style to a arrow image
      if (gridCode == 1) {
        return style1;
      } else {
        ....
      }
  },
  zIndex: 55
});
  • Thanks again Mike, it worked! I hope this helps somebody else in the future. – leonardofmed Feb 27 at 12:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.