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

Merge branch 'master' of github.com:openlayers/ol3 into wms-improvements

Browse Source 
Conflicts:
	src/ol/source/tiledwmssource.js
	test/spec/ol/tileurlfunction.test.js
This commit is contained in:
ahocevar
2013-03-05 00:55:52 +01:00
parent 586f393492 1bac674eca
commit 66b790294d
49 changed files with 647 additions and 248 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/ol/renderer/canvas/canvastilelayerrenderer.js
+47 -16
View File
@@ -1,4 +1,3 @@
// FIXME don't redraw tiles if not needed
// FIXME find correct globalCompositeOperation
// FIXME optimize :-)
@@ -51,6 +50,12 @@ ol.renderer.canvas.TileLayer = function(mapRenderer, tileLayer) {
*/
this.transform_ = goog.vec.Mat4.createNumber();
/**
* @private
* @type {Array.<ol.Tile|undefined>}
*/
this.renderedTiles_ = null;
};
goog.inherits(ol.renderer.canvas.TileLayer, ol.renderer.canvas.Layer);
@@ -100,10 +105,11 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
var tileResolution = tileGrid.getResolution(z);
var tileRange = tileGrid.getTileRangeForExtentAndResolution(
frameState.extent, tileResolution);
var tileRangeWidth = tileRange.getWidth();
var tileRangeHeight = tileRange.getHeight();
var canvasSize = new ol.Size(
tileSize.width * tileRange.getWidth(),
tileSize.height * tileRange.getHeight());
tileSize.width * tileRangeWidth, tileSize.height * tileRangeHeight);
var canvas, context;
if (goog.isNull(this.canvas_)) {
@@ -115,6 +121,7 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
this.canvas_ = canvas;
this.canvasSize_ = canvasSize;
this.context_ = context;
this.renderedTiles_ = new Array(tileRangeWidth * tileRangeHeight);
} else {
canvas = this.canvas_;
context = this.context_;
@@ -122,11 +129,10 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
canvas.width = canvasSize.width;
canvas.height = canvasSize.height;
this.canvasSize_ = canvasSize;
this.renderedTiles_ = new Array(tileRangeWidth * tileRangeHeight);
}
}
context.clearRect(0, 0, canvasSize.width, canvasSize.height);
/**
* @type {Object.<number, Object.<string, ol.Tile>>}
*/
@@ -173,9 +179,12 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
/** @type {Array.<number>} */
var zs = goog.array.map(goog.object.getKeys(tilesToDrawByZ), Number);
goog.array.sort(zs);
var opaque = tileSource.getOpaque();
var origin = tileGrid.getTileCoordExtent(
new ol.TileCoord(z, tileRange.minX, tileRange.maxY)).getTopLeft();
var currentZ, i, scale, tileCoordKey, tileExtent, tilesToDraw;
var currentZ, i, index, scale, tileCoordKey, tileExtent, tilesToDraw;
var ix, iy, interimTileExtent, interimTileRange, maxX, maxY, minX, minY;
var height, width;
for (i = 0; i < zs.length; ++i) {
currentZ = zs[i];
tileSize = tileGrid.getTileSize(currentZ);
@@ -183,22 +192,44 @@ ol.renderer.canvas.TileLayer.prototype.renderFrame =
if (currentZ == z) {
for (tileCoordKey in tilesToDraw) {
tile = tilesToDraw[tileCoordKey];
context.drawImage(
tile.getImage(),
tileSize.width * (tile.tileCoord.x - tileRange.minX),
tileSize.height * (tileRange.maxY - tile.tileCoord.y));
tileCoord = tile.tileCoord;
index = (tileCoord.y - tileRange.minY) * tileRangeWidth +
(tileCoord.x - tileRange.minX);
if (this.renderedTiles_[index] != tile) {
x = tileSize.width * (tile.tileCoord.x - tileRange.minX);
y = tileSize.height * (tileRange.maxY - tile.tileCoord.y);
if (!opaque) {
context.clearRect(x, y, tileSize.width, tileSize.height);
}
context.drawImage(tile.getImage(), x, y);
this.renderedTiles_[index] = tile;
}
}
} else {
scale = tileGrid.getResolution(currentZ) / tileResolution;
for (tileCoordKey in tilesToDraw) {
tile = tilesToDraw[tileCoordKey];
tileExtent = tileGrid.getTileCoordExtent(tile.tileCoord);
context.drawImage(
tile.getImage(),
(tileExtent.minX - origin.x) / tileResolution,
(origin.y - tileExtent.maxY) / tileResolution,
scale * tileSize.width,
scale * tileSize.height);
x = (tileExtent.minX - origin.x) / tileResolution;
y = (origin.y - tileExtent.maxY) / tileResolution;
width = scale * tileSize.width;
height = scale * tileSize.height;
if (!opaque) {
context.clearRect(x, y, width, height);
}
context.drawImage(tile.getImage(), x, y, width, height);
interimTileRange =
tileGrid.getTileRangeForExtentAndZ(tileExtent, z);
minX = Math.max(interimTileRange.minX, tileRange.minX);
maxX = Math.min(interimTileRange.maxX, tileRange.maxX);
minY = Math.max(interimTileRange.minY, tileRange.minY);
maxY = Math.min(interimTileRange.maxY, tileRange.maxY);
for (ix = minX; ix <= maxX; ++ix) {
for (iy = minY; iy <= maxY; ++iy) {
this.renderedTiles_[(iy - tileRange.minY) * tileRangeWidth +
(ix - tileRange.minX)] = undefined;
}
}
}
}
}
src/ol/renderer/webgl/webglimagelayerrenderer.js
+12 -12
View File
@@ -45,7 +45,7 @@ ol.renderer.webgl.ImageLayer = function(mapRenderer, imageLayer) {
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.vertexCoordMatrix_ = goog.vec.Mat4.createNumber();
this.projectionMatrix_ = goog.vec.Mat4.createNumber();
};
goog.inherits(ol.renderer.webgl.ImageLayer, ol.renderer.webgl.Layer);
@@ -118,8 +118,8 @@ ol.renderer.webgl.ImageLayer.prototype.getTexture = function() {
/**
* @inheritDoc
*/
ol.renderer.webgl.ImageLayer.prototype.getVertexCoordMatrix = function() {
return this.vertexCoordMatrix_;
ol.renderer.webgl.ImageLayer.prototype.getProjectionMatrix = function() {
return this.projectionMatrix_;
};
@@ -188,7 +188,7 @@ ol.renderer.webgl.ImageLayer.prototype.renderFrame =
var canvas = this.getMapRenderer().getCanvas();
this.updateVertexCoordMatrix_(canvas.width, canvas.height,
this.updateProjectionMatrix_(canvas.width, canvas.height,
viewCenter, viewResolution, viewRotation, image.getExtent());
// Translate and scale to flip the Y coord.
@@ -214,24 +214,24 @@ ol.renderer.webgl.ImageLayer.prototype.renderFrame =
* @param {number} viewRotation View rotation.
* @param {ol.Extent} imageExtent Image extent.
*/
ol.renderer.webgl.ImageLayer.prototype.updateVertexCoordMatrix_ =
ol.renderer.webgl.ImageLayer.prototype.updateProjectionMatrix_ =
function(canvasWidth, canvasHeight, viewCenter,
viewResolution, viewRotation, imageExtent) {
var canvasExtentWidth = canvasWidth * viewResolution;
var canvasExtentHeight = canvasHeight * viewResolution;
var vertexCoordMatrix = this.vertexCoordMatrix_;
goog.vec.Mat4.makeIdentity(vertexCoordMatrix);
goog.vec.Mat4.scale(vertexCoordMatrix,
var projectionMatrix = this.projectionMatrix_;
goog.vec.Mat4.makeIdentity(projectionMatrix);
goog.vec.Mat4.scale(projectionMatrix,
2 / canvasExtentWidth, 2 / canvasExtentHeight, 1);
goog.vec.Mat4.rotateZ(vertexCoordMatrix, -viewRotation);
goog.vec.Mat4.translate(vertexCoordMatrix,
goog.vec.Mat4.rotateZ(projectionMatrix, -viewRotation);
goog.vec.Mat4.translate(projectionMatrix,
imageExtent.minX - viewCenter.x,
imageExtent.minY - viewCenter.y,
0);
goog.vec.Mat4.scale(vertexCoordMatrix,
goog.vec.Mat4.scale(projectionMatrix,
imageExtent.getWidth() / 2, imageExtent.getHeight() / 2, 1);
goog.vec.Mat4.translate(vertexCoordMatrix, 1, 1, 0);
goog.vec.Mat4.translate(projectionMatrix, 1, 1, 0);
};
src/ol/renderer/webgl/webgllayerrenderer.js
+1 -1
View File
@@ -100,7 +100,7 @@ ol.renderer.webgl.Layer.prototype.getTexture = goog.abstractMethod;
/**
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.renderer.webgl.Layer.prototype.getVertexCoordMatrix = goog.abstractMethod;
ol.renderer.webgl.Layer.prototype.getProjectionMatrix = goog.abstractMethod;
/**
src/ol/renderer/webgl/webglmaprenderer.js
+38 -38
View File
@@ -48,17 +48,17 @@ ol.renderer.webgl.map.shader.Fragment = function() {
goog.base(this, [
'precision mediump float;',
'',
'uniform mat4 uColorMatrix;',
'uniform float uOpacity;',
'uniform sampler2D uTexture;',
'uniform mat4 u_colorMatrix;',
'uniform float u_opacity;',
'uniform sampler2D u_texture;',
'',
'varying vec2 vTexCoord;',
'varying vec2 v_texCoord;',
'',
'void main(void) {',
'',
' vec4 texColor = texture2D(uTexture, vTexCoord);',
' vec4 color = uColorMatrix * vec4(texColor.rgb, 1.);',
' color.a = texColor.a * uOpacity;',
' vec4 texColor = texture2D(u_texture, v_texCoord);',
' vec4 color = u_colorMatrix * vec4(texColor.rgb, 1.);',
' color.a = texColor.a * u_opacity;',
'',
' gl_FragColor = color;',
'',
@@ -77,17 +77,17 @@ goog.addSingletonGetter(ol.renderer.webgl.map.shader.Fragment);
*/
ol.renderer.webgl.map.shader.Vertex = function() {
goog.base(this, [
'attribute vec2 aPosition;',
'attribute vec2 aTexCoord;',
'attribute vec2 a_position;',
'attribute vec2 a_texCoord;',
'',
'uniform mat4 uTexCoordMatrix;',
'uniform mat4 uVertexCoordMatrix;',
'uniform mat4 u_texCoordMatrix;',
'uniform mat4 u_projectionMatrix;',
'',
'varying vec2 vTexCoord;',
'varying vec2 v_texCoord;',
'',
'void main(void) {',
' gl_Position = uVertexCoordMatrix * vec4(aPosition, 0., 1.);',
' vTexCoord = (uTexCoordMatrix * vec4(aTexCoord, 0., 1.)).st;',
' gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.);',
' v_texCoord = (u_texCoordMatrix * vec4(a_texCoord, 0., 1.)).st;',
'}'
].join('\n'));
};
@@ -157,13 +157,13 @@ ol.renderer.webgl.Map = function(container, map) {
/**
* @private
* @type {{aPosition: number,
* aTexCoord: number,
* uColorMatrix: WebGLUniformLocation,
* uOpacity: WebGLUniformLocation,
* uTexture: WebGLUniformLocation,
* uTexCoordMatrix: WebGLUniformLocation,
* uVertexCoordMatrix: WebGLUniformLocation}|null}
* @type {{a_position: number,
* a_texCoord: number,
* u_colorMatrix: WebGLUniformLocation,
* u_opacity: WebGLUniformLocation,
* u_texture: WebGLUniformLocation,
* u_texCoordMatrix: WebGLUniformLocation,
* u_projectionMatrix: WebGLUniformLocation}|null}
*/
this.locations_ = null;
@@ -522,13 +522,13 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
gl.useProgram(program);
if (goog.isNull(this.locations_)) {
this.locations_ = {
aPosition: gl.getAttribLocation(program, 'aPosition'),
aTexCoord: gl.getAttribLocation(program, 'aTexCoord'),
uColorMatrix: gl.getUniformLocation(program, 'uColorMatrix'),
uTexCoordMatrix: gl.getUniformLocation(program, 'uTexCoordMatrix'),
uVertexCoordMatrix: gl.getUniformLocation(program, 'uVertexCoordMatrix'),
uOpacity: gl.getUniformLocation(program, 'uOpacity'),
uTexture: gl.getUniformLocation(program, 'uTexture')
a_position: gl.getAttribLocation(program, 'a_position'),
a_texCoord: gl.getAttribLocation(program, 'a_texCoord'),
u_colorMatrix: gl.getUniformLocation(program, 'u_colorMatrix'),
u_texCoordMatrix: gl.getUniformLocation(program, 'u_texCoordMatrix'),
u_projectionMatrix: gl.getUniformLocation(program, 'u_projectionMatrix'),
u_opacity: gl.getUniformLocation(program, 'u_opacity'),
u_texture: gl.getUniformLocation(program, 'u_texture')
};
}
@@ -546,13 +546,13 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
gl.bindBuffer(goog.webgl.ARRAY_BUFFER, this.arrayBuffer_);
}
gl.enableVertexAttribArray(this.locations_.aPosition);
gl.enableVertexAttribArray(this.locations_.a_position);
gl.vertexAttribPointer(
this.locations_.aPosition, 2, goog.webgl.FLOAT, false, 16, 0);
gl.enableVertexAttribArray(this.locations_.aTexCoord);
this.locations_.a_position, 2, goog.webgl.FLOAT, false, 16, 0);
gl.enableVertexAttribArray(this.locations_.a_texCoord);
gl.vertexAttribPointer(
this.locations_.aTexCoord, 2, goog.webgl.FLOAT, false, 16, 8);
gl.uniform1i(this.locations_.uTexture, 0);
this.locations_.a_texCoord, 2, goog.webgl.FLOAT, false, 16, 8);
gl.uniform1i(this.locations_.u_texture, 0);
goog.array.forEach(frameState.layersArray, function(layer) {
var layerState = frameState.layerStates[goog.getUid(layer)];
@@ -561,14 +561,14 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
}
var layerRenderer = this.getLayerRenderer(layer);
gl.uniformMatrix4fv(
this.locations_.uTexCoordMatrix, false,
this.locations_.u_texCoordMatrix, false,
layerRenderer.getTexCoordMatrix());
gl.uniformMatrix4fv(
this.locations_.uVertexCoordMatrix, false,
layerRenderer.getVertexCoordMatrix());
this.locations_.u_projectionMatrix, false,
layerRenderer.getProjectionMatrix());
gl.uniformMatrix4fv(
this.locations_.uColorMatrix, false, layerRenderer.getColorMatrix());
gl.uniform1f(this.locations_.uOpacity, layer.getOpacity());
this.locations_.u_colorMatrix, false, layerRenderer.getColorMatrix());
gl.uniform1f(this.locations_.u_opacity, layer.getOpacity());
gl.bindTexture(goog.webgl.TEXTURE_2D, layerRenderer.getTexture());
gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4);
}, this);
src/ol/renderer/webgl/webgltilelayerrenderer.js
+3 -3
View File
@@ -145,7 +145,7 @@ ol.renderer.webgl.TileLayer = function(mapRenderer, tileLayer) {
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.vertexCoordMatrix_ = goog.vec.Mat4.createNumberIdentity();
this.projectionMatrix_ = goog.vec.Mat4.createNumberIdentity();
/**
* @private
@@ -246,8 +246,8 @@ ol.renderer.webgl.TileLayer.prototype.getTexture = function() {
/**
* @inheritDoc
*/
ol.renderer.webgl.TileLayer.prototype.getVertexCoordMatrix = function() {
return this.vertexCoordMatrix_;
ol.renderer.webgl.TileLayer.prototype.getProjectionMatrix = function() {
return this.projectionMatrix_;
};