Only request tiles within the layer extent

Layer renderers are now responsible for requesting data within a limited extent.
This commit is contained in:
Tim Schaub
2014-07-06 23:30:59 -06:00
parent 234cff4de5
commit 2b0284a342
9 changed files with 38 additions and 11 deletions

View File

@@ -44,6 +44,7 @@ ol.proj.addCoordinateTransforms('EPSG:4326', projection,
var extent = [420000, 30000, 900000, 350000]; var extent = [420000, 30000, 900000, 350000];
var layers = [ var layers = [
new ol.layer.Tile({ new ol.layer.Tile({
extent: extent,
source: new ol.source.TileWMS({ source: new ol.source.TileWMS({
url: 'http://wms.geo.admin.ch/', url: 'http://wms.geo.admin.ch/',
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
@@ -57,11 +58,11 @@ var layers = [
'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale', 'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
'FORMAT': 'image/jpeg' 'FORMAT': 'image/jpeg'
}, },
extent: extent,
serverType: 'mapserver' serverType: 'mapserver'
}) })
}), }),
new ol.layer.Tile({ new ol.layer.Tile({
extent: extent,
source: new ol.source.TileWMS({ source: new ol.source.TileWMS({
url: 'http://wms.geo.admin.ch/', url: 'http://wms.geo.admin.ch/',
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
@@ -72,7 +73,6 @@ var layers = [
'National parks / geo.admin.ch</a>' 'National parks / geo.admin.ch</a>'
})], })],
params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'}, params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
extent: extent,
serverType: 'mapserver' serverType: 'mapserver'
}) })
}) })

View File

@@ -24,6 +24,7 @@ projection.setExtent([485869.5728, 76443.1884, 837076.5648, 299941.7864]);
var extent = [420000, 30000, 900000, 350000]; var extent = [420000, 30000, 900000, 350000];
var layers = [ var layers = [
new ol.layer.Image({ new ol.layer.Image({
extent: extent,
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: 'http://wms.geo.admin.ch/', url: 'http://wms.geo.admin.ch/',
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
@@ -37,11 +38,11 @@ var layers = [
'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale', 'LAYERS': 'ch.swisstopo.pixelkarte-farbe-pk1000.noscale',
'FORMAT': 'image/jpeg' 'FORMAT': 'image/jpeg'
}, },
serverType: /** @type {ol.source.wms.ServerType} */ ('mapserver'), serverType: /** @type {ol.source.wms.ServerType} */ ('mapserver')
extent: extent
}) })
}), }),
new ol.layer.Image({ new ol.layer.Image({
extent: extent,
source: new ol.source.ImageWMS({ source: new ol.source.ImageWMS({
url: 'http://wms.geo.admin.ch/', url: 'http://wms.geo.admin.ch/',
crossOrigin: 'anonymous', crossOrigin: 'anonymous',
@@ -52,8 +53,7 @@ var layers = [
'National parks / geo.admin.ch</a>' 'National parks / geo.admin.ch</a>'
})], })],
params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'}, params: {'LAYERS': 'ch.bafu.schutzgebiete-paerke_nationaler_bedeutung'},
serverType: /** @type {ol.source.wms.ServerType} */ ('mapserver'), serverType: /** @type {ol.source.wms.ServerType} */ ('mapserver')
extent: extent
}) })
}) })
]; ];

View File

@@ -10,10 +10,10 @@ var layers = [
source: new ol.source.MapQuest({layer: 'sat'}) source: new ol.source.MapQuest({layer: 'sat'})
}), }),
new ol.layer.Tile({ new ol.layer.Tile({
extent: [-13884991, 2870341, -7455066, 6338219],
source: new ol.source.TileWMS(/** @type {olx.source.TileWMSOptions} */ ({ source: new ol.source.TileWMS(/** @type {olx.source.TileWMSOptions} */ ({
url: 'http://demo.opengeo.org/geoserver/wms', url: 'http://demo.opengeo.org/geoserver/wms',
params: {'LAYERS': 'topp:states', 'TILED': true}, params: {'LAYERS': 'topp:states', 'TILED': true},
extent: [-13884991, 2870341, -7455066, 6338219],
serverType: 'geoserver' serverType: 'geoserver'
})) }))
}) })

View File

@@ -9,6 +9,11 @@
<link rel="stylesheet" href="../resources/layout.css" type="text/css"> <link rel="stylesheet" href="../resources/layout.css" type="text/css">
<link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css"> <link rel="stylesheet" href="../resources/bootstrap/css/bootstrap-responsive.min.css" type="text/css">
<title>WMTS HiDPI example</title> <title>WMTS HiDPI example</title>
<style>
.map {
background: white;
}
</style>
</head> </head>
<body> <body>

View File

@@ -23,7 +23,6 @@ var urls = [
var hiDPI = ol.BrowserFeature.DEVICE_PIXEL_RATIO > 1; var hiDPI = ol.BrowserFeature.DEVICE_PIXEL_RATIO > 1;
var source = new ol.source.WMTS({ var source = new ol.source.WMTS({
extent: [977844.377599999, 5837774.6617, 1915609.8654, 6295560.8122],
projection: 'EPSG:3857', projection: 'EPSG:3857',
layer: hiDPI ? 'bmaphidpi' : 'geolandbasemap', layer: hiDPI ? 'bmaphidpi' : 'geolandbasemap',
tilePixelRatio: hiDPI ? 2 : 1, tilePixelRatio: hiDPI ? 2 : 1,
@@ -64,6 +63,7 @@ var source = new ol.source.WMTS({
var map = new ol.Map({ var map = new ol.Map({
layers: [ layers: [
new ol.layer.Tile({ new ol.layer.Tile({
extent: [977844.377599999, 5837774.6617, 1915609.8654, 6295560.8122],
source: source source: source
}) })
], ],

View File

@@ -35,6 +35,7 @@ var map = new ol.Map({
}), }),
new ol.layer.Tile({ new ol.layer.Tile({
opacity: 0.7, opacity: 0.7,
extent: projectionExtent,
source: new ol.source.WMTS({ source: new ol.source.WMTS({
attributions: [attribution], attributions: [attribution],
url: 'http://services.arcgisonline.com/arcgis/rest/' + url: 'http://services.arcgisonline.com/arcgis/rest/' +
@@ -48,7 +49,6 @@ var map = new ol.Map({
resolutions: resolutions, resolutions: resolutions,
matrixIds: matrixIds matrixIds: matrixIds
}), }),
extent: projectionExtent,
style: 'default' style: 'default'
}) })
}) })

View File

@@ -193,6 +193,11 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame =
} else { } else {
extent = frameState.extent; extent = frameState.extent;
} }
if (goog.isDef(layerState.extent)) {
extent = ol.extent.getIntersection(extent, layerState.extent);
}
var tileRange = tileGrid.getTileRangeForExtentAndResolution( var tileRange = tileGrid.getTileRangeForExtentAndResolution(
extent, tileResolution); extent, tileResolution);
@@ -233,6 +238,11 @@ ol.renderer.canvas.TileLayer.prototype.prepareFrame =
if (z != this.renderedCanvasZ_ || if (z != this.renderedCanvasZ_ ||
!this.renderedCanvasTileRange_.containsTileRange(tileRange)) { !this.renderedCanvasTileRange_.containsTileRange(tileRange)) {
this.renderedCanvasTileRange_ = null; this.renderedCanvasTileRange_ = null;
// Due to limited layer extent, we may be rendering tiles on a small
// portion of the canvas.
if (z < this.renderedCanvasZ_) {
this.context_.clearRect(0, 0, canvasWidth, canvasHeight);
}
} }
} }
} }

View File

@@ -109,6 +109,11 @@ ol.renderer.dom.TileLayer.prototype.prepareFrame =
} else { } else {
extent = frameState.extent; extent = frameState.extent;
} }
if (goog.isDef(layerState.extent)) {
extent = ol.extent.getIntersection(extent, layerState.extent);
}
var tileRange = tileGrid.getTileRangeForExtentAndResolution( var tileRange = tileGrid.getTileRangeForExtentAndResolution(
extent, tileResolution); extent, tileResolution);

View File

@@ -207,11 +207,18 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
var allTilesLoaded = true; var allTilesLoaded = true;
var tmpExtent = ol.extent.createEmpty(); var tmpExtent = ol.extent.createEmpty();
var tmpTileRange = new ol.TileRange(0, 0, 0, 0); var tmpTileRange = new ol.TileRange(0, 0, 0, 0);
var childTileRange, fullyLoaded, tile, tileState, x, y; var childTileRange, fullyLoaded, tile, tileState, x, y, tileExtent;
for (x = tileRange.minX; x <= tileRange.maxX; ++x) { for (x = tileRange.minX; x <= tileRange.maxX; ++x) {
for (y = tileRange.minY; y <= tileRange.maxY; ++y) { for (y = tileRange.minY; y <= tileRange.maxY; ++y) {
tile = tileSource.getTile(z, x, y, pixelRatio, projection); tile = tileSource.getTile(z, x, y, pixelRatio, projection);
if (goog.isDef(layerState.extent)) {
// ignore tiles outside layer extent
tileExtent = tileGrid.getTileCoordExtent(tile.tileCoord, tmpExtent);
if (!ol.extent.intersects(tileExtent, layerState.extent)) {
continue;
}
}
tileState = tile.getState(); tileState = tile.getState();
if (tileState == ol.TileState.LOADED) { if (tileState == ol.TileState.LOADED) {
if (mapRenderer.isTileTextureLoaded(tile)) { if (mapRenderer.isTileTextureLoaded(tile)) {
@@ -243,7 +250,7 @@ ol.renderer.webgl.TileLayer.prototype.prepareFrame =
var zs = goog.array.map(goog.object.getKeys(tilesToDrawByZ), Number); var zs = goog.array.map(goog.object.getKeys(tilesToDrawByZ), Number);
goog.array.sort(zs); goog.array.sort(zs);
var u_tileOffset = goog.vec.Vec4.createFloat32(); var u_tileOffset = goog.vec.Vec4.createFloat32();
var i, ii, sx, sy, tileExtent, tileKey, tilesToDraw, tx, ty; var i, ii, sx, sy, tileKey, tilesToDraw, tx, ty;
for (i = 0, ii = zs.length; i < ii; ++i) { for (i = 0, ii = zs.length; i < ii; ++i) {
tilesToDraw = tilesToDrawByZ[zs[i]]; tilesToDraw = tilesToDrawByZ[zs[i]];
for (tileKey in tilesToDraw) { for (tileKey in tilesToDraw) {