From 8c00bbc91d4fb6c371c399a97640e0464a4e28d0 Mon Sep 17 00:00:00 2001 From: Andreas Hocevar Date: Tue, 16 May 2017 23:58:42 +0200 Subject: [PATCH] Report ol.VectorTile instead of ol.VectorImageTile loads --- src/ol/source/vectortile.js | 7 ++----- src/ol/vectorimagetile.js | 13 ++++++++++++- test/spec/ol/source/vectortile.test.js | 20 +++++++++++++++++++- test/spec/ol/vectorimagetile.test.js | 10 +++++----- 4 files changed, 38 insertions(+), 12 deletions(-) diff --git a/src/ol/source/vectortile.js b/src/ol/source/vectortile.js index af3a529873..9b448c8771 100644 --- a/src/ol/source/vectortile.js +++ b/src/ol/source/vectortile.js @@ -4,8 +4,6 @@ goog.require('ol'); goog.require('ol.TileState'); goog.require('ol.VectorImageTile'); goog.require('ol.VectorTile'); -goog.require('ol.events'); -goog.require('ol.events.EventType'); goog.require('ol.proj'); goog.require('ol.size'); goog.require('ol.tilegrid'); @@ -114,9 +112,8 @@ ol.source.VectorTile.prototype.getTile = function(z, x, y, pixelRatio, projectio tileUrl !== undefined ? tileUrl : '', this.format_, this.tileLoadFunction, urlTileCoord, this.tileUrlFunction, this.tileGrid, this.getTileGridForProjection(projection), - this.sourceTiles_, pixelRatio, projection, this.tileClass); - ol.events.listen(tile, ol.events.EventType.CHANGE, - this.handleTileChange, this); + this.sourceTiles_, pixelRatio, projection, this.tileClass, + this.handleTileChange.bind(this)); this.tileCache.set(tileCoordKey, tile); return tile; diff --git a/src/ol/vectorimagetile.js b/src/ol/vectorimagetile.js index 7ac49ab936..5f2a9451cc 100644 --- a/src/ol/vectorimagetile.js +++ b/src/ol/vectorimagetile.js @@ -29,10 +29,12 @@ goog.require('ol.featureloader'); * @param {function(new: ol.VectorTile, ol.TileCoord, ol.TileState, string, * ol.format.Feature, ol.TileLoadFunctionType)} tileClass Class to * instantiate for source tiles. + * @param {function(this: ol.source.VectorTile, ol.events.Event)} handleTileChange + * Function to call when a source tile's state changes. */ ol.VectorImageTile = function(tileCoord, state, src, format, tileLoadFunction, urlTileCoord, tileUrlFunction, sourceTileGrid, tileGrid, sourceTiles, - pixelRatio, projection, tileClass) { + pixelRatio, projection, tileClass, handleTileChange) { ol.Tile.call(this, tileCoord, state); @@ -86,6 +88,11 @@ ol.VectorImageTile = function(tileCoord, state, src, format, tileLoadFunction, */ this.loadListenerKeys_ = []; + /** + * @type {Array.} + */ + this.sourceTileListenerKeys_ = []; + if (urlTileCoord) { var extent = tileGrid.getTileCoordExtent(urlTileCoord); var resolution = tileGrid.getResolution(tileCoord[0]); @@ -104,6 +111,8 @@ ol.VectorImageTile = function(tileCoord, state, src, format, tileLoadFunction, tileUrl == undefined ? ol.TileState.EMPTY : ol.TileState.IDLE, tileUrl == undefined ? '' : tileUrl, format, tileLoadFunction); + this.sourceTileListenerKeys_.push( + ol.events.listen(sourceTile, ol.events.EventType.CHANGE, handleTileChange)); } sourceTile.consumers++; this.tileKeys.push(sourceTileKey); @@ -139,6 +148,8 @@ ol.VectorImageTile.prototype.disposeInternal = function() { } this.state = ol.TileState.ABORT; this.changed(); + this.sourceTileListenerKeys_.forEach(ol.events.unlistenByKey); + this.sourceTileListenerKeys_.length = 0; ol.Tile.prototype.disposeInternal.call(this); }; diff --git a/test/spec/ol/source/vectortile.test.js b/test/spec/ol/source/vectortile.test.js index 7a90d3225a..273a66f137 100644 --- a/test/spec/ol/source/vectortile.test.js +++ b/test/spec/ol/source/vectortile.test.js @@ -13,7 +13,8 @@ describe('ol.source.VectorTile', function() { var source = new ol.source.VectorTile({ format: format, tileGrid: ol.tilegrid.createXYZ({tileSize: 512}), - url: '{z}/{x}/{y}.pbf' + tilePixelRatio: 8, + url: 'spec/ol/data/{z}-{x}-{y}.vector.pbf' }); var tile; @@ -47,4 +48,21 @@ describe('ol.source.VectorTile', function() { }); }); + describe('Tile load events', function() { + it('triggers tileloadstart and tileloadend with ol.VectorTile', function(done) { + tile = source.getTile(14, 8938, -5681, 1, ol.proj.get('EPSG:3857')); + var started = false; + source.on('tileloadstart', function() { + started = true; + }); + source.on('tileloadend', function(e) { + expect(started).to.be(true); + expect(e.tile).to.be.a(ol.VectorTile); + expect(e.tile.getFeatures().length).to.be(1327); + done(); + }); + tile.load(); + }); + }); + }); diff --git a/test/spec/ol/vectorimagetile.test.js b/test/spec/ol/vectorimagetile.test.js index 8abe2ef5a9..8cd14276e8 100644 --- a/test/spec/ol/vectorimagetile.test.js +++ b/test/spec/ol/vectorimagetile.test.js @@ -16,7 +16,7 @@ describe('ol.VectorImageTile', function() { ol.VectorImageTile.defaultLoadFunction, [0, 0, 0], function() { return url; }, ol.tilegrid.createXYZ(), ol.tilegrid.createXYZ(), {}, - 1, ol.proj.get('EPSG:3857'), ol.VectorTile); + 1, ol.proj.get('EPSG:3857'), ol.VectorTile, function() {}); tile.load(); var sourceTile = tile.getTile(tile.tileKeys[0]); @@ -36,7 +36,7 @@ describe('ol.VectorImageTile', function() { ol.VectorImageTile.defaultLoadFunction, [0, 0, 0], function() { return url; }, ol.tilegrid.createXYZ(), ol.tilegrid.createXYZ(), {}, - 1, ol.proj.get('EPSG:3857'), ol.VectorTile); + 1, ol.proj.get('EPSG:3857'), ol.VectorTile, function() {}); tile.load(); @@ -52,7 +52,7 @@ describe('ol.VectorImageTile', function() { var tile = new ol.VectorImageTile([0, 0, 0], 0, url, format, ol.VectorImageTile.defaultLoadFunction, [0, 0, 0], function() {}, ol.tilegrid.createXYZ(), ol.tilegrid.createXYZ(), {}, - 1, ol.proj.get('EPSG:3857'), ol.VectorTile); + 1, ol.proj.get('EPSG:3857'), ol.VectorTile, function() {}); tile.load(); @@ -69,7 +69,7 @@ describe('ol.VectorImageTile', function() { ol.VectorImageTile.defaultLoadFunction, [0, 0, 0], function() { return url; }, ol.tilegrid.createXYZ(), ol.tilegrid.createXYZ({tileSize: 512}), {}, - 1, ol.proj.get('EPSG:3857'), ol.VectorTile); + 1, ol.proj.get('EPSG:3857'), ol.VectorTile, function() {}); tile.load(); expect(tile.loadListenerKeys_.length).to.be(4); @@ -89,7 +89,7 @@ describe('ol.VectorImageTile', function() { ol.VectorImageTile.defaultLoadFunction, [0, 0, 0], function() { return url; }, ol.tilegrid.createXYZ(), ol.tilegrid.createXYZ({tileSize: 512}), {}, - 1, ol.proj.get('EPSG:3857'), ol.VectorTile); + 1, ol.proj.get('EPSG:3857'), ol.VectorTile, function() {}); tile.load(); ol.events.listenOnce(tile, 'change', function() {