Rename WebGL variables to match CSS shaders specification
See https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.htm
This commit is contained in:
@@ -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_;
|
||||
};
|
||||
|
||||
|
||||
@@ -187,7 +187,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.
|
||||
@@ -213,24 +213,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);
|
||||
|
||||
};
|
||||
|
||||
@@ -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;
|
||||
|
||||
|
||||
/**
|
||||
|
||||
@@ -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);
|
||||
|
||||
@@ -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_;
|
||||
};
|
||||
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
goog.provide('ol.test.renderer.webgl.ImageLayer');
|
||||
|
||||
describe('ol.renderer.webgl.ImageLayer', function() {
|
||||
describe('updateVertexCoordMatrix_', function() {
|
||||
describe('updateProjectionMatrix_', function() {
|
||||
var map;
|
||||
var renderer;
|
||||
var canvasWidth;
|
||||
@@ -41,9 +41,9 @@ describe('ol.renderer.webgl.ImageLayer', function() {
|
||||
|
||||
it('produces a correct matrix', function() {
|
||||
|
||||
renderer.updateVertexCoordMatrix_(canvasWidth, canvasHeight,
|
||||
renderer.updateProjectionMatrix_(canvasWidth, canvasHeight,
|
||||
viewCenter, viewResolution, viewRotation, imageExtent);
|
||||
var matrix = renderer.getVertexCoordMatrix();
|
||||
var matrix = renderer.getProjectionMatrix();
|
||||
|
||||
var input;
|
||||
var output = goog.vec.Vec4.createNumber();
|
||||
|
||||
Reference in New Issue
Block a user