deferred tile loading, i.e. the Google Maps way, p=pgiraud,ahocevar,me, r=ahocevar,me (closes #2998)

git-svn-id: http://svn.openlayers.org/trunk/openlayers@11159 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
Éric Lemoine
2011-02-21 09:45:22 +00:00
parent 7f34868fe2
commit 08acb65e0e
4 changed files with 99 additions and 64 deletions

View File

@@ -87,6 +87,19 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
*/
numLoadingTiles: 0,
/**
* APIProperty: tileLoadingDelay
* {Integer} - Number of milliseconds before we shift and load
* tiles. Default is 100.
*/
tileLoadingDelay: 100,
/**
* Property: timerId
* {Number} - The id of the tileLoadingDelay timer.
*/
timerId: null,
/**
* Constructor: OpenLayers.Layer.Grid
* Create a new grid layer
@@ -109,6 +122,10 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
this.events.addEventType("tileloaded");
this.grid = [];
this._moveGriddedTiles = OpenLayers.Function.bind(
this.moveGriddedTiles, this
);
},
/**
@@ -217,8 +234,16 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
if (forceReTile || !tilesBounds.containsBounds(bounds, true)) {
this.initGriddedTiles(bounds);
} else {
//we might have to shift our buffer tiles
this.moveGriddedTiles(bounds);
// we might have to shift our buffer tiles, schedule
// that
if (this.timerId != null) {
window.clearTimeout(this.timerId);
}
this._bounds = bounds;
this.timerId = window.setTimeout(
this._moveGriddedTiles,
this.tileLoadingDelay
);
}
}
}
@@ -636,28 +661,31 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
/**
* Method: moveGriddedTiles
*
* Parameters:
* bounds - {<OpenLayers.Bounds>}
*/
moveGriddedTiles: function(bounds) {
moveGriddedTiles: function() {
var bounds = this._bounds;
var shifted = true;
var buffer = this.buffer || 1;
while (true) {
var tlLayer = this.grid[0][0].position;
var tlViewPort =
this.map.getViewPortPxFromLayerPx(tlLayer);
if (tlViewPort.x > -this.tileSize.w * (buffer - 1)) {
this.shiftColumn(true);
} else if (tlViewPort.x < -this.tileSize.w * buffer) {
this.shiftColumn(false);
} else if (tlViewPort.y > -this.tileSize.h * (buffer - 1)) {
this.shiftRow(true);
} else if (tlViewPort.y < -this.tileSize.h * buffer) {
this.shiftRow(false);
} else {
break;
}
};
var tlLayer = this.grid[0][0].position;
var tlViewPort = this.map.getViewPortPxFromLayerPx(tlLayer);
if (tlViewPort.x > -this.tileSize.w * (buffer - 1)) {
this.shiftColumn(true);
} else if (tlViewPort.x < -this.tileSize.w * buffer) {
this.shiftColumn(false);
} else if (tlViewPort.y > -this.tileSize.h * (buffer - 1)) {
this.shiftRow(true);
} else if (tlViewPort.y < -this.tileSize.h * buffer) {
this.shiftRow(false);
} else {
shifted = false;
delete this._bounds;
}
if (shifted) {
// we may have other row or columns to shift, schedule it
// with a setTimeout, to give the user a chance to sneak
// in moveTo's
this.timerId = window.setTimeout(this._moveGriddedTiles, 0);
}
},
/**