From 13e1ae957456b3483813a736b7f057295caa45f8 Mon Sep 17 00:00:00 2001 From: mike-000 <49240900+mike-000@users.noreply.github.com> Date: Mon, 21 Dec 2020 22:52:46 +0000 Subject: [PATCH] Use tilegrid extent as default attributionExtent Test attributions --- src/ol/source/TileJSON.js | 7 +- src/ol/source/UTFGrid.js | 7 +- test/spec/ol/source/tilejson.test.js | 108 ++++++++++++++++++++------- 3 files changed, 87 insertions(+), 35 deletions(-) diff --git a/src/ol/source/TileJSON.js b/src/ol/source/TileJSON.js index c61ab6ea60..3ea4a969b5 100644 --- a/src/ol/source/TileJSON.js +++ b/src/ol/source/TileJSON.js @@ -171,10 +171,11 @@ class TileJSON extends TileImage { extent = applyTransform(tileJSON['bounds'], transform); } + const gridExtent = extentFromProjection(sourceProjection); const minZoom = tileJSON['minzoom'] || 0; const maxZoom = tileJSON['maxzoom'] || 22; const tileGrid = createXYZ({ - extent: extentFromProjection(sourceProjection), + extent: gridExtent, maxZoom: maxZoom, minZoom: minZoom, tileSize: this.tileSize_, @@ -184,9 +185,7 @@ class TileJSON extends TileImage { this.tileUrlFunction = createFromTemplates(tileJSON['tiles'], tileGrid); if (tileJSON['attribution'] !== undefined && !this.getAttributions()) { - const attributionExtent = - extent !== undefined ? extent : epsg4326Projection.getExtent(); - + const attributionExtent = extent !== undefined ? extent : gridExtent; this.setAttributions(function (frameState) { if (intersects(attributionExtent, frameState.extent)) { return [tileJSON['attribution']]; diff --git a/src/ol/source/UTFGrid.js b/src/ol/source/UTFGrid.js index 272f545ae2..c5b96469b3 100644 --- a/src/ol/source/UTFGrid.js +++ b/src/ol/source/UTFGrid.js @@ -435,10 +435,11 @@ class UTFGrid extends TileSource { extent = applyTransform(tileJSON['bounds'], transform); } + const gridExtent = extentFromProjection(sourceProjection); const minZoom = tileJSON['minzoom'] || 0; const maxZoom = tileJSON['maxzoom'] || 22; const tileGrid = createXYZ({ - extent: extentFromProjection(sourceProjection), + extent: gridExtent, maxZoom: maxZoom, minZoom: minZoom, }); @@ -455,9 +456,7 @@ class UTFGrid extends TileSource { this.tileUrlFunction_ = createFromTemplates(grids, tileGrid); if (tileJSON['attribution'] !== undefined) { - const attributionExtent = - extent !== undefined ? extent : epsg4326Projection.getExtent(); - + const attributionExtent = extent !== undefined ? extent : gridExtent; this.setAttributions(function (frameState) { if (intersects(attributionExtent, frameState.extent)) { return [tileJSON['attribution']]; diff --git a/test/spec/ol/source/tilejson.test.js b/test/spec/ol/source/tilejson.test.js index e5b91117c8..2ba4489e50 100644 --- a/test/spec/ol/source/tilejson.test.js +++ b/test/spec/ol/source/tilejson.test.js @@ -1,5 +1,6 @@ import Source from '../../../../src/ol/source/Source.js'; import TileJSON from '../../../../src/ol/source/TileJSON.js'; +import {transformExtent} from '../../../../src/ol/proj.js'; import {unByKey} from '../../../../src/ol/Observable.js'; describe('ol.source.TileJSON', function () { @@ -27,34 +28,34 @@ describe('ol.source.TileJSON', function () { }); }); + const tileJSON = { + attribution: 'TileMill', + bounds: [-180, -85.05112877980659, 180, 85.05112877980659], + center: [0, 0, 4], + created: 1322764050886, + description: + 'One of the example maps that comes with TileMill - a bright & colorful world map that blends retro and high-tech with its folded paper texture and interactive flag tooltips. ', + download: 'https://a.tiles.mapbox.com/v3/mapbox.geography-class.mbtiles', + embed: 'https://a.tiles.mapbox.com/v3/mapbox.geography-class.html', + id: 'mapbox.geography-class', + mapbox_logo: true, + maxzoom: 8, + minzoom: 0, + name: 'Geography Class', + private: false, + scheme: 'xyz', + tilejson: '2.2.0', + tiles: [ + 'https://a.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', + 'https://b.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', + 'https://c.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', + 'https://d.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', + ], + version: '1.0.0', + webpage: 'https://a.tiles.mapbox.com/v3/mapbox.geography-class/page.html', + }; + it('parses inline TileJSON', function () { - const tileJSON = { - bounds: [-180, -85.05112877980659, 180, 85.05112877980659], - center: [0, 0, 4], - created: 1322764050886, - description: - 'One of the example maps that comes with TileMill - a bright & colorful world map that blends retro and high-tech with its folded paper texture and interactive flag tooltips. ', - download: - 'https://a.tiles.mapbox.com/v3/mapbox.geography-class.mbtiles', - embed: 'https://a.tiles.mapbox.com/v3/mapbox.geography-class.html', - id: 'mapbox.geography-class', - mapbox_logo: true, - maxzoom: 8, - minzoom: 0, - name: 'Geography Class', - private: false, - scheme: 'xyz', - tilejson: '2.2.0', - tiles: [ - 'https://a.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', - 'https://b.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', - 'https://c.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', - 'https://d.tiles.mapbox.com/v3/mapbox.geography-class/{z}/{x}/{y}.png', - ], - version: '1.0.0', - webpage: - 'https://a.tiles.mapbox.com/v3/mapbox.geography-class/page.html', - }; const source = new TileJSON({ tileJSON: tileJSON, }); @@ -75,6 +76,59 @@ describe('ol.source.TileJSON', function () { 'https://d.tiles.mapbox.com/v3/mapbox.geography-class/1/1/1.png' ); }); + + it('returns attributions, but not when outside bounds', function () { + tileJSON.bounds = [ + -10.764179999935878, + 49.528423000201656, + 1.9134115551745678, + 61.3311509999582, + ]; + const source = new TileJSON({ + tileJSON: tileJSON, + }); + expect(source.getState()).to.be('ready'); + const attributions = source.getAttributions(); + expect(attributions).to.not.be(null); + expect(typeof attributions).to.be('function'); + const frameState = {}; + frameState.extent = transformExtent( + [1, 51, 2, 52], + 'EPSG:4326', + 'EPSG:3857' + ); + expect(attributions(frameState)).to.eql(['TileMill']); + frameState.extent = transformExtent( + [2, 51, 3, 52], + 'EPSG:4326', + 'EPSG:3857' + ); + expect(attributions(frameState)).to.be(null); + }); + + it('attributions bounds default to the tilegrid extent', function () { + delete tileJSON.bounds; + const source = new TileJSON({ + tileJSON: tileJSON, + }); + expect(source.getState()).to.be('ready'); + const attributions = source.getAttributions(); + expect(attributions).to.not.be(null); + expect(typeof attributions).to.be('function'); + const frameState = {}; + frameState.extent = transformExtent( + [1, 51, 2, 52], + 'EPSG:4326', + 'EPSG:3857' + ); + expect(attributions(frameState)).to.eql(['TileMill']); + frameState.extent = transformExtent( + [2, 51, 3, 52], + 'EPSG:4326', + 'EPSG:3857' + ); + expect(attributions(frameState)).to.eql(['TileMill']); + }); }); describe('#getState', function () {