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

Merge pull request #10392 from ahocevar/interim-vectortiles

Browse Source 
Fix interim tile handing for vector tiles
This commit is contained in:
Andreas Hocevar
2019-12-09 09:29:01 +01:00
committed by GitHub
parent 9939f082d0 174dea3232
commit dc3e515c0e
5 changed files with 80 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -139,11 +139,12 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
* @inheritDoc
*/
getTile(z, x, y, frameState) {
const tile = /** @type {import("../../VectorRenderTile.js").default} */ (super.getTile(z, x, y, frameState));
const pixelRatio = frameState.pixelRatio;
const viewState = frameState.viewState;
const resolution = viewState.resolution;
const projection = viewState.projection;
const layer = this.getLayer();
const tile = layer.getSource().getTile(z, x, y, pixelRatio, projection);
if (tile.getState() < TileState.LOADED) {
tile.wantedResolution = resolution;
const tileUid = getUid(tile);
@@ -158,11 +159,11 @@ class CanvasVectorTileLayerRenderer extends CanvasTileLayerRenderer {
tile.wantedResolution = resolution;
}
const render = this.prepareTile(tile, pixelRatio, projection, false);
if (render && this.getLayer().getRenderMode() !== VectorTileRenderType.VECTOR) {
if (render && layer.getRenderMode() !== VectorTileRenderType.VECTOR) {
this.renderTileImage_(tile, frameState);
}
}
return tile;
return super.getTile(z, x, y, frameState);
}
/**

31
src/ol/source/VectorTile.js
View File

@@ -7,7 +7,7 @@ import VectorRenderTile from '../VectorRenderTile.js';
import Tile from '../VectorTile.js';
import {toSize} from '../size.js';
import UrlTile from './UrlTile.js';
import {getKeyZXY, getKey} from '../tilecoord.js';
import {getKeyZXY} from '../tilecoord.js';
import {createXYZ, extentFromProjection, createForProjection} from '../tilegrid.js';
import {buffer as bufferExtent, getIntersection, intersects} from '../extent.js';
import EventType from '../events/EventType.js';
@@ -131,7 +131,7 @@ class VectorTile extends UrlTile {
* @private
* @type {Object<string, import("../VectorTile.js").default>}
*/
this.sourceTileByCoordKey_ = {};
this.sourceTileByKey_ = {};
/**
* @private
@@ -172,7 +172,7 @@ class VectorTile extends UrlTile {
*/
clear() {
this.tileCache.clear();
this.sourceTileByCoordKey_ = {};
this.sourceTileByKey_ = {};
this.sourceTilesByTileKey_ = {};
}
@@ -211,24 +211,23 @@ class VectorTile extends UrlTile {
--loadedZ;
covered = true;
sourceTileGrid.forEachTileCoord(extent, loadedZ, function(sourceTileCoord) {
const coordKey = getKey(sourceTileCoord);
const tileUrl = this.tileUrlFunction(sourceTileCoord, pixelRatio, projection);
let sourceTile;
if (coordKey in this.sourceTileByCoordKey_) {
sourceTile = this.sourceTileByCoordKey_[coordKey];
const state = sourceTile.getState();
if (state === TileState.LOADED || state === TileState.ERROR || state === TileState.EMPTY) {
sourceTiles.push(sourceTile);
return;
}
} else if (loadedZ === sourceZ) {
const tileUrl = this.tileUrlFunction(sourceTileCoord, pixelRatio, projection);
if (tileUrl !== undefined) {
if (tileUrl !== undefined) {
if (tileUrl in this.sourceTileByKey_) {
sourceTile = this.sourceTileByKey_[tileUrl];
const state = sourceTile.getState();
if (state === TileState.LOADED || state === TileState.ERROR || state === TileState.EMPTY) {
sourceTiles.push(sourceTile);
return;
}
} else if (loadedZ === sourceZ) {
sourceTile = new this.tileClass(sourceTileCoord, TileState.IDLE, tileUrl,
this.format_, this.tileLoadFunction);
sourceTile.extent = sourceTileGrid.getTileCoordExtent(sourceTileCoord);
sourceTile.projection = projection;
sourceTile.resolution = sourceTileGrid.getResolution(sourceTileCoord[0]);
this.sourceTileByCoordKey_[coordKey] = sourceTile;
this.sourceTileByKey_[tileUrl] = sourceTile;
sourceTile.addEventListener(EventType.CHANGE, this.handleTileChange.bind(this));
sourceTile.load();
}
@@ -307,7 +306,7 @@ class VectorTile extends UrlTile {
sourceTile.consumers--;
if (sourceTile.consumers === 0) {
sourceTile.dispose();
delete this.sourceTileByCoordKey_[getKey(sourceTile.tileCoord)];
delete this.sourceTileByKey_[sourceTile.getKey()];
}
}
}

3
test/spec/ol/renderer/canvas/vectortilelayer.test.js
View File

@@ -9,7 +9,6 @@ import {getCenter} from '../../../../../src/ol/extent.js';
import MVT from '../../../../../src/ol/format/MVT.js';
import Point from '../../../../../src/ol/geom/Point.js';
import VectorTileLayer from '../../../../../src/ol/layer/VectorTile.js';
import {getKey} from '../../../../../src/ol/tilecoord.js';
import {get as getProjection} from '../../../../../src/ol/proj.js';
import {checkedFonts} from '../../../../../src/ol/render/canvas.js';
import RenderFeature from '../../../../../src/ol/render/Feature.js';
@@ -317,7 +316,7 @@ describe('ol.renderer.canvas.VectorTileLayer', function() {
tileClass: TileClass,
tileGrid: createXYZ()
});
source.sourceTileByCoordKey_[getKey(sourceTile.tileCoord)] = sourceTile;
source.sourceTileByKey_[sourceTile.getKey()] = sourceTile;
source.sourceTilesByTileKey_[sourceTile.getKey()] = [sourceTile];
executorGroup = {};
source.getTile = function() {

59
test/spec/ol/source/vectortile.test.js
View File

@@ -11,6 +11,8 @@ import {createXYZ} from '../../../../src/ol/tilegrid.js';
import TileGrid from '../../../../src/ol/tilegrid/TileGrid.js';
import {listen, unlistenByKey} from '../../../../src/ol/events.js';
import TileState from '../../../../src/ol/TileState.js';
import {getCenter} from '../../../../src/ol/extent.js';
import {unByKey} from '../../../../src/ol/Observable.js';
describe('ol.source.VectorTile', function() {
@@ -295,4 +297,61 @@ describe('ol.source.VectorTile', function() {
});
describe('interim tile handling', function() {
let map, source, target;
beforeEach(function() {
target = document.createElement('div');
target.style.width = '100px';
target.style.height = '100px';
document.body.appendChild(target);
const extent = [1824704.739223726, 6141868.096770482, 1827150.7241288517, 6144314.081675608];
source = new VectorTileSource({
format: new MVT(),
url: 'spec/ol/data/14-8938-5680.vector.pbf',
minZoom: 14,
maxZoom: 14
});
map = new Map({
pixelRatio: 1,
target: target,
layers: [
new VectorTileLayer({
extent: extent,
source: source
})
],
view: new View({
center: getCenter(extent),
zoom: 15
})
});
});
afterEach(function() {
map.setTarget(null);
document.body.removeChild(target);
});
it('re-renders when source changes', function(done) {
map.once('rendercomplete', function() {
const key = map.on('rendercomplete', function() {
const tile = source.getTile(14, 8938, 5680, 1, map.getView().getProjection());
expect(tile.getKey()).to.be('spec/ol/data/14-8938-5680.vector.pbf?new/14,8938,5680');
expect(tile.interimTile).to.be.a(VectorRenderTile);
expect(tile.interimTile.getKey()).to.be('spec/ol/data/14-8938-5680.vector.pbf/14,8938,5680');
const sourceTiles = source.getSourceTiles(1, map.getView().getProjection(), tile);
if (sourceTiles) {
expect(sourceTiles[0].getKey()).to.be('spec/ol/data/14-8938-5680.vector.pbf?new');
unByKey(key);
done();
}
});
source.setUrl('spec/ol/data/14-8938-5680.vector.pbf?new');
});
});
});
});

2
test/spec/ol/vectorrendertile.test.js
View File

@@ -116,7 +116,7 @@ describe('ol.VectorRenderTile', function() {
it('#dispose() when source tiles are loaded', function(done) {
const source = new VectorTileSource({
format: new GeoJSON(),
url: 'spec/ol/data/point.json',
url: 'spec/ol/data/point.json?{z}/{x}/{y}',
tileGrid: createXYZ()
});
source.getTileGridForProjection = function() {