Cleaned up the heatmap layer & use dynamic radius
This commit is contained in:
@@ -147,6 +147,18 @@ class WebGLHelper extends Disposable {
|
||||
*/
|
||||
this.attribLocations_;
|
||||
|
||||
/**
|
||||
* Holds info about custom uniforms used in the post processing pass
|
||||
* @type {Array<{value: *, texture?: WebGLTexture}>}
|
||||
* @private
|
||||
*/
|
||||
this.uniforms_ = [];
|
||||
options.uniforms && Object.keys(options.uniforms).forEach(function(name) {
|
||||
this.uniforms_.push({
|
||||
name: name,
|
||||
value: options.uniforms[name]
|
||||
});
|
||||
}.bind(this));
|
||||
|
||||
// initialize post processes from options
|
||||
// if none given, use a default one
|
||||
@@ -250,6 +262,8 @@ class WebGLHelper extends Disposable {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
|
||||
|
||||
this.applyUniforms();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -462,6 +476,55 @@ class WebGLHelper extends Disposable {
|
||||
|
||||
// TODO: shutdown program
|
||||
|
||||
// todo
|
||||
applyUniforms() {
|
||||
const gl = this.getGL();
|
||||
|
||||
let value;
|
||||
let textureSlot = 0;
|
||||
this.uniforms_.forEach(function(uniform) {
|
||||
value = typeof uniform.value === 'function' ? uniform.value() : uniform.value;
|
||||
|
||||
// apply value based on type
|
||||
if (value instanceof HTMLCanvasElement || value instanceof ImageData) {
|
||||
// create a texture & put data
|
||||
if (!uniform.texture) {
|
||||
uniform.texture = gl.createTexture();
|
||||
}
|
||||
gl.activeTexture(gl[`TEXTURE${textureSlot}`]);
|
||||
gl.bindTexture(gl.TEXTURE_2D, uniform.texture);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
|
||||
if (value instanceof ImageData) {
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, value.width, value.height, 0,
|
||||
gl.UNSIGNED_BYTE, new Uint8Array(value.data));
|
||||
} else {
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, value);
|
||||
}
|
||||
|
||||
// fill texture slots
|
||||
gl.uniform1i(this.getUniformLocation(uniform.name), textureSlot++);
|
||||
|
||||
} else if (Array.isArray(value)) {
|
||||
switch (value.length) {
|
||||
case 2:
|
||||
gl.uniform2f(this.getUniformLocation(uniform.name), value[0], value[1]);
|
||||
return;
|
||||
case 3:
|
||||
gl.uniform3f(this.getUniformLocation(uniform.name), value[0], value[1], value[2]);
|
||||
return;
|
||||
case 4:
|
||||
gl.uniform4f(this.getUniformLocation(uniform.name), value[0], value[1], value[2], value[3]);
|
||||
return;
|
||||
}
|
||||
} else if (typeof value === 'number') {
|
||||
gl.uniform1f(this.getUniformLocation(uniform.name), value);
|
||||
}
|
||||
}.bind(this));
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {number=} opt_wrapS wrapS.
|
||||
* @param {number=} opt_wrapT wrapT.
|
||||
|
||||
Reference in New Issue
Block a user