Display list of OpenLayers Features which are currently visible on screen

Question

I have an OpenLayers map a few thousand Points of Interest. These POIs are Vector Features rendered in a Vector Layer.

We are loading the POIs once in order to minimize load on the server.

Next to the map will be a box which will display the names of POIs currently in view.

I'm not clear on the best way to update this list of names.

I believe that I can store an array of the POIs (Features). Then, when the map is panned/searched/zoomed, loop through them, calling the "onScreen" function.

map.events.register("moveend", map, function(evt) {
      var output = [];
      for (var i=0;i<myFeatures.length;i++) {
          var poi = myFeatures[i];
          if (poi.onScreen()){
             output.push(poi.attributes['name']);
          }
      }
     // then, use output to display the list in html...
     myDOMbox.innerHTML = output.join();

});

Is there a more efficient way to do this?

Thanks in advance.

Answer 1

Not quite sure what your "onScreen" function is, but an example that should work is this:

map.events.register("moveend", map, function(evt) {
    var extent = map.getExtent();
    var output = [];
    for (var i = 0, l = myFeatures.features.length; i < l; i++) {
        var feature = myFeatures.features[i];
        if (extent.intersectsBounds(feature.geometry.getBounds())) {
            output.push(feature.attributes['name']);
        } 
    }
});