0

Please take a look at code: https://plnkr.co/edit/wF8VZnnLtRLHPkfrKGu5?p=preview (OpenLayers v.3.8.2)

I would like to retrieve GeoJSON property "zoom". I guess it would be something like this but dont know where to put it in a code:

var zoom = function(feature){
    var zoomGeojson = feature.get("zoom");
    console.log(zoomGeojson);
}

And then I would like to compare zoom level of the map to the GeoJSON property "zoom". If they would match, I would like to visualize only that geojson data. (for example: mapzoomlevel = 5, if mapzoomlevel = geojsonpropertyzoom visualize only data from geojson that contains property "zoom"=5)

Edit

Based on @Hicham Zouarhi answer.

I ran into two problems.

1.Code below throws me an error:

var tmpLayer= new ol.layer.Vector();
map.addLayer(tmpLayer);

source.forEachFeature(function(feature){
    var mapzoom = map.getView().getZoom();
    var geojsonzoom = feature.get("zoom");
    console.log('MapZoom ' + mapzoom);
    console.log('GeoJSONZoom ' + geojsonzoom); 
    if(geojsonzoom == mapzoom){
        console.log('GeoJSON zoom property and map zoom are equal!'); 
        tmpLayer.getSource().addFeatures(feature); // error: Uncaught TypeError: Cannot read property 'addFeatures' of null(…) 
    } else {
        console.log('Not equal!'); 
    }
});
  1. Without that error it runs smoothly in a console, however it does not run in my code at all. I guess I am missing something or the order is not right.

I have reorganized code by breaking it into a smaller pieces: https://plnkr.co/edit/DeaVFGBK11jKCT3yHAVd

2

Here is what I propose ( I still think there may be a cleaner way to do it, so if you find any please share ):

  1. loop through all the features of you GeoJSON data
  2. get the features that do have the zoom value equal to yourMap.getView().getZoom()
  3. add the features to a temporary vector layer and display it while setting the original one visibility to false.

the code to do this should look like this :

var tmpLayer= new ol.layer.Vector({ source: new ol.source.Vector()});
yourMap.addLayer(tmpLayer);
//----- this goes before 
// this loop goes inside moveend event
tmplLayergetSource()clear(); // we clear the source to avoid duplicates
yourSource.forEachFeature(function(feature){
    if(feature.get("zoom")==yourMap.getView().getZoom()){
         tmpLayer.getSource().addFeature(feature);
    }
});
if(tmpLayer.getSource().getFeatures().length>0){
     tmpLayer.setVisible(true);
     yourVectorLayer.setVisible(false);
}

the loop through the vector source features should be inside the map.on('moveend',...); this way it will listen to any change on the zoom level of the map

  • Hi! I appriciate you answer! Thought I would be doing something like that, but as I am a beginner in OL3, as well in a JS, I ran into some problems. Please take a look at EDIT part I ve provided in the main question. – vayacondios2015 Sep 1 '16 at 20:10
  • @vayacondios2015 I've edited the answer, added a source to the temporary layer – Hicham Zouarhi Sep 1 '16 at 20:15
  • Thanks! Wouldnt thought that would be it in a million of years. It doesnt throw me an error now if I run code over a console and it creates vector file (which I still need to check). However, it does not write any kind of outcome to console and it doesnt create new vector layer if I write code in a script. Where do I need to place code in a script? – vayacondios2015 Sep 1 '16 at 21:10
  • @vayacondios2015 the code should go inside map.on('moveend', ...); I tried it in your plunker and it worked. sorry for the delay of the reply – Hicham Zouarhi Sep 2 '16 at 8:11
  • 1
    thank you for helping me out! I really appriciate it! it wasnt working in the beginning because I had to change tmpLayer.getSource().length>0 to tmpLayer.getSource().getFeatures().length>0, but as far I can see, its working properly now! I have edited your code above and accepted it as agood answer! thanks again! – vayacondios2015 Sep 2 '16 at 20:20

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.