I have a ol.source.Vector like this:

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

vectorSource = new ol.source.Vector({
    strategy: ol.loadingstrategy.bbox,
    loader: function(extent, resolution, projection) {
        var url = getUrl( extent );
            url: url,
            dataType: 'json'
        }).then(function(response) {
            var features = geoJSONFormat.readFeatures( response, {featureProjection: 'EPSG:3857'} );
            console.log( features );
            vectorSource.addFeatures( features );
    format: geoJSONFormat

mapillaryLayer = new ol.layer.Vector({
    source: vectorSource

map.addLayer( mapillaryLayer );

When first load, all its ok. I can see the features on the map. When I pan the map to an undiscovered area, the features are updated from server.

But when I zoom in and pan to an already seen area (inside the original wide area before the zoom in) no new loads are made.

I know its a correct behaviour because all data inside this BBOX must be taken when zoomed out, so when zoom in I already have all I need for that area.

But I'm loading a limited amount of points in my query (maxresults):

var url = "getPhotosInBBOX?minlat="+minlat+"&minlon="+minlon+"&maxlat="+maxlat+"&maxlon="+maxlon+"&maxresults="+maxresults;

And now, even already loaded the BBOX content, I need to do a refresh because when zoom in, I need to have the same amount of data I have before.

Example: I have a bbox to show all Canada territory. So I will ask for 100 features from my server. Now, I'll zoom to Alberta. Alberta is inside Canada bbox and the layer will not load again. But I need to refresh to show 100 features inside this new bbox.

Why? My query is random. It takes 100 arbitrary features inside the view's current extent. May all be in Alberta, may not. When I zoom in, I need to take those I don't take before.

I don't know I'm clear. Ask for further informations.


3 Answers 3


I had the same requirement, loading a subset of data when zoomed out and loading more of that data when zoomed in. I solved it with help from this question: reload ServerVector with different zoom levels in openlaers3

First replace your vectorSource strategy strategy: ol.loadingstrategy.bbox with a custom loading strategy:

strategy: function(extent, resolution) {
    if(this.resolution && this.resolution != resolution){
    return [extent];

Second, at the beginning of your vectorSource loader function, add the following line:

this.resolution = resolution

Now when the resolution/zoom level changes, the loaded extents stored in the vectorSource will be cleared. You could make this a bit more intelligent by only removing the most recent extent for example, but this works well for me.

  • I'll give a try ASAP. I'm not working on this now.
    – Magno C
    Apr 18, 2017 at 17:58
  • 2
    This is still a good answer. I'm using OpenLayers 6.1 in an Angular 8 app, and applying your answer got me the desired behavior. Thanks!
    – vitale232
    Dec 19, 2019 at 23:06
  • Unfortunately this does no longer work with Openlayers 6.6 release. Jul 16, 2021 at 11:23
  • This solution is working with 6.14.1 - thank you @rbkb, much gratitude :) I've had this problem - on and off - for several years now - see here: stackoverflow.com/questions/54482666/… and here : stackoverflow.com/questions/47960731/… - back to 2017 ...
    – minisaurus
    Jun 14, 2022 at 14:45

From here: https://github.com/openlayers/ol3/issues/3812

The source keeps track of extents that has been loaded, in order to only load new extents. This is done at request time. At response time, your loader function calls vectorSource.clear(true), which also clears the collection of loaded extents. So next time the maps checks if it should load a given extent, it sees that nothing is loaded and reloads. Calling clear will always cause the source to reload.

  • 1
    But I'll never know when to call vectorSource.clear(true) (zoom into a known extent, my case) or let the Loader do the job (pan to an unvisited extent).
    – Magno C
    Jun 21, 2016 at 17:40

What I do to take advantage of caching while making sure that I get as much useful data as possible is to check the number of features in the source (when a move or zoom has taken place):

if (vectorSource.features.length == maxresults) {

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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