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

Merge pull request #4174 from tschaub/fewer-layer-props

Browse Source 
Remove hue, saturation, contrast, and brightness as layer properties.
This commit is contained in:
Tim Schaub
2015-09-29 01:16:11 -06:00
parent e8257e805d 55908485f2
commit ba5b950d5c
23 changed files with 50 additions and 1687 deletions
Download Patch File Download Diff File Expand all files Collapse all files

209
src/ol/color/colormatrix.js
View File

@@ -1,209 +0,0 @@
goog.provide('ol.color.Matrix');
goog.require('goog.vec.Mat4');
goog.require('ol');
/**
* @constructor
*/
ol.color.Matrix = function() {
/**
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.colorMatrix_ = goog.vec.Mat4.createNumber();
/**
* @private
* @type {number|undefined}
*/
this.brightness_ = undefined;
/**
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.brightnessMatrix_ = goog.vec.Mat4.createNumber();
/**
* @private
* @type {number|undefined}
*/
this.contrast_ = undefined;
/**
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.contrastMatrix_ = goog.vec.Mat4.createNumber();
/**
* @private
* @type {number|undefined}
*/
this.hue_ = undefined;
/**
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.hueMatrix_ = goog.vec.Mat4.createNumber();
/**
* @private
* @type {number|undefined}
*/
this.saturation_ = undefined;
/**
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.saturationMatrix_ = goog.vec.Mat4.createNumber();
};
/**
* @param {!goog.vec.Mat4.Number} matrix Matrix.
* @param {number} value Brightness value.
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.color.Matrix.makeBrightness = function(matrix, value) {
goog.vec.Mat4.makeTranslate(matrix, value, value, value);
return matrix;
};
/**
* @param {!goog.vec.Mat4.Number} matrix Matrix.
* @param {number} value Contrast value.
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.color.Matrix.makeContrast = function(matrix, value) {
goog.vec.Mat4.makeScale(matrix, value, value, value);
var translateValue = (-0.5 * value + 0.5);
goog.vec.Mat4.setColumnValues(matrix, 3,
translateValue, translateValue, translateValue, 1);
return matrix;
};
/**
* @param {!goog.vec.Mat4.Number} matrix Matrix.
* @param {number} value Hue value.
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.color.Matrix.makeHue = function(matrix, value) {
var cosHue = Math.cos(value);
var sinHue = Math.sin(value);
var v00 = 0.213 + cosHue * 0.787 - sinHue * 0.213;
var v01 = 0.715 - cosHue * 0.715 - sinHue * 0.715;
var v02 = 0.072 - cosHue * 0.072 + sinHue * 0.928;
var v03 = 0;
var v10 = 0.213 - cosHue * 0.213 + sinHue * 0.143;
var v11 = 0.715 + cosHue * 0.285 + sinHue * 0.140;
var v12 = 0.072 - cosHue * 0.072 - sinHue * 0.283;
var v13 = 0;
var v20 = 0.213 - cosHue * 0.213 - sinHue * 0.787;
var v21 = 0.715 - cosHue * 0.715 + sinHue * 0.715;
var v22 = 0.072 + cosHue * 0.928 + sinHue * 0.072;
var v23 = 0;
var v30 = 0;
var v31 = 0;
var v32 = 0;
var v33 = 1;
goog.vec.Mat4.setFromValues(matrix,
v00, v10, v20, v30,
v01, v11, v21, v31,
v02, v12, v22, v32,
v03, v13, v23, v33);
return matrix;
};
/**
* @param {!goog.vec.Mat4.Number} matrix Matrix.
* @param {number} value Saturation value.
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.color.Matrix.makeSaturation = function(matrix, value) {
var v00 = 0.213 + 0.787 * value;
var v01 = 0.715 - 0.715 * value;
var v02 = 0.072 - 0.072 * value;
var v03 = 0;
var v10 = 0.213 - 0.213 * value;
var v11 = 0.715 + 0.285 * value;
var v12 = 0.072 - 0.072 * value;
var v13 = 0;
var v20 = 0.213 - 0.213 * value;
var v21 = 0.715 - 0.715 * value;
var v22 = 0.072 + 0.928 * value;
var v23 = 0;
var v30 = 0;
var v31 = 0;
var v32 = 0;
var v33 = 1;
goog.vec.Mat4.setFromValues(matrix,
v00, v10, v20, v30,
v01, v11, v21, v31,
v02, v12, v22, v32,
v03, v13, v23, v33);
return matrix;
};
/**
* @param {number|undefined} brightness Brightness.
* @param {number|undefined} contrast Contrast.
* @param {number|undefined} hue Hue.
* @param {number|undefined} saturation Saturation.
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.color.Matrix.prototype.getMatrix = function(
brightness, contrast, hue, saturation) {
var colorMatrixDirty = false;
if (brightness !== undefined && brightness !== this.brightness_) {
ol.color.Matrix.makeBrightness(this.brightnessMatrix_,
/** @type {number} */ (brightness));
this.brightness_ = brightness;
colorMatrixDirty = true;
}
if (contrast !== undefined && contrast !== this.contrast_) {
ol.color.Matrix.makeContrast(this.contrastMatrix_,
/** @type {number} */ (contrast));
this.contrast_ = contrast;
colorMatrixDirty = true;
}
if (hue !== undefined && hue !== this.hue_) {
ol.color.Matrix.makeHue(this.hueMatrix_, /** @type {number} */ (hue));
this.hue_ = hue;
colorMatrixDirty = true;
}
if (saturation !== undefined && saturation !== this.saturation_) {
ol.color.Matrix.makeSaturation(this.saturationMatrix_,
/** @type {number} */ (saturation));
this.saturation_ = saturation;
colorMatrixDirty = true;
}
if (colorMatrixDirty) {
var colorMatrix = this.colorMatrix_;
goog.vec.Mat4.makeIdentity(colorMatrix);
if (contrast !== undefined) {
goog.vec.Mat4.multMat(colorMatrix, this.contrastMatrix_, colorMatrix);
}
if (brightness !== undefined) {
goog.vec.Mat4.multMat(colorMatrix, this.brightnessMatrix_, colorMatrix);
}
if (saturation !== undefined) {
goog.vec.Mat4.multMat(colorMatrix, this.saturationMatrix_, colorMatrix);
}
if (hue !== undefined) {
goog.vec.Mat4.multMat(colorMatrix, this.hueMatrix_, colorMatrix);
}
}
return this.colorMatrix_;
};

136
src/ol/layer/layerbase.js
View File

@@ -13,11 +13,7 @@ goog.require('ol.source.State');
* @enum {string}
*/
ol.layer.LayerProperty = {
BRIGHTNESS: 'brightness',
CONTRAST: 'contrast',
HUE: 'hue',
OPACITY: 'opacity',
SATURATION: 'saturation',
VISIBLE: 'visible',
EXTENT: 'extent',
Z_INDEX: 'zIndex',
@@ -29,11 +25,7 @@ ol.layer.LayerProperty = {
/**
* @typedef {{layer: ol.layer.Layer,
* brightness: number,
* contrast: number,
* hue: number,
* opacity: number,
* saturation: number,
* sourceState: ol.source.State,
* visible: boolean,
* managed: boolean,
@@ -67,16 +59,8 @@ ol.layer.Base = function(options) {
* @type {Object.<string, *>}
*/
var properties = goog.object.clone(options);
properties[ol.layer.LayerProperty.BRIGHTNESS] =
options.brightness !== undefined ? options.brightness : 0;
properties[ol.layer.LayerProperty.CONTRAST] =
options.contrast !== undefined ? options.contrast : 1;
properties[ol.layer.LayerProperty.HUE] =
options.hue !== undefined ? options.hue : 0;
properties[ol.layer.LayerProperty.OPACITY] =
options.opacity !== undefined ? options.opacity : 1;
properties[ol.layer.LayerProperty.SATURATION] =
options.saturation !== undefined ? options.saturation : 1;
properties[ol.layer.LayerProperty.VISIBLE] =
options.visible !== undefined ? options.visible : true;
properties[ol.layer.LayerProperty.Z_INDEX] =
@@ -91,48 +75,11 @@ ol.layer.Base = function(options) {
goog.inherits(ol.layer.Base, ol.Object);
/**
* Return the brightness of the layer.
* @return {number} The brightness of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.getBrightness = function() {
return /** @type {number} */ (this.get(ol.layer.LayerProperty.BRIGHTNESS));
};
/**
* Return the contrast of the layer.
* @return {number} The contrast of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.getContrast = function() {
return /** @type {number} */ (this.get(ol.layer.LayerProperty.CONTRAST));
};
/**
* Return the hue of the layer.
* @return {number} The hue of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.getHue = function() {
return /** @type {number} */ (this.get(ol.layer.LayerProperty.HUE));
};
/**
* @return {ol.layer.LayerState} Layer state.
*/
ol.layer.Base.prototype.getLayerState = function() {
var brightness = this.getBrightness();
var contrast = this.getContrast();
var hue = this.getHue();
var opacity = this.getOpacity();
var saturation = this.getSaturation();
var sourceState = this.getSourceState();
var visible = this.getVisible();
var extent = this.getExtent();
@@ -141,11 +88,7 @@ ol.layer.Base.prototype.getLayerState = function() {
var minResolution = this.getMinResolution();
return {
layer: /** @type {ol.layer.Layer} */ (this),
brightness: ol.math.clamp(brightness, -1, 1),
contrast: Math.max(contrast, 0),
hue: hue,
opacity: ol.math.clamp(opacity, 0, 1),
saturation: Math.max(saturation, 0),
sourceState: sourceState,
visible: visible,
managed: true,
@@ -221,17 +164,6 @@ ol.layer.Base.prototype.getOpacity = function() {
};
/**
* Return the saturation of the layer.
* @return {number} The saturation of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.getSaturation = function() {
return /** @type {number} */ (this.get(ol.layer.LayerProperty.SATURATION));
};
/**
* @return {ol.source.State} Source state.
*/
@@ -261,59 +193,6 @@ ol.layer.Base.prototype.getZIndex = function() {
};
/**
* Adjust the layer brightness. A value of -1 will render the layer completely
* black. A value of 0 will leave the brightness unchanged. A value of 1 will
* render the layer completely white. Other values are linear multipliers on
* the effect (values are clamped between -1 and 1).
*
* The filter effects draft [1] says the brightness function is supposed to
* render 0 black, 1 unchanged, and all other values as a linear multiplier.
*
* The current WebKit implementation clamps values between -1 (black) and 1
* (white) [2]. There is a bug open to change the filter effect spec [3].
*
* TODO: revisit this if the spec is still unmodified before we release
*
* [1] https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html
* [2] https://github.com/WebKit/webkit/commit/8f4765e569
* [3] https://www.w3.org/Bugs/Public/show_bug.cgi?id=15647
*
* @param {number} brightness The brightness of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.setBrightness = function(brightness) {
this.set(ol.layer.LayerProperty.BRIGHTNESS, brightness);
};
/**
* Adjust the layer contrast. A value of 0 will render the layer completely
* grey. A value of 1 will leave the contrast unchanged. Other values are
* linear multipliers on the effect (and values over 1 are permitted).
*
* @param {number} contrast The contrast of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.setContrast = function(contrast) {
this.set(ol.layer.LayerProperty.CONTRAST, contrast);
};
/**
* Apply a hue-rotation to the layer. A value of 0 will leave the hue
* unchanged. Other values are radians around the color circle.
* @param {number} hue The hue of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.setHue = function(hue) {
this.set(ol.layer.LayerProperty.HUE, hue);
};
/**
* Set the extent at which the layer is visible. If `undefined`, the layer
* will be visible at all extents.
@@ -359,21 +238,6 @@ ol.layer.Base.prototype.setOpacity = function(opacity) {
};
/**
* Adjust layer saturation. A value of 0 will render the layer completely
* unsaturated. A value of 1 will leave the saturation unchanged. Other
* values are linear multipliers of the effect (and values over 1 are
* permitted).
*
* @param {number} saturation The saturation of the layer.
* @observable
* @api
*/
ol.layer.Base.prototype.setSaturation = function(saturation) {
this.set(ol.layer.LayerProperty.SATURATION, saturation);
};
/**
* Set the visibility of the layer (`true` or `false`).
* @param {boolean} visible The visibility of the layer.

6
src/ol/layer/layergroup.js
View File

@@ -12,7 +12,6 @@ goog.require('ol.Object');
goog.require('ol.ObjectEventType');
goog.require('ol.extent');
goog.require('ol.layer.Base');
goog.require('ol.math');
goog.require('ol.source.State');
@@ -215,12 +214,7 @@ ol.layer.Group.prototype.getLayerStatesArray = function(opt_states) {
var i, ii, layerState;
for (i = pos, ii = states.length; i < ii; i++) {
layerState = states[i];
layerState.brightness = ol.math.clamp(
layerState.brightness + ownLayerState.brightness, -1, 1);
layerState.contrast *= ownLayerState.contrast;
layerState.hue += ownLayerState.hue;
layerState.opacity *= ownLayerState.opacity;
layerState.saturation *= ownLayerState.saturation;
layerState.visible = layerState.visible && ownLayerState.visible;
layerState.maxResolution = Math.min(
layerState.maxResolution, ownLayerState.maxResolution);

46
src/ol/render/webgl/webglimagecolor.glsl
View File

@@ -1,46 +0,0 @@
//! NAMESPACE=ol.render.webgl.imagereplay.shader.Color
//! CLASS=ol.render.webgl.imagereplay.shader.Color
//! COMMON
varying vec2 v_texCoord;
varying float v_opacity;
//! VERTEX
attribute vec2 a_position;
attribute vec2 a_texCoord;
attribute vec2 a_offsets;
attribute float a_opacity;
attribute float a_rotateWithView;
uniform mat4 u_projectionMatrix;
uniform mat4 u_offsetScaleMatrix;
uniform mat4 u_offsetRotateMatrix;
void main(void) {
mat4 offsetMatrix = u_offsetScaleMatrix;
if (a_rotateWithView == 1.0) {
offsetMatrix = u_offsetScaleMatrix * u_offsetRotateMatrix;
}
vec4 offsets = offsetMatrix * vec4(a_offsets, 0., 0.);
gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.) + offsets;
v_texCoord = a_texCoord;
v_opacity = a_opacity;
}
//! FRAGMENT
// @see https://svn.webkit.org/repository/webkit/trunk/Source/WebCore/platform/graphics/filters/skia/SkiaImageFilterBuilder.cpp
uniform mat4 u_colorMatrix;
uniform float u_opacity;
uniform sampler2D u_image;
void main(void) {
vec4 texColor = texture2D(u_image, v_texCoord);
float alpha = texColor.a * v_opacity * u_opacity;
if (alpha == 0.0) {
discard;
}
gl_FragColor.a = alpha;
gl_FragColor.rgb = (u_colorMatrix * vec4(texColor.rgb, 1.)).rgb;
}

156
src/ol/render/webgl/webglimagecolorshader.js
View File

@@ -1,156 +0,0 @@
// This file is automatically generated, do not edit
goog.provide('ol.render.webgl.imagereplay.shader.Color');
goog.provide('ol.render.webgl.imagereplay.shader.Color.Locations');
goog.provide('ol.render.webgl.imagereplay.shader.ColorFragment');
goog.provide('ol.render.webgl.imagereplay.shader.ColorVertex');
goog.require('ol.webgl.shader');
/**
* @constructor
* @extends {ol.webgl.shader.Fragment}
* @struct
*/
ol.render.webgl.imagereplay.shader.ColorFragment = function() {
goog.base(this, ol.render.webgl.imagereplay.shader.ColorFragment.SOURCE);
};
goog.inherits(ol.render.webgl.imagereplay.shader.ColorFragment, ol.webgl.shader.Fragment);
goog.addSingletonGetter(ol.render.webgl.imagereplay.shader.ColorFragment);
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorFragment.DEBUG_SOURCE = 'precision mediump float;\nvarying vec2 v_texCoord;\nvarying float v_opacity;\n\n// @see https://svn.webkit.org/repository/webkit/trunk/Source/WebCore/platform/graphics/filters/skia/SkiaImageFilterBuilder.cpp\nuniform mat4 u_colorMatrix;\nuniform float u_opacity;\nuniform sampler2D u_image;\n\nvoid main(void) {\n vec4 texColor = texture2D(u_image, v_texCoord);\n float alpha = texColor.a * v_opacity * u_opacity;\n if (alpha == 0.0) {\n discard;\n }\n gl_FragColor.a = alpha;\n gl_FragColor.rgb = (u_colorMatrix * vec4(texColor.rgb, 1.)).rgb;\n}\n';
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorFragment.OPTIMIZED_SOURCE = 'precision mediump float;varying vec2 a;varying float b;uniform mat4 k;uniform float l;uniform sampler2D m;void main(void){vec4 texColor=texture2D(m,a);float alpha=texColor.a*b*l;if(alpha==0.0){discard;}gl_FragColor.a=alpha;gl_FragColor.rgb=(k*vec4(texColor.rgb,1.)).rgb;}';
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorFragment.SOURCE = goog.DEBUG ?
ol.render.webgl.imagereplay.shader.ColorFragment.DEBUG_SOURCE :
ol.render.webgl.imagereplay.shader.ColorFragment.OPTIMIZED_SOURCE;
/**
* @constructor
* @extends {ol.webgl.shader.Vertex}
* @struct
*/
ol.render.webgl.imagereplay.shader.ColorVertex = function() {
goog.base(this, ol.render.webgl.imagereplay.shader.ColorVertex.SOURCE);
};
goog.inherits(ol.render.webgl.imagereplay.shader.ColorVertex, ol.webgl.shader.Vertex);
goog.addSingletonGetter(ol.render.webgl.imagereplay.shader.ColorVertex);
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorVertex.DEBUG_SOURCE = 'varying vec2 v_texCoord;\nvarying float v_opacity;\n\nattribute vec2 a_position;\nattribute vec2 a_texCoord;\nattribute vec2 a_offsets;\nattribute float a_opacity;\nattribute float a_rotateWithView;\n\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_offsetScaleMatrix;\nuniform mat4 u_offsetRotateMatrix;\n\nvoid main(void) {\n mat4 offsetMatrix = u_offsetScaleMatrix;\n if (a_rotateWithView == 1.0) {\n offsetMatrix = u_offsetScaleMatrix * u_offsetRotateMatrix;\n }\n vec4 offsets = offsetMatrix * vec4(a_offsets, 0., 0.);\n gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.) + offsets;\n v_texCoord = a_texCoord;\n v_opacity = a_opacity;\n}\n\n\n';
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorVertex.OPTIMIZED_SOURCE = 'varying vec2 a;varying float b;attribute vec2 c;attribute vec2 d;attribute vec2 e;attribute float f;attribute float g;uniform mat4 h;uniform mat4 i;uniform mat4 j;void main(void){mat4 offsetMatrix=i;if(g==1.0){offsetMatrix=i*j;}vec4 offsets=offsetMatrix*vec4(e,0.,0.);gl_Position=h*vec4(c,0.,1.)+offsets;a=d;b=f;}';
/**
* @const
* @type {string}
*/
ol.render.webgl.imagereplay.shader.ColorVertex.SOURCE = goog.DEBUG ?
ol.render.webgl.imagereplay.shader.ColorVertex.DEBUG_SOURCE :
ol.render.webgl.imagereplay.shader.ColorVertex.OPTIMIZED_SOURCE;
/**
* @constructor
* @param {WebGLRenderingContext} gl GL.
* @param {WebGLProgram} program Program.
* @struct
*/
ol.render.webgl.imagereplay.shader.Color.Locations = function(gl, program) {
/**
* @type {WebGLUniformLocation}
*/
this.u_colorMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_colorMatrix' : 'k');
/**
* @type {WebGLUniformLocation}
*/
this.u_image = gl.getUniformLocation(
program, goog.DEBUG ? 'u_image' : 'm');
/**
* @type {WebGLUniformLocation}
*/
this.u_offsetRotateMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_offsetRotateMatrix' : 'j');
/**
* @type {WebGLUniformLocation}
*/
this.u_offsetScaleMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_offsetScaleMatrix' : 'i');
/**
* @type {WebGLUniformLocation}
*/
this.u_opacity = gl.getUniformLocation(
program, goog.DEBUG ? 'u_opacity' : 'l');
/**
* @type {WebGLUniformLocation}
*/
this.u_projectionMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_projectionMatrix' : 'h');
/**
* @type {number}
*/
this.a_offsets = gl.getAttribLocation(
program, goog.DEBUG ? 'a_offsets' : 'e');
/**
* @type {number}
*/
this.a_opacity = gl.getAttribLocation(
program, goog.DEBUG ? 'a_opacity' : 'f');
/**
* @type {number}
*/
this.a_position = gl.getAttribLocation(
program, goog.DEBUG ? 'a_position' : 'c');
/**
* @type {number}
*/
this.a_rotateWithView = gl.getAttribLocation(
program, goog.DEBUG ? 'a_rotateWithView' : 'g');
/**
* @type {number}
*/
this.a_texCoord = gl.getAttribLocation(
program, goog.DEBUG ? 'a_texCoord' : 'd');
};

17
src/ol/render/webgl/webglimmediate.js
View File

@@ -186,16 +186,12 @@ ol.render.webgl.Immediate.prototype.drawPointGeometry =
replay.finish(context);
// default colors
var opacity = 1;
var brightness = 0;
var contrast = 1;
var hue = 0;
var saturation = 1;
var skippedFeatures = {};
var featureCallback;
var oneByOne = false;
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
this.size_, this.pixelRatio_, opacity, brightness,
contrast, hue, saturation, skippedFeatures, featureCallback, oneByOne);
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
oneByOne);
replay.getDeleteResourcesFunction(context)();
};
@@ -231,18 +227,13 @@ ol.render.webgl.Immediate.prototype.drawMultiPointGeometry =
replay.setImageStyle(this.imageStyle_);
replay.drawMultiPointGeometry(multiPointGeometry, data);
replay.finish(context);
// default colors
var opacity = 1;
var brightness = 0;
var contrast = 1;
var hue = 0;
var saturation = 1;
var skippedFeatures = {};
var featureCallback;
var oneByOne = false;
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
this.size_, this.pixelRatio_, opacity, brightness,
contrast, hue, saturation, skippedFeatures, featureCallback, oneByOne);
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
oneByOne);
replay.getDeleteResourcesFunction(context)();
};

103
src/ol/render/webgl/webglreplay.js
View File

@@ -5,14 +5,9 @@ goog.require('goog.asserts');
goog.require('goog.functions');
goog.require('goog.object');
goog.require('goog.vec.Mat4');
goog.require('ol.color.Matrix');
goog.require('ol.extent');
goog.require('ol.render.IReplayGroup');
goog.require('ol.render.VectorContext');
goog.require('ol.render.webgl.imagereplay.shader.Color');
goog.require('ol.render.webgl.imagereplay.shader.Color.Locations');
goog.require('ol.render.webgl.imagereplay.shader.ColorFragment');
goog.require('ol.render.webgl.imagereplay.shader.ColorVertex');
goog.require('ol.render.webgl.imagereplay.shader.Default');
goog.require('ol.render.webgl.imagereplay.shader.Default.Locations');
goog.require('ol.render.webgl.imagereplay.shader.DefaultFragment');
@@ -46,12 +41,6 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.anchorY_ = undefined;
/**
* @private
* @type {ol.color.Matrix}
*/
this.colorMatrix_ = new ol.color.Matrix();
/**
* The origin of the coordinate system for the point coordinates sent to
* the GPU. To eliminate jitter caused by precision problems in the GPU
@@ -116,12 +105,6 @@ ol.render.webgl.ImageReplay = function(tolerance, maxExtent) {
*/
this.indicesBuffer_ = null;
/**
* @private
* @type {ol.render.webgl.imagereplay.shader.Color.Locations}
*/
this.colorLocations_ = null;
/**
* @private
* @type {ol.render.webgl.imagereplay.shader.Default.Locations}
@@ -515,10 +498,6 @@ ol.render.webgl.ImageReplay.prototype.createTextures_ =
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object.<string, boolean>} skippedFeaturesHash Ids of features
* to skip.
* @param {function(ol.Feature): T|undefined} featureCallback Feature callback.
@@ -530,7 +509,7 @@ ol.render.webgl.ImageReplay.prototype.createTextures_ =
*/
ol.render.webgl.ImageReplay.prototype.replay = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
opacity, skippedFeaturesHash,
featureCallback, oneByOne, opt_hitExtent) {
var gl = context.getGL();
@@ -544,41 +523,21 @@ ol.render.webgl.ImageReplay.prototype.replay = function(context,
'indecesBuffer must not be null');
context.bindBuffer(goog.webgl.ELEMENT_ARRAY_BUFFER, this.indicesBuffer_);
var useColor = brightness || contrast != 1 || hue || saturation != 1;
// get the program
var fragmentShader, vertexShader;
if (useColor) {
fragmentShader =
ol.render.webgl.imagereplay.shader.ColorFragment.getInstance();
vertexShader =
ol.render.webgl.imagereplay.shader.ColorVertex.getInstance();
} else {
fragmentShader =
ol.render.webgl.imagereplay.shader.DefaultFragment.getInstance();
vertexShader =
ol.render.webgl.imagereplay.shader.DefaultVertex.getInstance();
}
var fragmentShader =
ol.render.webgl.imagereplay.shader.DefaultFragment.getInstance();
var vertexShader =
ol.render.webgl.imagereplay.shader.DefaultVertex.getInstance();
var program = context.getProgram(fragmentShader, vertexShader);
// get the locations
var locations;
if (useColor) {
if (goog.isNull(this.colorLocations_)) {
locations =
new ol.render.webgl.imagereplay.shader.Color.Locations(gl, program);
this.colorLocations_ = locations;
} else {
locations = this.colorLocations_;
}
if (goog.isNull(this.defaultLocations_)) {
locations =
new ol.render.webgl.imagereplay.shader.Default.Locations(gl, program);
this.defaultLocations_ = locations;
} else {
if (goog.isNull(this.defaultLocations_)) {
locations =
new ol.render.webgl.imagereplay.shader.Default.Locations(gl, program);
this.defaultLocations_ = locations;
} else {
locations = this.defaultLocations_;
}
locations = this.defaultLocations_;
}
// use the program (FIXME: use the return value)
@@ -628,10 +587,6 @@ ol.render.webgl.ImageReplay.prototype.replay = function(context,
gl.uniformMatrix4fv(locations.u_offsetRotateMatrix, false,
offsetRotateMatrix);
gl.uniform1f(locations.u_opacity, opacity);
if (useColor) {
gl.uniformMatrix4fv(locations.u_colorMatrix, false,
this.colorMatrix_.getMatrix(brightness, contrast, hue, saturation));
}
// draw!
var result;
@@ -1067,23 +1022,19 @@ ol.render.webgl.ReplayGroup.prototype.isEmpty = function() {
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object.<string, boolean>} skippedFeaturesHash Ids of features
* to skip.
*/
ol.render.webgl.ReplayGroup.prototype.replay = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash) {
opacity, skippedFeaturesHash) {
var i, ii, replay, result;
for (i = 0, ii = ol.render.REPLAY_ORDER.length; i < ii; ++i) {
replay = this.replays_[ol.render.REPLAY_ORDER[i]];
if (replay !== undefined) {
replay.replay(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
opacity, skippedFeaturesHash,
undefined, false);
}
}
@@ -1099,10 +1050,6 @@ ol.render.webgl.ReplayGroup.prototype.replay = function(context,
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object.<string, boolean>} skippedFeaturesHash Ids of features
* to skip.
* @param {function(ol.Feature): T|undefined} featureCallback Feature callback.
@@ -1113,16 +1060,14 @@ ol.render.webgl.ReplayGroup.prototype.replay = function(context,
* @template T
*/
ol.render.webgl.ReplayGroup.prototype.replayHitDetection_ = function(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
featureCallback, oneByOne, opt_hitExtent) {
center, resolution, rotation, size, pixelRatio, opacity,
skippedFeaturesHash, featureCallback, oneByOne, opt_hitExtent) {
var i, replay, result;
for (i = ol.render.REPLAY_ORDER.length - 1; i >= 0; --i) {
replay = this.replays_[ol.render.REPLAY_ORDER[i]];
if (replay !== undefined) {
result = replay.replay(context,
center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation,
center, resolution, rotation, size, pixelRatio, opacity,
skippedFeaturesHash, featureCallback, oneByOne, opt_hitExtent);
if (result) {
return result;
@@ -1142,10 +1087,6 @@ ol.render.webgl.ReplayGroup.prototype.replayHitDetection_ = function(context,
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object.<string, boolean>} skippedFeaturesHash Ids of features
* to skip.
* @param {function(ol.Feature): T|undefined} callback Feature callback.
@@ -1154,7 +1095,7 @@ ol.render.webgl.ReplayGroup.prototype.replayHitDetection_ = function(context,
*/
ol.render.webgl.ReplayGroup.prototype.forEachFeatureAtCoordinate = function(
coordinate, context, center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash,
opacity, skippedFeaturesHash,
callback) {
var gl = context.getGL();
gl.bindFramebuffer(
@@ -1175,8 +1116,7 @@ ol.render.webgl.ReplayGroup.prototype.forEachFeatureAtCoordinate = function(
return this.replayHitDetection_(context,
coordinate, resolution, rotation, ol.render.webgl.HIT_DETECTION_SIZE_,
pixelRatio, opacity, brightness, contrast, hue, saturation,
skippedFeaturesHash,
pixelRatio, opacity, skippedFeaturesHash,
/**
* @param {ol.Feature} feature Feature.
* @return {?} Callback result.
@@ -1204,25 +1144,20 @@ ol.render.webgl.ReplayGroup.prototype.forEachFeatureAtCoordinate = function(
* @param {ol.Size} size Size.
* @param {number} pixelRatio Pixel ratio.
* @param {number} opacity Global opacity.
* @param {number} brightness Global brightness.
* @param {number} contrast Global contrast.
* @param {number} hue Global hue.
* @param {number} saturation Global saturation.
* @param {Object.<string, boolean>} skippedFeaturesHash Ids of features
* to skip.
* @return {boolean} Is there a feature at the given coordinate?
*/
ol.render.webgl.ReplayGroup.prototype.hasFeatureAtCoordinate = function(
coordinate, context, center, resolution, rotation, size, pixelRatio,
opacity, brightness, contrast, hue, saturation, skippedFeaturesHash) {
opacity, skippedFeaturesHash) {
var gl = context.getGL();
gl.bindFramebuffer(
gl.FRAMEBUFFER, context.getHitDetectionFramebuffer());
var hasFeature = this.replayHitDetection_(context,
coordinate, resolution, rotation, ol.render.webgl.HIT_DETECTION_SIZE_,
pixelRatio, opacity, brightness, contrast, hue, saturation,
skippedFeaturesHash,
pixelRatio, opacity, skippedFeaturesHash,
/**
* @param {ol.Feature} feature Feature.
* @return {boolean} Is there a feature?

65
src/ol/renderer/webgl/webgllayerrenderer.js
View File

@@ -2,16 +2,11 @@ goog.provide('ol.renderer.webgl.Layer');
goog.require('goog.vec.Mat4');
goog.require('goog.webgl');
goog.require('ol.color.Matrix');
goog.require('ol.layer.Layer');
goog.require('ol.render.Event');
goog.require('ol.render.EventType');
goog.require('ol.render.webgl.Immediate');
goog.require('ol.renderer.Layer');
goog.require('ol.renderer.webgl.map.shader.Color');
goog.require('ol.renderer.webgl.map.shader.Color.Locations');
goog.require('ol.renderer.webgl.map.shader.ColorFragment');
goog.require('ol.renderer.webgl.map.shader.ColorVertex');
goog.require('ol.renderer.webgl.map.shader.Default');
goog.require('ol.renderer.webgl.map.shader.Default.Locations');
goog.require('ol.renderer.webgl.map.shader.DefaultFragment');
@@ -78,18 +73,6 @@ ol.renderer.webgl.Layer = function(mapRenderer, layer) {
*/
this.projectionMatrix = goog.vec.Mat4.createNumberIdentity();
/**
* @private
* @type {ol.color.Matrix}
*/
this.colorMatrix_ = new ol.color.Matrix();
/**
* @private
* @type {ol.renderer.webgl.map.shader.Color.Locations}
*/
this.colorLocations_ = null;
/**
* @private
* @type {ol.renderer.webgl.map.shader.Default.Locations}
@@ -161,42 +144,19 @@ ol.renderer.webgl.Layer.prototype.composeFrame =
var gl = context.getGL();
var useColor =
layerState.brightness ||
layerState.contrast != 1 ||
layerState.hue ||
layerState.saturation != 1;
var fragmentShader, vertexShader;
if (useColor) {
fragmentShader = ol.renderer.webgl.map.shader.ColorFragment.getInstance();
vertexShader = ol.renderer.webgl.map.shader.ColorVertex.getInstance();
} else {
fragmentShader =
ol.renderer.webgl.map.shader.DefaultFragment.getInstance();
vertexShader = ol.renderer.webgl.map.shader.DefaultVertex.getInstance();
}
var fragmentShader =
ol.renderer.webgl.map.shader.DefaultFragment.getInstance();
var vertexShader = ol.renderer.webgl.map.shader.DefaultVertex.getInstance();
var program = context.getProgram(fragmentShader, vertexShader);
// FIXME colorLocations_ and defaultLocations_ should be shared somehow
var locations;
if (useColor) {
if (goog.isNull(this.colorLocations_)) {
locations =
new ol.renderer.webgl.map.shader.Color.Locations(gl, program);
this.colorLocations_ = locations;
} else {
locations = this.colorLocations_;
}
if (goog.isNull(this.defaultLocations_)) {
locations =
new ol.renderer.webgl.map.shader.Default.Locations(gl, program);
this.defaultLocations_ = locations;
} else {
if (goog.isNull(this.defaultLocations_)) {
locations =
new ol.renderer.webgl.map.shader.Default.Locations(gl, program);
this.defaultLocations_ = locations;
} else {
locations = this.defaultLocations_;
}
locations = this.defaultLocations_;
}
if (context.useProgram(program)) {
@@ -213,15 +173,6 @@ ol.renderer.webgl.Layer.prototype.composeFrame =
locations.u_texCoordMatrix, false, this.getTexCoordMatrix());
gl.uniformMatrix4fv(locations.u_projectionMatrix, false,
this.getProjectionMatrix());
if (useColor) {
gl.uniformMatrix4fv(locations.u_colorMatrix, false,
this.colorMatrix_.getMatrix(
layerState.brightness,
layerState.contrast,
layerState.hue,
layerState.saturation
));
}
gl.uniform1f(locations.u_opacity, layerState.opacity);
gl.bindTexture(goog.webgl.TEXTURE_2D, this.getTexture());
gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4);

32
src/ol/renderer/webgl/webglmapcolor.glsl
View File

@@ -1,32 +0,0 @@
//! NAMESPACE=ol.renderer.webgl.map.shader.Color
//! CLASS=ol.renderer.webgl.map.shader.Color
//! COMMON
varying vec2 v_texCoord;
//! VERTEX
attribute vec2 a_position;
attribute vec2 a_texCoord;
uniform mat4 u_texCoordMatrix;
uniform mat4 u_projectionMatrix;
void main(void) {
gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.);
v_texCoord = (u_texCoordMatrix * vec4(a_texCoord, 0., 1.)).st;
}
//! FRAGMENT
// @see https://svn.webkit.org/repository/webkit/trunk/Source/WebCore/platform/graphics/filters/skia/SkiaImageFilterBuilder.cpp
uniform mat4 u_colorMatrix;
uniform float u_opacity;
uniform sampler2D u_texture;
void main(void) {
vec4 texColor = texture2D(u_texture, v_texCoord);
gl_FragColor.rgb = (u_colorMatrix * vec4(texColor.rgb, 1.)).rgb;
gl_FragColor.a = texColor.a * u_opacity;
}

132
src/ol/renderer/webgl/webglmapcolorshader.js
View File

@@ -1,132 +0,0 @@
// This file is automatically generated, do not edit
goog.provide('ol.renderer.webgl.map.shader.Color');
goog.provide('ol.renderer.webgl.map.shader.Color.Locations');
goog.provide('ol.renderer.webgl.map.shader.ColorFragment');
goog.provide('ol.renderer.webgl.map.shader.ColorVertex');
goog.require('ol.webgl.shader');
/**
* @constructor
* @extends {ol.webgl.shader.Fragment}
* @struct
*/
ol.renderer.webgl.map.shader.ColorFragment = function() {
goog.base(this, ol.renderer.webgl.map.shader.ColorFragment.SOURCE);
};
goog.inherits(ol.renderer.webgl.map.shader.ColorFragment, ol.webgl.shader.Fragment);
goog.addSingletonGetter(ol.renderer.webgl.map.shader.ColorFragment);
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorFragment.DEBUG_SOURCE = 'precision mediump float;\nvarying vec2 v_texCoord;\n\n\n// @see https://svn.webkit.org/repository/webkit/trunk/Source/WebCore/platform/graphics/filters/skia/SkiaImageFilterBuilder.cpp\nuniform mat4 u_colorMatrix;\nuniform float u_opacity;\nuniform sampler2D u_texture;\n\nvoid main(void) {\n vec4 texColor = texture2D(u_texture, v_texCoord);\n gl_FragColor.rgb = (u_colorMatrix * vec4(texColor.rgb, 1.)).rgb;\n gl_FragColor.a = texColor.a * u_opacity;\n}\n';
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorFragment.OPTIMIZED_SOURCE = 'precision mediump float;varying vec2 a;uniform mat4 f;uniform float g;uniform sampler2D h;void main(void){vec4 texColor=texture2D(h,a);gl_FragColor.rgb=(f*vec4(texColor.rgb,1.)).rgb;gl_FragColor.a=texColor.a*g;}';
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorFragment.SOURCE = goog.DEBUG ?
ol.renderer.webgl.map.shader.ColorFragment.DEBUG_SOURCE :
ol.renderer.webgl.map.shader.ColorFragment.OPTIMIZED_SOURCE;
/**
* @constructor
* @extends {ol.webgl.shader.Vertex}
* @struct
*/
ol.renderer.webgl.map.shader.ColorVertex = function() {
goog.base(this, ol.renderer.webgl.map.shader.ColorVertex.SOURCE);
};
goog.inherits(ol.renderer.webgl.map.shader.ColorVertex, ol.webgl.shader.Vertex);
goog.addSingletonGetter(ol.renderer.webgl.map.shader.ColorVertex);
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorVertex.DEBUG_SOURCE = 'varying vec2 v_texCoord;\n\n\nattribute vec2 a_position;\nattribute vec2 a_texCoord;\n\nuniform mat4 u_texCoordMatrix;\nuniform mat4 u_projectionMatrix;\n\nvoid main(void) {\n gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.);\n v_texCoord = (u_texCoordMatrix * vec4(a_texCoord, 0., 1.)).st;\n}\n\n\n';
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorVertex.OPTIMIZED_SOURCE = 'varying vec2 a;attribute vec2 b;attribute vec2 c;uniform mat4 d;uniform mat4 e;void main(void){gl_Position=e*vec4(b,0.,1.);a=(d*vec4(c,0.,1.)).st;}';
/**
* @const
* @type {string}
*/
ol.renderer.webgl.map.shader.ColorVertex.SOURCE = goog.DEBUG ?
ol.renderer.webgl.map.shader.ColorVertex.DEBUG_SOURCE :
ol.renderer.webgl.map.shader.ColorVertex.OPTIMIZED_SOURCE;
/**
* @constructor
* @param {WebGLRenderingContext} gl GL.
* @param {WebGLProgram} program Program.
* @struct
*/
ol.renderer.webgl.map.shader.Color.Locations = function(gl, program) {
/**
* @type {WebGLUniformLocation}
*/
this.u_colorMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_colorMatrix' : 'f');
/**
* @type {WebGLUniformLocation}
*/
this.u_opacity = gl.getUniformLocation(
program, goog.DEBUG ? 'u_opacity' : 'g');
/**
* @type {WebGLUniformLocation}
*/
this.u_projectionMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_projectionMatrix' : 'e');
/**
* @type {WebGLUniformLocation}
*/
this.u_texCoordMatrix = gl.getUniformLocation(
program, goog.DEBUG ? 'u_texCoordMatrix' : 'd');
/**
* @type {WebGLUniformLocation}
*/
this.u_texture = gl.getUniformLocation(
program, goog.DEBUG ? 'u_texture' : 'h');
/**
* @type {number}
*/
this.a_position = gl.getAttribLocation(
program, goog.DEBUG ? 'a_position' : 'b');
/**
* @type {number}
*/
this.a_texCoord = gl.getAttribLocation(
program, goog.DEBUG ? 'a_texCoord' : 'c');
};

11
src/ol/renderer/webgl/webglvectorlayerrenderer.js
View File

@@ -82,8 +82,6 @@ ol.renderer.webgl.VectorLayer.prototype.composeFrame =
replayGroup.replay(context,
viewState.center, viewState.resolution, viewState.rotation,
frameState.size, frameState.pixelRatio, layerState.opacity,
layerState.brightness, layerState.contrast, layerState.hue,
layerState.saturation,
layerState.managed ? frameState.skippedFeatureUids : {});
}
@@ -120,9 +118,7 @@ ol.renderer.webgl.VectorLayer.prototype.forEachFeatureAtCoordinate =
var features = {};
return this.replayGroup_.forEachFeatureAtCoordinate(coordinate,
context, viewState.center, viewState.resolution, viewState.rotation,
frameState.size, frameState.pixelRatio,
layerState.opacity, layerState.brightness, layerState.contrast,
layerState.hue, layerState.saturation,
frameState.size, frameState.pixelRatio, layerState.opacity,
layerState.managed ? frameState.skippedFeatureUids : {},
/**
* @param {ol.Feature} feature Feature.
@@ -153,9 +149,8 @@ ol.renderer.webgl.VectorLayer.prototype.hasFeatureAtCoordinate =
var layerState = this.layerState_;
return this.replayGroup_.hasFeatureAtCoordinate(coordinate,
context, viewState.center, viewState.resolution, viewState.rotation,
frameState.size, frameState.pixelRatio,
layerState.opacity, layerState.brightness, layerState.contrast,
layerState.hue, layerState.saturation, frameState.skippedFeatureUids);
frameState.size, frameState.pixelRatio, layerState.opacity,
frameState.skippedFeatureUids);
}
};