ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Prepare tiles for rendering earlier

Browse Source 
By overriding getTile() and creating replay and image there, we can do
all preparations earlier and stop creating new tiles when we have maxed
out the frame time budget. It also allows us to get rid of the
drawTileImage override.
This commit is contained in:
ahocevar
2018-05-24 15:56:26 +02:00
parent 690efda169
commit c24976155b
1 changed files with 24 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
src/ol/renderer/canvas/VectorTileLayer.js
View File

@@ -126,6 +126,21 @@ CanvasVectorTileLayerRenderer.prototype.disposeInternal = function() {
}; };
/**
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.getTile = function(z, x, y, pixelRatio, projection) {
const tile = CanvasTileLayerRenderer.prototype.getTile.call(this, z, x, y, pixelRatio, projection);
if (tile.getState() === TileState.LOADED) {
this.createReplayGroup_(tile, pixelRatio, projection);
if (this.context) {
this.renderTileImage_(tile, pixelRatio, projection);
}
}
return tile;
};
/** /**
* @inheritDoc * @inheritDoc
*/ */
@@ -149,13 +164,12 @@ CanvasVectorTileLayerRenderer.prototype.prepareFrame = function(frameState, laye
/** /**
* @param {module:ol/VectorImageTile} tile Tile. * @param {module:ol/VectorImageTile} tile Tile.
* @param {module:ol/PluggableMap~FrameState} frameState Frame state. * @param {number} pixelRatio Pixel ratio.
* @param {module:ol/proj/Projection} projection Projection.
* @private * @private
*/ */
CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(tile, frameState) { CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(tile, pixelRatio, projection) {
const layer = this.getLayer(); const layer = this.getLayer();
const pixelRatio = frameState.pixelRatio;
const projection = frameState.viewState.projection;
const revision = layer.getRevision(); const revision = layer.getRevision();
const renderOrder = /** @type {module:ol/render~OrderFunction} */ (layer.getRenderOrder()) || null; const renderOrder = /** @type {module:ol/render~OrderFunction} */ (layer.getRenderOrder()) || null;
@@ -241,20 +255,6 @@ CanvasVectorTileLayerRenderer.prototype.createReplayGroup_ = function(tile, fram
}; };
/**
* @inheritDoc
*/
CanvasVectorTileLayerRenderer.prototype.drawTileImage = function(
tile, frameState, layerState, x, y, w, h, gutter, transition) {
const vectorImageTile = /** @type {module:ol/VectorImageTile} */ (tile);
this.createReplayGroup_(vectorImageTile, frameState);
if (this.context) {
this.renderTileImage_(vectorImageTile, frameState, layerState);
CanvasTileLayerRenderer.prototype.drawTileImage.apply(this, arguments);
}
};
/** /**
* @inheritDoc * @inheritDoc
*/ */
@@ -466,12 +466,12 @@ CanvasVectorTileLayerRenderer.prototype.renderFeature = function(feature, square
/** /**
* @param {module:ol/VectorImageTile} tile Tile. * @param {module:ol/VectorImageTile} tile Tile.
* @param {module:ol/PluggableMap~FrameState} frameState Frame state. * @param {number} pixelRatio Pixel ratio.
* @param {module:ol/layer/Layer~State} layerState Layer state. * @param {module:ol/proj/Projection} projection Projection.
* @private * @private
*/ */
CanvasVectorTileLayerRenderer.prototype.renderTileImage_ = function( CanvasVectorTileLayerRenderer.prototype.renderTileImage_ = function(
tile, frameState, layerState) { tile, pixelRatio, projection) {
const layer = this.getLayer(); const layer = this.getLayer();
const replayState = tile.getReplayState(layer); const replayState = tile.getReplayState(layer);
const revision = layer.getRevision(); const revision = layer.getRevision();
@@ -480,12 +480,11 @@ CanvasVectorTileLayerRenderer.prototype.renderTileImage_ = function(
replayState.renderedTileRevision = revision; replayState.renderedTileRevision = revision;
const tileCoord = tile.wrappedTileCoord; const tileCoord = tile.wrappedTileCoord;
const z = tileCoord[0]; const z = tileCoord[0];
const pixelRatio = frameState.pixelRatio;
const source = /** @type {module:ol/source/VectorTile} */ (layer.getSource()); const source = /** @type {module:ol/source/VectorTile} */ (layer.getSource());
const tileGrid = source.getTileGridForProjection(frameState.viewState.projection); const tileGrid = source.getTileGridForProjection(projection);
const resolution = tileGrid.getResolution(z); const resolution = tileGrid.getResolution(z);
const context = tile.getContext(layer); const context = tile.getContext(layer);
const size = source.getTilePixelSize(z, pixelRatio, frameState.viewState.projection); const size = source.getTilePixelSize(z, pixelRatio, projection);
context.canvas.width = size[0]; context.canvas.width = size[0];
context.canvas.height = size[1]; context.canvas.height = size[1];
const tileExtent = tileGrid.getTileCoordExtent(tileCoord, this.tmpExtent); const tileExtent = tileGrid.getTileCoordExtent(tileCoord, this.tmpExtent);
@@ -503,4 +502,5 @@ CanvasVectorTileLayerRenderer.prototype.renderTileImage_ = function(
} }
} }
}; };
export default CanvasVectorTileLayerRenderer; export default CanvasVectorTileLayerRenderer;