Remove the bulk of the WebGL legacy code.
Things left to do: * redo an icon layer example * redo a clipping layer example * update docs where WebGL renderers are mentioned
This commit is contained in:
Olivier Guyot
@@ -1,403 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/CircleReplay
|
||||
*/
|
||||
import {getUid} from '../../util.js';
|
||||
import {equals} from '../../array.js';
|
||||
import {asArray} from '../../color.js';
|
||||
import {intersects} from '../../extent.js';
|
||||
import {isEmpty} from '../../obj.js';
|
||||
import {translate} from '../../geom/flat/transform.js';
|
||||
import {fragment, vertex} from './circlereplay/defaultshader.js';
|
||||
import Locations from './circlereplay/defaultshader/Locations.js';
|
||||
import WebGLReplay from './Replay.js';
|
||||
import {DEFAULT_LINEDASH, DEFAULT_LINEDASHOFFSET, DEFAULT_STROKESTYLE,
|
||||
DEFAULT_FILLSTYLE, DEFAULT_LINEWIDTH} from '../webgl.js';
|
||||
import {FLOAT} from '../../webgl.js';
|
||||
import WebGLBuffer from '../../webgl/Buffer.js';
|
||||
|
||||
class WebGLCircleReplay extends WebGLReplay {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super(tolerance, maxExtent);
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("./circlereplay/defaultshader/Locations.js").default}
|
||||
*/
|
||||
this.defaultLocations_ = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<Array<Array<number>|number>>}
|
||||
*/
|
||||
this.styles_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.styleIndices_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {number}
|
||||
*/
|
||||
this.radius_ = 0;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {{fillColor: (Array<number>|null),
|
||||
* strokeColor: (Array<number>|null),
|
||||
* lineDash: Array<number>,
|
||||
* lineDashOffset: (number|undefined),
|
||||
* lineWidth: (number|undefined),
|
||||
* changed: boolean}|null}
|
||||
*/
|
||||
this.state_ = {
|
||||
fillColor: null,
|
||||
strokeColor: null,
|
||||
lineDash: null,
|
||||
lineDashOffset: undefined,
|
||||
lineWidth: undefined,
|
||||
changed: false
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {number} offset Offset.
|
||||
* @param {number} end End.
|
||||
* @param {number} stride Stride.
|
||||
*/
|
||||
drawCoordinates_(flatCoordinates, offset, end, stride) {
|
||||
let numVertices = this.vertices.length;
|
||||
let numIndices = this.indices.length;
|
||||
let n = numVertices / 4;
|
||||
let i, ii;
|
||||
for (i = offset, ii = end; i < ii; i += stride) {
|
||||
this.vertices[numVertices++] = flatCoordinates[i];
|
||||
this.vertices[numVertices++] = flatCoordinates[i + 1];
|
||||
this.vertices[numVertices++] = 0;
|
||||
this.vertices[numVertices++] = this.radius_;
|
||||
|
||||
this.vertices[numVertices++] = flatCoordinates[i];
|
||||
this.vertices[numVertices++] = flatCoordinates[i + 1];
|
||||
this.vertices[numVertices++] = 1;
|
||||
this.vertices[numVertices++] = this.radius_;
|
||||
|
||||
this.vertices[numVertices++] = flatCoordinates[i];
|
||||
this.vertices[numVertices++] = flatCoordinates[i + 1];
|
||||
this.vertices[numVertices++] = 2;
|
||||
this.vertices[numVertices++] = this.radius_;
|
||||
|
||||
this.vertices[numVertices++] = flatCoordinates[i];
|
||||
this.vertices[numVertices++] = flatCoordinates[i + 1];
|
||||
this.vertices[numVertices++] = 3;
|
||||
this.vertices[numVertices++] = this.radius_;
|
||||
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n + 3;
|
||||
this.indices[numIndices++] = n;
|
||||
|
||||
n += 4;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawCircle(circleGeometry, feature) {
|
||||
const radius = circleGeometry.getRadius();
|
||||
const stride = circleGeometry.getStride();
|
||||
if (radius) {
|
||||
this.startIndices.push(this.indices.length);
|
||||
this.startIndicesFeature.push(feature);
|
||||
if (this.state_.changed) {
|
||||
this.styleIndices_.push(this.indices.length);
|
||||
this.state_.changed = false;
|
||||
}
|
||||
|
||||
this.radius_ = radius;
|
||||
let flatCoordinates = circleGeometry.getFlatCoordinates();
|
||||
flatCoordinates = translate(flatCoordinates, 0, 2,
|
||||
stride, -this.origin[0], -this.origin[1]);
|
||||
this.drawCoordinates_(flatCoordinates, 0, 2, stride);
|
||||
} else {
|
||||
if (this.state_.changed) {
|
||||
this.styles_.pop();
|
||||
if (this.styles_.length) {
|
||||
const lastState = this.styles_[this.styles_.length - 1];
|
||||
this.state_.fillColor = /** @type {Array<number>} */ (lastState[0]);
|
||||
this.state_.strokeColor = /** @type {Array<number>} */ (lastState[1]);
|
||||
this.state_.lineWidth = /** @type {number} */ (lastState[2]);
|
||||
this.state_.changed = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
**/
|
||||
finish(context) {
|
||||
// create, bind, and populate the vertices buffer
|
||||
this.verticesBuffer = new WebGLBuffer(this.vertices);
|
||||
|
||||
// create, bind, and populate the indices buffer
|
||||
this.indicesBuffer = new WebGLBuffer(this.indices);
|
||||
|
||||
this.startIndices.push(this.indices.length);
|
||||
|
||||
//Clean up, if there is nothing to draw
|
||||
if (this.styleIndices_.length === 0 && this.styles_.length > 0) {
|
||||
this.styles_ = [];
|
||||
}
|
||||
|
||||
this.vertices = null;
|
||||
this.indices = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getDeleteResourcesFunction(context) {
|
||||
// We only delete our stuff here. The shaders and the program may
|
||||
// be used by other CircleReplay instances (for other layers). And
|
||||
// they will be deleted when disposing of the import("../../webgl/Context.js").WebGLContext
|
||||
// object.
|
||||
const verticesBuffer = this.verticesBuffer;
|
||||
const indicesBuffer = this.indicesBuffer;
|
||||
return function() {
|
||||
context.deleteBuffer(verticesBuffer);
|
||||
context.deleteBuffer(indicesBuffer);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setUpProgram(gl, context, size, pixelRatio) {
|
||||
// get the program
|
||||
const program = context.getProgram(fragment, vertex);
|
||||
|
||||
// get the locations
|
||||
let locations;
|
||||
if (!this.defaultLocations_) {
|
||||
locations = new Locations(gl, program);
|
||||
this.defaultLocations_ = locations;
|
||||
} else {
|
||||
locations = this.defaultLocations_;
|
||||
}
|
||||
|
||||
context.useProgram(program);
|
||||
|
||||
// enable the vertex attrib arrays
|
||||
gl.enableVertexAttribArray(locations.a_position);
|
||||
gl.vertexAttribPointer(locations.a_position, 2, FLOAT,
|
||||
false, 16, 0);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_instruction);
|
||||
gl.vertexAttribPointer(locations.a_instruction, 1, FLOAT,
|
||||
false, 16, 8);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_radius);
|
||||
gl.vertexAttribPointer(locations.a_radius, 1, FLOAT,
|
||||
false, 16, 12);
|
||||
|
||||
// Enable renderer specific uniforms.
|
||||
gl.uniform2fv(locations.u_size, size);
|
||||
gl.uniform1f(locations.u_pixelRatio, pixelRatio);
|
||||
|
||||
return locations;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
shutDownProgram(gl, locations) {
|
||||
gl.disableVertexAttribArray(locations.a_position);
|
||||
gl.disableVertexAttribArray(locations.a_instruction);
|
||||
gl.disableVertexAttribArray(locations.a_radius);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawReplay(gl, context, skippedFeaturesHash, hitDetection) {
|
||||
if (!isEmpty(skippedFeaturesHash)) {
|
||||
this.drawReplaySkipping_(gl, context, skippedFeaturesHash);
|
||||
} else {
|
||||
//Draw by style groups to minimize drawElements() calls.
|
||||
let i, start, end, nextStyle;
|
||||
end = this.startIndices[this.startIndices.length - 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
start = this.styleIndices_[i];
|
||||
nextStyle = this.styles_[i];
|
||||
this.setFillStyle_(gl, /** @type {Array<number>} */ (nextStyle[0]));
|
||||
this.setStrokeStyle_(gl, /** @type {Array<number>} */ (nextStyle[1]),
|
||||
/** @type {number} */ (nextStyle[2]));
|
||||
this.drawElements(gl, context, start, end);
|
||||
end = start;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawHitDetectionReplayOneByOne(gl, context, skippedFeaturesHash, featureCallback, opt_hitExtent) {
|
||||
let i, start, end, nextStyle, groupStart, feature, featureIndex;
|
||||
featureIndex = this.startIndices.length - 2;
|
||||
end = this.startIndices[featureIndex + 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
nextStyle = this.styles_[i];
|
||||
this.setFillStyle_(gl, /** @type {Array<number>} */ (nextStyle[0]));
|
||||
this.setStrokeStyle_(gl, /** @type {Array<number>} */ (nextStyle[1]),
|
||||
/** @type {number} */ (nextStyle[2]));
|
||||
groupStart = this.styleIndices_[i];
|
||||
|
||||
while (featureIndex >= 0 &&
|
||||
this.startIndices[featureIndex] >= groupStart) {
|
||||
start = this.startIndices[featureIndex];
|
||||
feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)] === undefined &&
|
||||
feature.getGeometry() &&
|
||||
(opt_hitExtent === undefined || intersects(
|
||||
/** @type {Array<number>} */ (opt_hitExtent),
|
||||
feature.getGeometry().getExtent()))) {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
this.drawElements(gl, context, start, end);
|
||||
|
||||
const result = featureCallback(feature);
|
||||
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
|
||||
}
|
||||
featureIndex--;
|
||||
end = start;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object} skippedFeaturesHash Ids of features to skip.
|
||||
*/
|
||||
drawReplaySkipping_(gl, context, skippedFeaturesHash) {
|
||||
let i, start, end, nextStyle, groupStart, feature, featureIndex, featureStart;
|
||||
featureIndex = this.startIndices.length - 2;
|
||||
end = start = this.startIndices[featureIndex + 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
nextStyle = this.styles_[i];
|
||||
this.setFillStyle_(gl, /** @type {Array<number>} */ (nextStyle[0]));
|
||||
this.setStrokeStyle_(gl, /** @type {Array<number>} */ (nextStyle[1]),
|
||||
/** @type {number} */ (nextStyle[2]));
|
||||
groupStart = this.styleIndices_[i];
|
||||
|
||||
while (featureIndex >= 0 &&
|
||||
this.startIndices[featureIndex] >= groupStart) {
|
||||
featureStart = this.startIndices[featureIndex];
|
||||
feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)]) {
|
||||
if (start !== end) {
|
||||
this.drawElements(gl, context, start, end);
|
||||
}
|
||||
end = featureStart;
|
||||
}
|
||||
featureIndex--;
|
||||
start = featureStart;
|
||||
}
|
||||
if (start !== end) {
|
||||
this.drawElements(gl, context, start, end);
|
||||
}
|
||||
start = end = groupStart;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {Array<number>} color Color.
|
||||
*/
|
||||
setFillStyle_(gl, color) {
|
||||
gl.uniform4fv(this.defaultLocations_.u_fillColor, color);
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {Array<number>} color Color.
|
||||
* @param {number} lineWidth Line width.
|
||||
*/
|
||||
setStrokeStyle_(gl, color, lineWidth) {
|
||||
gl.uniform4fv(this.defaultLocations_.u_strokeColor, color);
|
||||
gl.uniform1f(this.defaultLocations_.u_lineWidth, lineWidth);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setFillStrokeStyle(fillStyle, strokeStyle) {
|
||||
let strokeStyleColor, strokeStyleWidth;
|
||||
if (strokeStyle) {
|
||||
const strokeStyleLineDash = strokeStyle.getLineDash();
|
||||
this.state_.lineDash = strokeStyleLineDash ?
|
||||
strokeStyleLineDash : DEFAULT_LINEDASH;
|
||||
const strokeStyleLineDashOffset = strokeStyle.getLineDashOffset();
|
||||
this.state_.lineDashOffset = strokeStyleLineDashOffset ?
|
||||
strokeStyleLineDashOffset : DEFAULT_LINEDASHOFFSET;
|
||||
strokeStyleColor = strokeStyle.getColor();
|
||||
if (!(strokeStyleColor instanceof CanvasGradient) &&
|
||||
!(strokeStyleColor instanceof CanvasPattern)) {
|
||||
strokeStyleColor = asArray(strokeStyleColor).map(function(c, i) {
|
||||
return i != 3 ? c / 255 : c;
|
||||
}) || DEFAULT_STROKESTYLE;
|
||||
} else {
|
||||
strokeStyleColor = DEFAULT_STROKESTYLE;
|
||||
}
|
||||
strokeStyleWidth = strokeStyle.getWidth();
|
||||
strokeStyleWidth = strokeStyleWidth !== undefined ?
|
||||
strokeStyleWidth : DEFAULT_LINEWIDTH;
|
||||
} else {
|
||||
strokeStyleColor = [0, 0, 0, 0];
|
||||
strokeStyleWidth = 0;
|
||||
}
|
||||
let fillStyleColor = fillStyle ? fillStyle.getColor() : [0, 0, 0, 0];
|
||||
if (!(fillStyleColor instanceof CanvasGradient) &&
|
||||
!(fillStyleColor instanceof CanvasPattern)) {
|
||||
fillStyleColor = asArray(fillStyleColor).map(function(c, i) {
|
||||
return i != 3 ? c / 255 : c;
|
||||
}) || DEFAULT_FILLSTYLE;
|
||||
} else {
|
||||
fillStyleColor = DEFAULT_FILLSTYLE;
|
||||
}
|
||||
if (!this.state_.strokeColor || !equals(this.state_.strokeColor, strokeStyleColor) ||
|
||||
!this.state_.fillColor || !equals(this.state_.fillColor, fillStyleColor) ||
|
||||
this.state_.lineWidth !== strokeStyleWidth) {
|
||||
this.state_.changed = true;
|
||||
this.state_.fillColor = fillStyleColor;
|
||||
this.state_.strokeColor = strokeStyleColor;
|
||||
this.state_.lineWidth = strokeStyleWidth;
|
||||
this.styles_.push([fillStyleColor, strokeStyleColor, strokeStyleWidth]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLCircleReplay;
|
||||
@@ -1,164 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/ImageReplay
|
||||
*/
|
||||
import {getUid} from '../../util.js';
|
||||
import WebGLTextureReplay from './TextureReplay.js';
|
||||
import WebGLBuffer from '../../webgl/Buffer.js';
|
||||
|
||||
class WebGLImageReplay extends WebGLTextureReplay {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super(tolerance, maxExtent);
|
||||
|
||||
/**
|
||||
* @type {Array<HTMLCanvasElement|HTMLImageElement|HTMLVideoElement>}
|
||||
* @protected
|
||||
*/
|
||||
this.images_ = [];
|
||||
|
||||
/**
|
||||
* @type {Array<HTMLCanvasElement|HTMLImageElement|HTMLVideoElement>}
|
||||
* @protected
|
||||
*/
|
||||
this.hitDetectionImages_ = [];
|
||||
|
||||
/**
|
||||
* @type {Array<WebGLTexture>}
|
||||
* @private
|
||||
*/
|
||||
this.textures_ = [];
|
||||
|
||||
/**
|
||||
* @type {Array<WebGLTexture>}
|
||||
* @private
|
||||
*/
|
||||
this.hitDetectionTextures_ = [];
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawMultiPoint(multiPointGeometry, feature) {
|
||||
this.startIndices.push(this.indices.length);
|
||||
this.startIndicesFeature.push(feature);
|
||||
const flatCoordinates = multiPointGeometry.getFlatCoordinates();
|
||||
const stride = multiPointGeometry.getStride();
|
||||
this.drawCoordinates(
|
||||
flatCoordinates, 0, flatCoordinates.length, stride);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawPoint(pointGeometry, feature) {
|
||||
this.startIndices.push(this.indices.length);
|
||||
this.startIndicesFeature.push(feature);
|
||||
const flatCoordinates = pointGeometry.getFlatCoordinates();
|
||||
const stride = pointGeometry.getStride();
|
||||
this.drawCoordinates(
|
||||
flatCoordinates, 0, flatCoordinates.length, stride);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
finish(context) {
|
||||
const gl = context.getGL();
|
||||
|
||||
this.groupIndices.push(this.indices.length);
|
||||
this.hitDetectionGroupIndices.push(this.indices.length);
|
||||
|
||||
// create, bind, and populate the vertices buffer
|
||||
this.verticesBuffer = new WebGLBuffer(this.vertices);
|
||||
|
||||
const indices = this.indices;
|
||||
|
||||
// create, bind, and populate the indices buffer
|
||||
this.indicesBuffer = new WebGLBuffer(indices);
|
||||
|
||||
// create textures
|
||||
/** @type {Object<string, WebGLTexture>} */
|
||||
const texturePerImage = {};
|
||||
|
||||
this.createTextures(this.textures_, this.images_, texturePerImage, gl);
|
||||
|
||||
this.createTextures(this.hitDetectionTextures_, this.hitDetectionImages_,
|
||||
texturePerImage, gl);
|
||||
|
||||
this.images_ = null;
|
||||
this.hitDetectionImages_ = null;
|
||||
super.finish(context);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setImageStyle(imageStyle) {
|
||||
const anchor = imageStyle.getAnchor();
|
||||
const image = imageStyle.getImage(1);
|
||||
const imageSize = imageStyle.getImageSize();
|
||||
const hitDetectionImage = imageStyle.getHitDetectionImage(1);
|
||||
const opacity = imageStyle.getOpacity();
|
||||
const origin = imageStyle.getOrigin();
|
||||
const rotateWithView = imageStyle.getRotateWithView();
|
||||
const rotation = imageStyle.getRotation();
|
||||
const size = imageStyle.getSize();
|
||||
const scale = imageStyle.getScale();
|
||||
|
||||
let currentImage;
|
||||
if (this.images_.length === 0) {
|
||||
this.images_.push(image);
|
||||
} else {
|
||||
currentImage = this.images_[this.images_.length - 1];
|
||||
if (getUid(currentImage) != getUid(image)) {
|
||||
this.groupIndices.push(this.indices.length);
|
||||
this.images_.push(image);
|
||||
}
|
||||
}
|
||||
|
||||
if (this.hitDetectionImages_.length === 0) {
|
||||
this.hitDetectionImages_.push(hitDetectionImage);
|
||||
} else {
|
||||
currentImage =
|
||||
this.hitDetectionImages_[this.hitDetectionImages_.length - 1];
|
||||
if (getUid(currentImage) != getUid(hitDetectionImage)) {
|
||||
this.hitDetectionGroupIndices.push(this.indices.length);
|
||||
this.hitDetectionImages_.push(hitDetectionImage);
|
||||
}
|
||||
}
|
||||
|
||||
this.anchorX = anchor[0];
|
||||
this.anchorY = anchor[1];
|
||||
this.height = size[1];
|
||||
this.imageHeight = imageSize[1];
|
||||
this.imageWidth = imageSize[0];
|
||||
this.opacity = opacity;
|
||||
this.originX = origin[0];
|
||||
this.originY = origin[1];
|
||||
this.rotation = rotation;
|
||||
this.rotateWithView = rotateWithView;
|
||||
this.scale = scale;
|
||||
this.width = size[0];
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getTextures(opt_all) {
|
||||
return opt_all ? this.textures_.concat(this.hitDetectionTextures_) : this.textures_;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getHitDetectionTextures() {
|
||||
return this.hitDetectionTextures_;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLImageReplay;
|
||||
@@ -1,394 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/Immediate
|
||||
*/
|
||||
|
||||
import {intersects} from '../../extent.js';
|
||||
import GeometryType from '../../geom/GeometryType.js';
|
||||
import ReplayType from '../ReplayType.js';
|
||||
import VectorContext from '../VectorContext.js';
|
||||
import WebGLReplayGroup from './ReplayGroup.js';
|
||||
|
||||
class WebGLImmediateRenderer extends VectorContext {
|
||||
/**
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {import("../../extent.js").Extent} extent Extent.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
*/
|
||||
constructor(context, center, resolution, rotation, size, extent, pixelRatio) {
|
||||
super();
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.context_ = context;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.center_ = center;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.extent_ = extent;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.pixelRatio_ = pixelRatio;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.size_ = size;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.rotation_ = rotation;
|
||||
|
||||
/**
|
||||
* @private
|
||||
*/
|
||||
this.resolution_ = resolution;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../style/Image.js").default}
|
||||
*/
|
||||
this.imageStyle_ = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../style/Fill.js").default}
|
||||
*/
|
||||
this.fillStyle_ = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../style/Stroke.js").default}
|
||||
*/
|
||||
this.strokeStyle_ = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../style/Text.js").default}
|
||||
*/
|
||||
this.textStyle_ = null;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("./ReplayGroup.js").default} replayGroup Replay group.
|
||||
* @param {import("../../geom/Geometry.js").default|import("../Feature.js").default} geometry Geometry.
|
||||
* @private
|
||||
*/
|
||||
drawText_(replayGroup, geometry) {
|
||||
const context = this.context_;
|
||||
const replay = /** @type {import("./TextReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.TEXT));
|
||||
replay.setTextStyle(this.textStyle_);
|
||||
replay.drawText(geometry, null);
|
||||
replay.finish(context);
|
||||
// default colors
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the rendering style. Note that since this is an immediate rendering API,
|
||||
* any `zIndex` on the provided style will be ignored.
|
||||
*
|
||||
* @param {import("../../style/Style.js").default} style The rendering style.
|
||||
* @override
|
||||
* @api
|
||||
*/
|
||||
setStyle(style) {
|
||||
this.setFillStrokeStyle(style.getFill(), style.getStroke());
|
||||
this.setImageStyle(style.getImage());
|
||||
this.setTextStyle(style.getText());
|
||||
}
|
||||
|
||||
/**
|
||||
* Render a geometry into the canvas. Call
|
||||
* {@link ol/render/webgl/Immediate#setStyle} first to set the rendering style.
|
||||
*
|
||||
* @param {import("../../geom/Geometry.js").default|import("../Feature.js").default} geometry The geometry to render.
|
||||
* @override
|
||||
* @api
|
||||
*/
|
||||
drawGeometry(geometry) {
|
||||
const type = geometry.getType();
|
||||
switch (type) {
|
||||
case GeometryType.POINT:
|
||||
this.drawPoint(/** @type {import("../../geom/Point.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.LINE_STRING:
|
||||
this.drawLineString(/** @type {import("../../geom/LineString.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.POLYGON:
|
||||
this.drawPolygon(/** @type {import("../../geom/Polygon.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.MULTI_POINT:
|
||||
this.drawMultiPoint(/** @type {import("../../geom/MultiPoint.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.MULTI_LINE_STRING:
|
||||
this.drawMultiLineString(/** @type {import("../../geom/MultiLineString.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.MULTI_POLYGON:
|
||||
this.drawMultiPolygon(/** @type {import("../../geom/MultiPolygon.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.GEOMETRY_COLLECTION:
|
||||
this.drawGeometryCollection(/** @type {import("../../geom/GeometryCollection.js").default} */ (geometry), null);
|
||||
break;
|
||||
case GeometryType.CIRCLE:
|
||||
this.drawCircle(/** @type {import("../../geom/Circle.js").default} */ (geometry), null);
|
||||
break;
|
||||
default:
|
||||
// pass
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
* @api
|
||||
*/
|
||||
drawFeature(feature, style) {
|
||||
const geometry = style.getGeometryFunction()(feature);
|
||||
if (!geometry || !intersects(this.extent_, geometry.getExtent())) {
|
||||
return;
|
||||
}
|
||||
this.setStyle(style);
|
||||
this.drawGeometry(geometry);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawGeometryCollection(geometry, data) {
|
||||
const geometries = geometry.getGeometriesArray();
|
||||
let i, ii;
|
||||
for (i = 0, ii = geometries.length; i < ii; ++i) {
|
||||
this.drawGeometry(geometries[i]);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawPoint(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./ImageReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.IMAGE));
|
||||
replay.setImageStyle(this.imageStyle_);
|
||||
replay.drawPoint(geometry, data);
|
||||
replay.finish(context);
|
||||
// default colors
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawMultiPoint(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./ImageReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.IMAGE));
|
||||
replay.setImageStyle(this.imageStyle_);
|
||||
replay.drawMultiPoint(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawLineString(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./LineStringReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.LINE_STRING));
|
||||
replay.setFillStrokeStyle(null, this.strokeStyle_);
|
||||
replay.drawLineString(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawMultiLineString(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./LineStringReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.LINE_STRING));
|
||||
replay.setFillStrokeStyle(null, this.strokeStyle_);
|
||||
replay.drawMultiLineString(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawPolygon(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./PolygonReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.POLYGON));
|
||||
replay.setFillStrokeStyle(this.fillStyle_, this.strokeStyle_);
|
||||
replay.drawPolygon(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawMultiPolygon(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./PolygonReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.POLYGON));
|
||||
replay.setFillStrokeStyle(this.fillStyle_, this.strokeStyle_);
|
||||
replay.drawMultiPolygon(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawCircle(geometry, data) {
|
||||
const context = this.context_;
|
||||
const replayGroup = new WebGLReplayGroup(1, this.extent_);
|
||||
const replay = /** @type {import("./CircleReplay.js").default} */ (
|
||||
replayGroup.getBuilder(0, ReplayType.CIRCLE));
|
||||
replay.setFillStrokeStyle(this.fillStyle_, this.strokeStyle_);
|
||||
replay.drawCircle(geometry, data);
|
||||
replay.finish(context);
|
||||
const opacity = 1;
|
||||
/** @type {Object<string, boolean>} */
|
||||
const skippedFeatures = {};
|
||||
let featureCallback;
|
||||
const oneByOne = false;
|
||||
replay.replay(this.context_, this.center_, this.resolution_, this.rotation_,
|
||||
this.size_, this.pixelRatio_, opacity, skippedFeatures, featureCallback,
|
||||
oneByOne);
|
||||
replay.getDeleteResourcesFunction(context)();
|
||||
|
||||
if (this.textStyle_) {
|
||||
this.drawText_(replayGroup, geometry);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setImageStyle(imageStyle) {
|
||||
this.imageStyle_ = imageStyle;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setFillStrokeStyle(fillStyle, strokeStyle) {
|
||||
this.fillStyle_ = fillStyle;
|
||||
this.strokeStyle_ = strokeStyle;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setTextStyle(textStyle) {
|
||||
this.textStyle_ = textStyle;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLImmediateRenderer;
|
||||
@@ -1,665 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/LineStringReplay
|
||||
*/
|
||||
import {getUid} from '../../util.js';
|
||||
import {equals} from '../../array.js';
|
||||
import {asArray} from '../../color.js';
|
||||
import {intersects} from '../../extent.js';
|
||||
import {linearRingIsClockwise} from '../../geom/flat/orient.js';
|
||||
import {translate} from '../../geom/flat/transform.js';
|
||||
import {lineStringIsClosed} from '../../geom/flat/topology.js';
|
||||
import {isEmpty} from '../../obj.js';
|
||||
import {DEFAULT_LINECAP, DEFAULT_LINEDASH, DEFAULT_LINEDASHOFFSET,
|
||||
DEFAULT_LINEJOIN, DEFAULT_LINEWIDTH, DEFAULT_MITERLIMIT, DEFAULT_STROKESTYLE,
|
||||
triangleIsCounterClockwise} from '../webgl.js';
|
||||
import WebGLReplay from './Replay.js';
|
||||
import {fragment, vertex} from './linestringreplay/defaultshader.js';
|
||||
import Locations from './linestringreplay/defaultshader/Locations.js';
|
||||
import {FLOAT} from '../../webgl.js';
|
||||
import WebGLBuffer from '../../webgl/Buffer.js';
|
||||
|
||||
|
||||
/**
|
||||
* @enum {number}
|
||||
*/
|
||||
const Instruction = {
|
||||
ROUND: 2,
|
||||
BEGIN_LINE: 3,
|
||||
END_LINE: 5,
|
||||
BEGIN_LINE_CAP: 7,
|
||||
END_LINE_CAP: 11,
|
||||
BEVEL_FIRST: 13,
|
||||
BEVEL_SECOND: 17,
|
||||
MITER_BOTTOM: 19,
|
||||
MITER_TOP: 23
|
||||
};
|
||||
|
||||
|
||||
class WebGLLineStringReplay extends WebGLReplay {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super(tolerance, maxExtent);
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("./linestringreplay/defaultshader/Locations.js").default}
|
||||
*/
|
||||
this.defaultLocations_ = null;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<Array<?>>}
|
||||
*/
|
||||
this.styles_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.styleIndices_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {{strokeColor: (Array<number>|null),
|
||||
* lineCap: (string|undefined),
|
||||
* lineDash: Array<number>,
|
||||
* lineDashOffset: (number|undefined),
|
||||
* lineJoin: (string|undefined),
|
||||
* lineWidth: (number|undefined),
|
||||
* miterLimit: (number|undefined),
|
||||
* changed: boolean}|null}
|
||||
*/
|
||||
this.state_ = {
|
||||
strokeColor: null,
|
||||
lineCap: undefined,
|
||||
lineDash: null,
|
||||
lineDashOffset: undefined,
|
||||
lineJoin: undefined,
|
||||
lineWidth: undefined,
|
||||
miterLimit: undefined,
|
||||
changed: false
|
||||
};
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Draw one segment.
|
||||
* @private
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {number} offset Offset.
|
||||
* @param {number} end End.
|
||||
* @param {number} stride Stride.
|
||||
*/
|
||||
drawCoordinates_(flatCoordinates, offset, end, stride) {
|
||||
|
||||
let i, ii;
|
||||
let numVertices = this.vertices.length;
|
||||
let numIndices = this.indices.length;
|
||||
//To save a vertex, the direction of a point is a product of the sign (1 or -1), a prime from
|
||||
//Instruction, and a rounding factor (1 or 2). If the product is even,
|
||||
//we round it. If it is odd, we don't.
|
||||
const lineJoin = this.state_.lineJoin === 'bevel' ? 0 :
|
||||
this.state_.lineJoin === 'miter' ? 1 : 2;
|
||||
const lineCap = this.state_.lineCap === 'butt' ? 0 :
|
||||
this.state_.lineCap === 'square' ? 1 : 2;
|
||||
const closed = lineStringIsClosed(flatCoordinates, offset, end, stride);
|
||||
let startCoords, sign, n;
|
||||
let lastIndex = numIndices;
|
||||
let lastSign = 1;
|
||||
//We need the adjacent vertices to define normals in joins. p0 = last, p1 = current, p2 = next.
|
||||
let p0, p1, p2;
|
||||
|
||||
for (i = offset, ii = end; i < ii; i += stride) {
|
||||
|
||||
n = numVertices / 7;
|
||||
|
||||
p0 = p1;
|
||||
p1 = p2 || [flatCoordinates[i], flatCoordinates[i + 1]];
|
||||
//First vertex.
|
||||
if (i === offset) {
|
||||
p2 = [flatCoordinates[i + stride], flatCoordinates[i + stride + 1]];
|
||||
if (end - offset === stride * 2 && equals(p1, p2)) {
|
||||
break;
|
||||
}
|
||||
if (closed) {
|
||||
//A closed line! Complete the circle.
|
||||
p0 = [flatCoordinates[end - stride * 2],
|
||||
flatCoordinates[end - stride * 2 + 1]];
|
||||
|
||||
startCoords = p2;
|
||||
} else {
|
||||
//Add the first two/four vertices.
|
||||
|
||||
if (lineCap) {
|
||||
numVertices = this.addVertices_([0, 0], p1, p2,
|
||||
lastSign * Instruction.BEGIN_LINE_CAP * lineCap, numVertices);
|
||||
|
||||
numVertices = this.addVertices_([0, 0], p1, p2,
|
||||
-lastSign * Instruction.BEGIN_LINE_CAP * lineCap, numVertices);
|
||||
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n + 3;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
|
||||
}
|
||||
|
||||
numVertices = this.addVertices_([0, 0], p1, p2,
|
||||
lastSign * Instruction.BEGIN_LINE * (lineCap || 1), numVertices);
|
||||
|
||||
numVertices = this.addVertices_([0, 0], p1, p2,
|
||||
-lastSign * Instruction.BEGIN_LINE * (lineCap || 1), numVertices);
|
||||
|
||||
lastIndex = numVertices / 7 - 1;
|
||||
|
||||
continue;
|
||||
}
|
||||
} else if (i === end - stride) {
|
||||
//Last vertex.
|
||||
if (closed) {
|
||||
//Same as the first vertex.
|
||||
p2 = startCoords;
|
||||
break;
|
||||
} else {
|
||||
p0 = p0 || [0, 0];
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, [0, 0],
|
||||
lastSign * Instruction.END_LINE * (lineCap || 1), numVertices);
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, [0, 0],
|
||||
-lastSign * Instruction.END_LINE * (lineCap || 1), numVertices);
|
||||
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = lastIndex - 1;
|
||||
this.indices[numIndices++] = lastIndex;
|
||||
|
||||
this.indices[numIndices++] = lastIndex;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n;
|
||||
|
||||
if (lineCap) {
|
||||
numVertices = this.addVertices_(p0, p1, [0, 0],
|
||||
lastSign * Instruction.END_LINE_CAP * lineCap, numVertices);
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, [0, 0],
|
||||
-lastSign * Instruction.END_LINE_CAP * lineCap, numVertices);
|
||||
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n + 3;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
} else {
|
||||
p2 = [flatCoordinates[i + stride], flatCoordinates[i + stride + 1]];
|
||||
}
|
||||
|
||||
// We group CW and straight lines, thus the not so inituitive CCW checking function.
|
||||
sign = triangleIsCounterClockwise(p0[0], p0[1], p1[0], p1[1], p2[0], p2[1])
|
||||
? -1 : 1;
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
sign * Instruction.BEVEL_FIRST * (lineJoin || 1), numVertices);
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
sign * Instruction.BEVEL_SECOND * (lineJoin || 1), numVertices);
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
-sign * Instruction.MITER_BOTTOM * (lineJoin || 1), numVertices);
|
||||
|
||||
if (i > offset) {
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = lastIndex - 1;
|
||||
this.indices[numIndices++] = lastIndex;
|
||||
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = lastSign * sign > 0 ? lastIndex : lastIndex - 1;
|
||||
}
|
||||
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
|
||||
lastIndex = n + 2;
|
||||
lastSign = sign;
|
||||
|
||||
//Add miter
|
||||
if (lineJoin) {
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
sign * Instruction.MITER_TOP * lineJoin, numVertices);
|
||||
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n + 3;
|
||||
this.indices[numIndices++] = n;
|
||||
}
|
||||
}
|
||||
|
||||
if (closed) {
|
||||
n = n || numVertices / 7;
|
||||
sign = linearRingIsClockwise([p0[0], p0[1], p1[0], p1[1], p2[0], p2[1]], 0, 6, 2)
|
||||
? 1 : -1;
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
sign * Instruction.BEVEL_FIRST * (lineJoin || 1), numVertices);
|
||||
|
||||
numVertices = this.addVertices_(p0, p1, p2,
|
||||
-sign * Instruction.MITER_BOTTOM * (lineJoin || 1), numVertices);
|
||||
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = lastIndex - 1;
|
||||
this.indices[numIndices++] = lastIndex;
|
||||
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = lastSign * sign > 0 ? lastIndex : lastIndex - 1;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Array<number>} p0 Last coordinates.
|
||||
* @param {Array<number>} p1 Current coordinates.
|
||||
* @param {Array<number>} p2 Next coordinates.
|
||||
* @param {number} product Sign, instruction, and rounding product.
|
||||
* @param {number} numVertices Vertex counter.
|
||||
* @return {number} Vertex counter.
|
||||
* @private
|
||||
*/
|
||||
addVertices_(p0, p1, p2, product, numVertices) {
|
||||
this.vertices[numVertices++] = p0[0];
|
||||
this.vertices[numVertices++] = p0[1];
|
||||
this.vertices[numVertices++] = p1[0];
|
||||
this.vertices[numVertices++] = p1[1];
|
||||
this.vertices[numVertices++] = p2[0];
|
||||
this.vertices[numVertices++] = p2[1];
|
||||
this.vertices[numVertices++] = product;
|
||||
|
||||
return numVertices;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if the linestring can be drawn (i. e. valid).
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {number} offset Offset.
|
||||
* @param {number} end End.
|
||||
* @param {number} stride Stride.
|
||||
* @return {boolean} The linestring can be drawn.
|
||||
* @private
|
||||
*/
|
||||
isValid_(flatCoordinates, offset, end, stride) {
|
||||
const range = end - offset;
|
||||
if (range < stride * 2) {
|
||||
return false;
|
||||
} else if (range === stride * 2) {
|
||||
const firstP = [flatCoordinates[offset], flatCoordinates[offset + 1]];
|
||||
const lastP = [flatCoordinates[offset + stride], flatCoordinates[offset + stride + 1]];
|
||||
return !equals(firstP, lastP);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawLineString(lineStringGeometry, feature) {
|
||||
let flatCoordinates = lineStringGeometry.getFlatCoordinates();
|
||||
const stride = lineStringGeometry.getStride();
|
||||
if (this.isValid_(flatCoordinates, 0, flatCoordinates.length, stride)) {
|
||||
flatCoordinates = translate(flatCoordinates, 0, flatCoordinates.length,
|
||||
stride, -this.origin[0], -this.origin[1]);
|
||||
if (this.state_.changed) {
|
||||
this.styleIndices_.push(this.indices.length);
|
||||
this.state_.changed = false;
|
||||
}
|
||||
this.startIndices.push(this.indices.length);
|
||||
this.startIndicesFeature.push(feature);
|
||||
this.drawCoordinates_(
|
||||
flatCoordinates, 0, flatCoordinates.length, stride);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawMultiLineString(multiLineStringGeometry, feature) {
|
||||
const indexCount = this.indices.length;
|
||||
const ends = multiLineStringGeometry.getEnds();
|
||||
ends.unshift(0);
|
||||
const flatCoordinates = multiLineStringGeometry.getFlatCoordinates();
|
||||
const stride = multiLineStringGeometry.getStride();
|
||||
let i, ii;
|
||||
if (ends.length > 1) {
|
||||
for (i = 1, ii = ends.length; i < ii; ++i) {
|
||||
if (this.isValid_(flatCoordinates, ends[i - 1], ends[i], stride)) {
|
||||
const lineString = translate(flatCoordinates, ends[i - 1], ends[i],
|
||||
stride, -this.origin[0], -this.origin[1]);
|
||||
this.drawCoordinates_(
|
||||
lineString, 0, lineString.length, stride);
|
||||
}
|
||||
}
|
||||
}
|
||||
if (this.indices.length > indexCount) {
|
||||
this.startIndices.push(indexCount);
|
||||
this.startIndicesFeature.push(feature);
|
||||
if (this.state_.changed) {
|
||||
this.styleIndices_.push(indexCount);
|
||||
this.state_.changed = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {Array<Array<number>>} holeFlatCoordinates Hole flat coordinates.
|
||||
* @param {number} stride Stride.
|
||||
*/
|
||||
drawPolygonCoordinates(flatCoordinates, holeFlatCoordinates, stride) {
|
||||
if (!lineStringIsClosed(flatCoordinates, 0, flatCoordinates.length, stride)) {
|
||||
flatCoordinates.push(flatCoordinates[0]);
|
||||
flatCoordinates.push(flatCoordinates[1]);
|
||||
}
|
||||
this.drawCoordinates_(flatCoordinates, 0, flatCoordinates.length, stride);
|
||||
if (holeFlatCoordinates.length) {
|
||||
let i, ii;
|
||||
for (i = 0, ii = holeFlatCoordinates.length; i < ii; ++i) {
|
||||
if (!lineStringIsClosed(holeFlatCoordinates[i], 0, holeFlatCoordinates[i].length, stride)) {
|
||||
holeFlatCoordinates[i].push(holeFlatCoordinates[i][0]);
|
||||
holeFlatCoordinates[i].push(holeFlatCoordinates[i][1]);
|
||||
}
|
||||
this.drawCoordinates_(holeFlatCoordinates[i], 0,
|
||||
holeFlatCoordinates[i].length, stride);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../Feature.js").default|import("../Feature.js").default} feature Feature.
|
||||
* @param {number=} opt_index Index count.
|
||||
*/
|
||||
setPolygonStyle(feature, opt_index) {
|
||||
const index = opt_index === undefined ? this.indices.length : opt_index;
|
||||
this.startIndices.push(index);
|
||||
this.startIndicesFeature.push(feature);
|
||||
if (this.state_.changed) {
|
||||
this.styleIndices_.push(index);
|
||||
this.state_.changed = false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @return {number} Current index.
|
||||
*/
|
||||
getCurrentIndex() {
|
||||
return this.indices.length;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
**/
|
||||
finish(context) {
|
||||
// create, bind, and populate the vertices buffer
|
||||
this.verticesBuffer = new WebGLBuffer(this.vertices);
|
||||
|
||||
// create, bind, and populate the indices buffer
|
||||
this.indicesBuffer = new WebGLBuffer(this.indices);
|
||||
|
||||
this.startIndices.push(this.indices.length);
|
||||
|
||||
//Clean up, if there is nothing to draw
|
||||
if (this.styleIndices_.length === 0 && this.styles_.length > 0) {
|
||||
this.styles_ = [];
|
||||
}
|
||||
|
||||
this.vertices = null;
|
||||
this.indices = null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getDeleteResourcesFunction(context) {
|
||||
const verticesBuffer = this.verticesBuffer;
|
||||
const indicesBuffer = this.indicesBuffer;
|
||||
return function() {
|
||||
context.deleteBuffer(verticesBuffer);
|
||||
context.deleteBuffer(indicesBuffer);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setUpProgram(gl, context, size, pixelRatio) {
|
||||
// get the program
|
||||
const program = context.getProgram(fragment, vertex);
|
||||
|
||||
// get the locations
|
||||
let locations;
|
||||
if (!this.defaultLocations_) {
|
||||
locations = new Locations(gl, program);
|
||||
this.defaultLocations_ = locations;
|
||||
} else {
|
||||
locations = this.defaultLocations_;
|
||||
}
|
||||
|
||||
context.useProgram(program);
|
||||
|
||||
// enable the vertex attrib arrays
|
||||
gl.enableVertexAttribArray(locations.a_lastPos);
|
||||
gl.vertexAttribPointer(locations.a_lastPos, 2, FLOAT,
|
||||
false, 28, 0);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_position);
|
||||
gl.vertexAttribPointer(locations.a_position, 2, FLOAT,
|
||||
false, 28, 8);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_nextPos);
|
||||
gl.vertexAttribPointer(locations.a_nextPos, 2, FLOAT,
|
||||
false, 28, 16);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_direction);
|
||||
gl.vertexAttribPointer(locations.a_direction, 1, FLOAT,
|
||||
false, 28, 24);
|
||||
|
||||
// Enable renderer specific uniforms.
|
||||
gl.uniform2fv(locations.u_size, size);
|
||||
gl.uniform1f(locations.u_pixelRatio, pixelRatio);
|
||||
|
||||
return locations;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
shutDownProgram(gl, locations) {
|
||||
gl.disableVertexAttribArray(locations.a_lastPos);
|
||||
gl.disableVertexAttribArray(locations.a_position);
|
||||
gl.disableVertexAttribArray(locations.a_nextPos);
|
||||
gl.disableVertexAttribArray(locations.a_direction);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawReplay(gl, context, skippedFeaturesHash, hitDetection) {
|
||||
//Save GL parameters.
|
||||
const tmpDepthFunc = /** @type {number} */ (gl.getParameter(gl.DEPTH_FUNC));
|
||||
const tmpDepthMask = /** @type {boolean} */ (gl.getParameter(gl.DEPTH_WRITEMASK));
|
||||
|
||||
if (!hitDetection) {
|
||||
gl.enable(gl.DEPTH_TEST);
|
||||
gl.depthMask(true);
|
||||
gl.depthFunc(gl.NOTEQUAL);
|
||||
}
|
||||
|
||||
if (!isEmpty(skippedFeaturesHash)) {
|
||||
this.drawReplaySkipping_(gl, context, skippedFeaturesHash);
|
||||
} else {
|
||||
//Draw by style groups to minimize drawElements() calls.
|
||||
let i, start, end, nextStyle;
|
||||
end = this.startIndices[this.startIndices.length - 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
start = this.styleIndices_[i];
|
||||
nextStyle = this.styles_[i];
|
||||
this.setStrokeStyle_(gl, nextStyle[0], nextStyle[1], nextStyle[2]);
|
||||
this.drawElements(gl, context, start, end);
|
||||
gl.clear(gl.DEPTH_BUFFER_BIT);
|
||||
end = start;
|
||||
}
|
||||
}
|
||||
if (!hitDetection) {
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
gl.clear(gl.DEPTH_BUFFER_BIT);
|
||||
//Restore GL parameters.
|
||||
gl.depthMask(tmpDepthMask);
|
||||
gl.depthFunc(tmpDepthFunc);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object} skippedFeaturesHash Ids of features to skip.
|
||||
*/
|
||||
drawReplaySkipping_(gl, context, skippedFeaturesHash) {
|
||||
let i, start, end, nextStyle, groupStart, feature, featureIndex, featureStart;
|
||||
featureIndex = this.startIndices.length - 2;
|
||||
end = start = this.startIndices[featureIndex + 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
nextStyle = this.styles_[i];
|
||||
this.setStrokeStyle_(gl, nextStyle[0], nextStyle[1], nextStyle[2]);
|
||||
groupStart = this.styleIndices_[i];
|
||||
|
||||
while (featureIndex >= 0 &&
|
||||
this.startIndices[featureIndex] >= groupStart) {
|
||||
featureStart = this.startIndices[featureIndex];
|
||||
feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)]) {
|
||||
if (start !== end) {
|
||||
this.drawElements(gl, context, start, end);
|
||||
gl.clear(gl.DEPTH_BUFFER_BIT);
|
||||
}
|
||||
end = featureStart;
|
||||
}
|
||||
featureIndex--;
|
||||
start = featureStart;
|
||||
}
|
||||
if (start !== end) {
|
||||
this.drawElements(gl, context, start, end);
|
||||
gl.clear(gl.DEPTH_BUFFER_BIT);
|
||||
}
|
||||
start = end = groupStart;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawHitDetectionReplayOneByOne(gl, context, skippedFeaturesHash, featureCallback, opt_hitExtent) {
|
||||
let i, start, end, nextStyle, groupStart, feature, featureIndex;
|
||||
featureIndex = this.startIndices.length - 2;
|
||||
end = this.startIndices[featureIndex + 1];
|
||||
for (i = this.styleIndices_.length - 1; i >= 0; --i) {
|
||||
nextStyle = this.styles_[i];
|
||||
this.setStrokeStyle_(gl, nextStyle[0], nextStyle[1], nextStyle[2]);
|
||||
groupStart = this.styleIndices_[i];
|
||||
|
||||
while (featureIndex >= 0 &&
|
||||
this.startIndices[featureIndex] >= groupStart) {
|
||||
start = this.startIndices[featureIndex];
|
||||
feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)] === undefined &&
|
||||
feature.getGeometry() &&
|
||||
(opt_hitExtent === undefined || intersects(
|
||||
/** @type {Array<number>} */ (opt_hitExtent),
|
||||
feature.getGeometry().getExtent()))) {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
this.drawElements(gl, context, start, end);
|
||||
|
||||
const result = featureCallback(feature);
|
||||
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
|
||||
}
|
||||
featureIndex--;
|
||||
end = start;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {Array<number>} color Color.
|
||||
* @param {number} lineWidth Line width.
|
||||
* @param {number} miterLimit Miter limit.
|
||||
*/
|
||||
setStrokeStyle_(gl, color, lineWidth, miterLimit) {
|
||||
gl.uniform4fv(this.defaultLocations_.u_color, color);
|
||||
gl.uniform1f(this.defaultLocations_.u_lineWidth, lineWidth);
|
||||
gl.uniform1f(this.defaultLocations_.u_miterLimit, miterLimit);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setFillStrokeStyle(fillStyle, strokeStyle) {
|
||||
const strokeStyleLineCap = strokeStyle.getLineCap();
|
||||
this.state_.lineCap = strokeStyleLineCap !== undefined ?
|
||||
strokeStyleLineCap : DEFAULT_LINECAP;
|
||||
const strokeStyleLineDash = strokeStyle.getLineDash();
|
||||
this.state_.lineDash = strokeStyleLineDash ?
|
||||
strokeStyleLineDash : DEFAULT_LINEDASH;
|
||||
const strokeStyleLineDashOffset = strokeStyle.getLineDashOffset();
|
||||
this.state_.lineDashOffset = strokeStyleLineDashOffset ?
|
||||
strokeStyleLineDashOffset : DEFAULT_LINEDASHOFFSET;
|
||||
const strokeStyleLineJoin = strokeStyle.getLineJoin();
|
||||
this.state_.lineJoin = strokeStyleLineJoin !== undefined ?
|
||||
strokeStyleLineJoin : DEFAULT_LINEJOIN;
|
||||
let strokeStyleColor = strokeStyle.getColor();
|
||||
if (!(strokeStyleColor instanceof CanvasGradient) &&
|
||||
!(strokeStyleColor instanceof CanvasPattern)) {
|
||||
strokeStyleColor = asArray(strokeStyleColor).map(function(c, i) {
|
||||
return i != 3 ? c / 255 : c;
|
||||
}) || DEFAULT_STROKESTYLE;
|
||||
} else {
|
||||
strokeStyleColor = DEFAULT_STROKESTYLE;
|
||||
}
|
||||
let strokeStyleWidth = strokeStyle.getWidth();
|
||||
strokeStyleWidth = strokeStyleWidth !== undefined ?
|
||||
strokeStyleWidth : DEFAULT_LINEWIDTH;
|
||||
let strokeStyleMiterLimit = strokeStyle.getMiterLimit();
|
||||
strokeStyleMiterLimit = strokeStyleMiterLimit !== undefined ?
|
||||
strokeStyleMiterLimit : DEFAULT_MITERLIMIT;
|
||||
if (!this.state_.strokeColor || !equals(this.state_.strokeColor, strokeStyleColor) ||
|
||||
this.state_.lineWidth !== strokeStyleWidth || this.state_.miterLimit !== strokeStyleMiterLimit) {
|
||||
this.state_.changed = true;
|
||||
this.state_.strokeColor = strokeStyleColor;
|
||||
this.state_.lineWidth = strokeStyleWidth;
|
||||
this.state_.miterLimit = strokeStyleMiterLimit;
|
||||
this.styles_.push([strokeStyleColor, strokeStyleWidth, strokeStyleMiterLimit]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLLineStringReplay;
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,369 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/Replay
|
||||
*/
|
||||
import {abstract} from '../../util.js';
|
||||
import {getCenter} from '../../extent.js';
|
||||
import VectorContext from '../VectorContext.js';
|
||||
import {
|
||||
create as createTransform,
|
||||
reset as resetTransform,
|
||||
rotate as rotateTransform,
|
||||
scale as scaleTransform,
|
||||
translate as translateTransform
|
||||
} from '../../transform.js';
|
||||
import {create, fromTransform} from '../../vec/mat4.js';
|
||||
import {ARRAY_BUFFER, ELEMENT_ARRAY_BUFFER, TRIANGLES,
|
||||
UNSIGNED_INT, UNSIGNED_SHORT} from '../../webgl.js';
|
||||
|
||||
class WebGLReplay extends VectorContext {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super();
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {number}
|
||||
*/
|
||||
this.tolerance = tolerance;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @const
|
||||
* @type {import("../../extent.js").Extent}
|
||||
*/
|
||||
this.maxExtent = maxExtent;
|
||||
|
||||
/**
|
||||
* The origin of the coordinate system for the point coordinates sent to
|
||||
* the GPU. To eliminate jitter caused by precision problems in the GPU
|
||||
* we use the "Rendering Relative to Eye" technique described in the "3D
|
||||
* Engine Design for Virtual Globes" book.
|
||||
* @protected
|
||||
* @type {import("../../coordinate.js").Coordinate}
|
||||
*/
|
||||
this.origin = getCenter(maxExtent);
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../transform.js").Transform}
|
||||
*/
|
||||
this.projectionMatrix_ = createTransform();
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../transform.js").Transform}
|
||||
*/
|
||||
this.offsetRotateMatrix_ = createTransform();
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {import("../../transform.js").Transform}
|
||||
*/
|
||||
this.offsetScaleMatrix_ = createTransform();
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.tmpMat4_ = create();
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.indices = [];
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {?import("../../webgl/Buffer.js").default}
|
||||
*/
|
||||
this.indicesBuffer = null;
|
||||
|
||||
/**
|
||||
* Start index per feature (the index).
|
||||
* @protected
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.startIndices = [];
|
||||
|
||||
/**
|
||||
* Start index per feature (the feature).
|
||||
* @protected
|
||||
* @type {Array<import("../../Feature.js").default|import("../Feature.js").default>}
|
||||
*/
|
||||
this.startIndicesFeature = [];
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
this.vertices = [];
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {?import("../../webgl/Buffer.js").default}
|
||||
*/
|
||||
this.verticesBuffer = null;
|
||||
|
||||
/**
|
||||
* Optional parameter for PolygonReplay instances.
|
||||
* @protected
|
||||
* @type {import("./LineStringReplay.js").default|undefined}
|
||||
*/
|
||||
this.lineStringReplay = undefined;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @param {import("../../webgl/Context.js").default} context WebGL context.
|
||||
* @return {function()} Delete resources function.
|
||||
*/
|
||||
getDeleteResourcesFunction(context) {
|
||||
return abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
*/
|
||||
finish(context) {
|
||||
abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @return {import("./circlereplay/defaultshader/Locations.js").default|
|
||||
import("./linestringreplay/defaultshader/Locations.js").default|
|
||||
import("./polygonreplay/defaultshader/Locations.js").default|
|
||||
import("./texturereplay/defaultshader/Locations.js").default} Locations.
|
||||
*/
|
||||
setUpProgram(gl, context, size, pixelRatio) {
|
||||
return abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("./circlereplay/defaultshader/Locations.js").default|
|
||||
import("./linestringreplay/defaultshader/Locations.js").default|
|
||||
import("./polygonreplay/defaultshader/Locations.js").default|
|
||||
import("./texturereplay/defaultshader/Locations.js").default} locations Locations.
|
||||
*/
|
||||
shutDownProgram(gl, locations) {
|
||||
abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {boolean} hitDetection Hit detection mode.
|
||||
*/
|
||||
drawReplay(gl, context, skippedFeaturesHash, hitDetection) {
|
||||
abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} featureCallback Feature callback.
|
||||
* @param {import("../../extent.js").Extent=} opt_hitExtent Hit extent: Only features intersecting this extent are checked.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
drawHitDetectionReplayOneByOne(gl, context, skippedFeaturesHash, featureCallback, opt_hitExtent) {
|
||||
return abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} featureCallback Feature callback.
|
||||
* @param {boolean} oneByOne Draw features one-by-one for the hit-detecion.
|
||||
* @param {import("../../extent.js").Extent=} opt_hitExtent Hit extent: Only features intersecting this extent are checked.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
drawHitDetectionReplay(gl, context, skippedFeaturesHash, featureCallback, oneByOne, opt_hitExtent) {
|
||||
if (!oneByOne) {
|
||||
// draw all hit-detection features in "once" (by texture group)
|
||||
return this.drawHitDetectionReplayAll(gl, context,
|
||||
skippedFeaturesHash, featureCallback);
|
||||
} else {
|
||||
// draw hit-detection features one by one
|
||||
return this.drawHitDetectionReplayOneByOne(gl, context,
|
||||
skippedFeaturesHash, featureCallback, opt_hitExtent);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} featureCallback Feature callback.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
drawHitDetectionReplayAll(gl, context, skippedFeaturesHash, featureCallback) {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
this.drawReplay(gl, context, skippedFeaturesHash, true);
|
||||
|
||||
const result = featureCallback(null);
|
||||
if (result) {
|
||||
return result;
|
||||
} else {
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @param {number} opacity Global opacity.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} featureCallback Feature callback.
|
||||
* @param {boolean} oneByOne Draw features one-by-one for the hit-detecion.
|
||||
* @param {import("../../extent.js").Extent=} opt_hitExtent Hit extent: Only features intersecting this extent are checked.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
replay(
|
||||
context,
|
||||
center,
|
||||
resolution,
|
||||
rotation,
|
||||
size,
|
||||
pixelRatio,
|
||||
opacity,
|
||||
skippedFeaturesHash,
|
||||
featureCallback,
|
||||
oneByOne,
|
||||
opt_hitExtent
|
||||
) {
|
||||
const gl = context.getGL();
|
||||
let tmpStencil, tmpStencilFunc, tmpStencilMaskVal, tmpStencilRef, tmpStencilMask,
|
||||
tmpStencilOpFail, tmpStencilOpPass, tmpStencilOpZFail;
|
||||
|
||||
if (this.lineStringReplay) {
|
||||
tmpStencil = gl.isEnabled(gl.STENCIL_TEST);
|
||||
tmpStencilFunc = gl.getParameter(gl.STENCIL_FUNC);
|
||||
tmpStencilMaskVal = gl.getParameter(gl.STENCIL_VALUE_MASK);
|
||||
tmpStencilRef = gl.getParameter(gl.STENCIL_REF);
|
||||
tmpStencilMask = gl.getParameter(gl.STENCIL_WRITEMASK);
|
||||
tmpStencilOpFail = gl.getParameter(gl.STENCIL_FAIL);
|
||||
tmpStencilOpPass = gl.getParameter(gl.STENCIL_PASS_DEPTH_PASS);
|
||||
tmpStencilOpZFail = gl.getParameter(gl.STENCIL_PASS_DEPTH_FAIL);
|
||||
|
||||
gl.enable(gl.STENCIL_TEST);
|
||||
gl.clear(gl.STENCIL_BUFFER_BIT);
|
||||
gl.stencilMask(255);
|
||||
gl.stencilFunc(gl.ALWAYS, 1, 255);
|
||||
gl.stencilOp(gl.KEEP, gl.KEEP, gl.REPLACE);
|
||||
|
||||
this.lineStringReplay.replay(context,
|
||||
center, resolution, rotation, size, pixelRatio,
|
||||
opacity, skippedFeaturesHash,
|
||||
featureCallback, oneByOne, opt_hitExtent);
|
||||
|
||||
gl.stencilMask(0);
|
||||
gl.stencilFunc(gl.NOTEQUAL, 1, 255);
|
||||
}
|
||||
|
||||
context.bindBuffer(ARRAY_BUFFER, this.verticesBuffer);
|
||||
|
||||
context.bindBuffer(ELEMENT_ARRAY_BUFFER, this.indicesBuffer);
|
||||
|
||||
const locations = this.setUpProgram(gl, context, size, pixelRatio);
|
||||
|
||||
// set the "uniform" values
|
||||
const projectionMatrix = resetTransform(this.projectionMatrix_);
|
||||
scaleTransform(projectionMatrix, 2 / (resolution * size[0]), 2 / (resolution * size[1]));
|
||||
rotateTransform(projectionMatrix, -rotation);
|
||||
translateTransform(projectionMatrix, -(center[0] - this.origin[0]), -(center[1] - this.origin[1]));
|
||||
|
||||
const offsetScaleMatrix = resetTransform(this.offsetScaleMatrix_);
|
||||
scaleTransform(offsetScaleMatrix, 2 / size[0], 2 / size[1]);
|
||||
|
||||
const offsetRotateMatrix = resetTransform(this.offsetRotateMatrix_);
|
||||
if (rotation !== 0) {
|
||||
rotateTransform(offsetRotateMatrix, -rotation);
|
||||
}
|
||||
|
||||
gl.uniformMatrix4fv(locations.u_projectionMatrix, false,
|
||||
fromTransform(this.tmpMat4_, projectionMatrix));
|
||||
gl.uniformMatrix4fv(locations.u_offsetScaleMatrix, false,
|
||||
fromTransform(this.tmpMat4_, offsetScaleMatrix));
|
||||
gl.uniformMatrix4fv(locations.u_offsetRotateMatrix, false,
|
||||
fromTransform(this.tmpMat4_, offsetRotateMatrix));
|
||||
gl.uniform1f(locations.u_opacity, opacity);
|
||||
|
||||
// draw!
|
||||
let result;
|
||||
if (featureCallback === undefined) {
|
||||
this.drawReplay(gl, context, skippedFeaturesHash, false);
|
||||
} else {
|
||||
// draw feature by feature for the hit-detection
|
||||
result = this.drawHitDetectionReplay(gl, context, skippedFeaturesHash,
|
||||
featureCallback, oneByOne, opt_hitExtent);
|
||||
}
|
||||
|
||||
// disable the vertex attrib arrays
|
||||
this.shutDownProgram(gl, locations);
|
||||
|
||||
if (this.lineStringReplay) {
|
||||
if (!tmpStencil) {
|
||||
gl.disable(gl.STENCIL_TEST);
|
||||
}
|
||||
gl.clear(gl.STENCIL_BUFFER_BIT);
|
||||
gl.stencilFunc(/** @type {number} */ (tmpStencilFunc),
|
||||
/** @type {number} */ (tmpStencilRef), /** @type {number} */ (tmpStencilMaskVal));
|
||||
gl.stencilMask(/** @type {number} */ (tmpStencilMask));
|
||||
gl.stencilOp(/** @type {number} */ (tmpStencilOpFail),
|
||||
/** @type {number} */ (tmpStencilOpZFail), /** @type {number} */ (tmpStencilOpPass));
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {number} start Start index.
|
||||
* @param {number} end End index.
|
||||
*/
|
||||
drawElements(gl, context, start, end) {
|
||||
const elementType = context.hasOESElementIndexUint ?
|
||||
UNSIGNED_INT : UNSIGNED_SHORT;
|
||||
const elementSize = context.hasOESElementIndexUint ? 4 : 2;
|
||||
|
||||
const numItems = end - start;
|
||||
const offsetInBytes = start * elementSize;
|
||||
gl.drawElements(TRIANGLES, numItems, elementType, offsetInBytes);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLReplay;
|
||||
@@ -1,338 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/ReplayGroup
|
||||
*/
|
||||
|
||||
import {numberSafeCompareFunction} from '../../array.js';
|
||||
import {buffer, createOrUpdateFromCoordinate} from '../../extent.js';
|
||||
import {isEmpty} from '../../obj.js';
|
||||
import {ORDER} from '../replay.js';
|
||||
import ReplayGroup from '../BuilderGroup.js';
|
||||
import WebGLCircleReplay from './CircleReplay.js';
|
||||
import WebGLImageReplay from './ImageReplay.js';
|
||||
import WebGLLineStringReplay from './LineStringReplay.js';
|
||||
import WebGLPolygonReplay from './PolygonReplay.js';
|
||||
import WebGLTextReplay from './TextReplay.js';
|
||||
|
||||
/**
|
||||
* @type {Array<number>}
|
||||
*/
|
||||
const HIT_DETECTION_SIZE = [1, 1];
|
||||
|
||||
/**
|
||||
* @type {Object<import("../ReplayType.js").default, typeof import("./Replay.js").default>}
|
||||
*/
|
||||
const BATCH_CONSTRUCTORS = {
|
||||
'Circle': WebGLCircleReplay,
|
||||
'Image': WebGLImageReplay,
|
||||
'LineString': WebGLLineStringReplay,
|
||||
'Polygon': WebGLPolygonReplay,
|
||||
'Text': WebGLTextReplay
|
||||
};
|
||||
|
||||
|
||||
class WebGLReplayGroup extends ReplayGroup {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
* @param {number=} opt_renderBuffer Render buffer.
|
||||
*/
|
||||
constructor(tolerance, maxExtent, opt_renderBuffer) {
|
||||
super();
|
||||
|
||||
/**
|
||||
* @type {import("../../extent.js").Extent}
|
||||
* @private
|
||||
*/
|
||||
this.maxExtent_ = maxExtent;
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
* @private
|
||||
*/
|
||||
this.tolerance_ = tolerance;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @private
|
||||
*/
|
||||
this.renderBuffer_ = opt_renderBuffer;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {!Object<string,
|
||||
* Object<import("../ReplayType.js").default, import("./Replay.js").default>>}
|
||||
*/
|
||||
this.replaysByZIndex_ = {};
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
addDeclutter(group) {
|
||||
return [];
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../webgl/Context.js").default} context WebGL context.
|
||||
* @return {function()} Delete resources function.
|
||||
*/
|
||||
getDeleteResourcesFunction(context) {
|
||||
const functions = [];
|
||||
let zKey;
|
||||
for (zKey in this.replaysByZIndex_) {
|
||||
const replays = this.replaysByZIndex_[zKey];
|
||||
for (const replayKey in replays) {
|
||||
functions.push(
|
||||
replays[replayKey].getDeleteResourcesFunction(context));
|
||||
}
|
||||
}
|
||||
return function() {
|
||||
const length = functions.length;
|
||||
let result;
|
||||
for (let i = 0; i < length; i++) {
|
||||
result = functions[i].apply(this, arguments);
|
||||
}
|
||||
return result;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
*/
|
||||
finish(context) {
|
||||
let zKey;
|
||||
for (zKey in this.replaysByZIndex_) {
|
||||
const replays = this.replaysByZIndex_[zKey];
|
||||
for (const replayKey in replays) {
|
||||
replays[replayKey].finish(context);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getBuilder(zIndex, replayType) {
|
||||
const zIndexKey = zIndex !== undefined ? zIndex.toString() : '0';
|
||||
let replays = this.replaysByZIndex_[zIndexKey];
|
||||
if (replays === undefined) {
|
||||
replays = {};
|
||||
this.replaysByZIndex_[zIndexKey] = replays;
|
||||
}
|
||||
let replay = replays[replayType];
|
||||
if (replay === undefined) {
|
||||
const Constructor = BATCH_CONSTRUCTORS[replayType];
|
||||
replay = new Constructor(this.tolerance_, this.maxExtent_);
|
||||
replays[replayType] = replay;
|
||||
}
|
||||
return replay;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
isEmpty() {
|
||||
return isEmpty(this.replaysByZIndex_);
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @param {number} opacity Global opacity.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
*/
|
||||
replay(
|
||||
context,
|
||||
center,
|
||||
resolution,
|
||||
rotation,
|
||||
size,
|
||||
pixelRatio,
|
||||
opacity,
|
||||
skippedFeaturesHash
|
||||
) {
|
||||
/** @type {Array<number>} */
|
||||
const zs = Object.keys(this.replaysByZIndex_).map(Number);
|
||||
zs.sort(numberSafeCompareFunction);
|
||||
|
||||
let i, ii, j, jj, replays, replay;
|
||||
for (i = 0, ii = zs.length; i < ii; ++i) {
|
||||
replays = this.replaysByZIndex_[zs[i].toString()];
|
||||
for (j = 0, jj = ORDER.length; j < jj; ++j) {
|
||||
replay = replays[ORDER[j]];
|
||||
if (replay !== undefined) {
|
||||
replay.replay(context,
|
||||
center, resolution, rotation, size, pixelRatio,
|
||||
opacity, skippedFeaturesHash,
|
||||
undefined, false);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @param {number} opacity Global opacity.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} featureCallback Feature callback.
|
||||
* @param {boolean} oneByOne Draw features one-by-one for the hit-detecion.
|
||||
* @param {import("../../extent.js").Extent=} opt_hitExtent Hit extent: Only features intersecting
|
||||
* this extent are checked.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
replayHitDetection_(
|
||||
context,
|
||||
center,
|
||||
resolution,
|
||||
rotation,
|
||||
size,
|
||||
pixelRatio,
|
||||
opacity,
|
||||
skippedFeaturesHash,
|
||||
featureCallback,
|
||||
oneByOne,
|
||||
opt_hitExtent
|
||||
) {
|
||||
/** @type {Array<number>} */
|
||||
const zs = Object.keys(this.replaysByZIndex_).map(Number);
|
||||
zs.sort(function(a, b) {
|
||||
return b - a;
|
||||
});
|
||||
|
||||
let i, ii, j, replays, replay, result;
|
||||
for (i = 0, ii = zs.length; i < ii; ++i) {
|
||||
replays = this.replaysByZIndex_[zs[i].toString()];
|
||||
for (j = ORDER.length - 1; j >= 0; --j) {
|
||||
replay = replays[ORDER[j]];
|
||||
if (replay !== undefined) {
|
||||
result = replay.replay(context,
|
||||
center, resolution, rotation, size, pixelRatio, opacity,
|
||||
skippedFeaturesHash, featureCallback, oneByOne, opt_hitExtent);
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../coordinate.js").Coordinate} coordinate Coordinate.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @param {number} opacity Global opacity.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @param {function((import("../../Feature.js").default|import("../Feature.js").default)): T|undefined} callback Feature callback.
|
||||
* @return {T|undefined} Callback result.
|
||||
* @template T
|
||||
*/
|
||||
forEachFeatureAtCoordinate(
|
||||
coordinate,
|
||||
context,
|
||||
center,
|
||||
resolution,
|
||||
rotation,
|
||||
size,
|
||||
pixelRatio,
|
||||
opacity,
|
||||
skippedFeaturesHash,
|
||||
callback
|
||||
) {
|
||||
const gl = context.getGL();
|
||||
gl.bindFramebuffer(
|
||||
gl.FRAMEBUFFER, context.getHitDetectionFramebuffer());
|
||||
|
||||
|
||||
/**
|
||||
* @type {import("../../extent.js").Extent}
|
||||
*/
|
||||
let hitExtent;
|
||||
if (this.renderBuffer_ !== undefined) {
|
||||
// build an extent around the coordinate, so that only features that
|
||||
// intersect this extent are checked
|
||||
hitExtent = buffer(createOrUpdateFromCoordinate(coordinate), resolution * this.renderBuffer_);
|
||||
}
|
||||
|
||||
return this.replayHitDetection_(context,
|
||||
coordinate, resolution, rotation, HIT_DETECTION_SIZE,
|
||||
pixelRatio, opacity, skippedFeaturesHash,
|
||||
/**
|
||||
* @param {import("../../Feature.js").default|import("../Feature.js").default} feature Feature.
|
||||
* @return {?} Callback result.
|
||||
*/
|
||||
function(feature) {
|
||||
const imageData = new Uint8Array(4);
|
||||
gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
|
||||
|
||||
if (imageData[3] > 0) {
|
||||
const result = callback(feature);
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}, true, hitExtent);
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {import("../../coordinate.js").Coordinate} coordinate Coordinate.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {import("../../coordinate.js").Coordinate} center Center.
|
||||
* @param {number} resolution Resolution.
|
||||
* @param {number} rotation Rotation.
|
||||
* @param {import("../../size.js").Size} size Size.
|
||||
* @param {number} pixelRatio Pixel ratio.
|
||||
* @param {number} opacity Global opacity.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features to skip.
|
||||
* @return {boolean} Is there a feature at the given coordinate?
|
||||
*/
|
||||
hasFeatureAtCoordinate(
|
||||
coordinate,
|
||||
context,
|
||||
center,
|
||||
resolution,
|
||||
rotation,
|
||||
size,
|
||||
pixelRatio,
|
||||
opacity,
|
||||
skippedFeaturesHash
|
||||
) {
|
||||
const gl = context.getGL();
|
||||
gl.bindFramebuffer(
|
||||
gl.FRAMEBUFFER, context.getHitDetectionFramebuffer());
|
||||
|
||||
const hasFeature = this.replayHitDetection_(context,
|
||||
coordinate, resolution, rotation, HIT_DETECTION_SIZE,
|
||||
pixelRatio, opacity, skippedFeaturesHash,
|
||||
/**
|
||||
* @param {import("../../Feature.js").default|import("../Feature.js").default} feature Feature.
|
||||
* @return {boolean} Is there a feature?
|
||||
*/
|
||||
function(feature) {
|
||||
const imageData = new Uint8Array(4);
|
||||
gl.readPixels(0, 0, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
|
||||
return imageData[3] > 0;
|
||||
}, false);
|
||||
|
||||
return hasFeature !== undefined;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLReplayGroup;
|
||||
@@ -1,458 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/TextReplay
|
||||
*/
|
||||
import {getUid} from '../../util.js';
|
||||
import {asColorLike} from '../../colorlike.js';
|
||||
import {createCanvasContext2D} from '../../dom.js';
|
||||
import GeometryType from '../../geom/GeometryType.js';
|
||||
import {CANVAS_LINE_DASH} from '../../has.js';
|
||||
import {TEXT_ALIGN} from '../replay.js';
|
||||
import {DEFAULT_FILLSTYLE, DEFAULT_FONT, DEFAULT_LINECAP, DEFAULT_LINEDASH,
|
||||
DEFAULT_LINEDASHOFFSET, DEFAULT_LINEJOIN, DEFAULT_LINEWIDTH, DEFAULT_MITERLIMIT,
|
||||
DEFAULT_STROKESTYLE, DEFAULT_TEXTALIGN, DEFAULT_TEXTBASELINE} from '../webgl.js';
|
||||
import WebGLTextureReplay from './TextureReplay.js';
|
||||
import AtlasManager from '../../style/AtlasManager.js';
|
||||
import WebGLBuffer from '../../webgl/Buffer.js';
|
||||
|
||||
/**
|
||||
* @typedef {Object} GlyphAtlas
|
||||
* @property {import("../../style/AtlasManager.js").default} atlas
|
||||
* @property {Object<string, number>} width
|
||||
* @property {number} height
|
||||
*/
|
||||
|
||||
|
||||
class WebGLTextReplay extends WebGLTextureReplay {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super(tolerance, maxExtent);
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<HTMLCanvasElement>}
|
||||
*/
|
||||
this.images_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Array<WebGLTexture>}
|
||||
*/
|
||||
this.textures_ = [];
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {HTMLCanvasElement}
|
||||
*/
|
||||
this.measureCanvas_ = createCanvasContext2D(0, 0).canvas;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {{strokeColor: (import("../../colorlike.js").ColorLike|null),
|
||||
* lineCap: (string|undefined),
|
||||
* lineDash: Array<number>,
|
||||
* lineDashOffset: (number|undefined),
|
||||
* lineJoin: (string|undefined),
|
||||
* lineWidth: number,
|
||||
* miterLimit: (number|undefined),
|
||||
* fillColor: (import("../../colorlike.js").ColorLike|null),
|
||||
* font: (string|undefined),
|
||||
* scale: (number|undefined)}}
|
||||
*/
|
||||
this.state_ = {
|
||||
strokeColor: null,
|
||||
lineCap: undefined,
|
||||
lineDash: null,
|
||||
lineDashOffset: undefined,
|
||||
lineJoin: undefined,
|
||||
lineWidth: 0,
|
||||
miterLimit: undefined,
|
||||
fillColor: null,
|
||||
font: undefined,
|
||||
scale: undefined
|
||||
};
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {string}
|
||||
*/
|
||||
this.text_ = '';
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.textAlign_ = undefined;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.textBaseline_ = undefined;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.offsetX_ = undefined;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.offsetY_ = undefined;
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {Object<string, GlyphAtlas>}
|
||||
*/
|
||||
this.atlases_ = {};
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @type {GlyphAtlas|undefined}
|
||||
*/
|
||||
this.currAtlas_ = undefined;
|
||||
|
||||
this.scale = 1;
|
||||
|
||||
this.opacity = 1;
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawText(geometry, feature) {
|
||||
if (this.text_) {
|
||||
let flatCoordinates = null;
|
||||
const offset = 0;
|
||||
let end = 2;
|
||||
let stride = 2;
|
||||
switch (geometry.getType()) {
|
||||
case GeometryType.POINT:
|
||||
case GeometryType.MULTI_POINT:
|
||||
flatCoordinates = geometry.getFlatCoordinates();
|
||||
end = flatCoordinates.length;
|
||||
stride = geometry.getStride();
|
||||
break;
|
||||
case GeometryType.CIRCLE:
|
||||
flatCoordinates = /** @type {import("../../geom/Circle.js").default} */ (geometry).getCenter();
|
||||
break;
|
||||
case GeometryType.LINE_STRING:
|
||||
flatCoordinates = /** @type {import("../../geom/LineString.js").default} */ (geometry).getFlatMidpoint();
|
||||
break;
|
||||
case GeometryType.MULTI_LINE_STRING:
|
||||
flatCoordinates = /** @type {import("../../geom/MultiLineString.js").default} */ (geometry).getFlatMidpoints();
|
||||
end = flatCoordinates.length;
|
||||
break;
|
||||
case GeometryType.POLYGON:
|
||||
flatCoordinates = /** @type {import("../../geom/Polygon.js").default} */ (geometry).getFlatInteriorPoint();
|
||||
break;
|
||||
case GeometryType.MULTI_POLYGON:
|
||||
flatCoordinates = /** @type {import("../../geom/MultiPolygon.js").default} */ (geometry).getFlatInteriorPoints();
|
||||
end = flatCoordinates.length;
|
||||
break;
|
||||
default:
|
||||
}
|
||||
this.startIndices.push(this.indices.length);
|
||||
this.startIndicesFeature.push(feature);
|
||||
|
||||
const glyphAtlas = this.currAtlas_;
|
||||
const lines = this.text_.split('\n');
|
||||
const textSize = this.getTextSize_(lines);
|
||||
let i, ii, j, jj, currX, currY, charArr, charInfo;
|
||||
const anchorX = Math.round(textSize[0] * this.textAlign_ - this.offsetX_);
|
||||
const anchorY = Math.round(textSize[1] * this.textBaseline_ - this.offsetY_);
|
||||
const lineWidth = (this.state_.lineWidth / 2) * this.state_.scale;
|
||||
|
||||
for (i = 0, ii = lines.length; i < ii; ++i) {
|
||||
currX = 0;
|
||||
currY = glyphAtlas.height * i;
|
||||
charArr = lines[i].split('');
|
||||
|
||||
for (j = 0, jj = charArr.length; j < jj; ++j) {
|
||||
charInfo = glyphAtlas.atlas.getInfo(charArr[j]);
|
||||
|
||||
if (charInfo) {
|
||||
const image = charInfo.image;
|
||||
|
||||
this.anchorX = anchorX - currX;
|
||||
this.anchorY = anchorY - currY;
|
||||
this.originX = j === 0 ? charInfo.offsetX - lineWidth : charInfo.offsetX;
|
||||
this.originY = charInfo.offsetY;
|
||||
this.height = glyphAtlas.height;
|
||||
this.width = j === 0 || j === charArr.length - 1 ?
|
||||
glyphAtlas.width[charArr[j]] + lineWidth : glyphAtlas.width[charArr[j]];
|
||||
this.imageHeight = image.height;
|
||||
this.imageWidth = image.width;
|
||||
|
||||
if (this.images_.length === 0) {
|
||||
this.images_.push(image);
|
||||
} else {
|
||||
const currentImage = this.images_[this.images_.length - 1];
|
||||
if (getUid(currentImage) != getUid(image)) {
|
||||
this.groupIndices.push(this.indices.length);
|
||||
this.images_.push(image);
|
||||
}
|
||||
}
|
||||
|
||||
this.drawText_(flatCoordinates, offset, end, stride);
|
||||
}
|
||||
currX += this.width;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {Array<string>} lines Label to draw split to lines.
|
||||
* @return {Array<number>} Size of the label in pixels.
|
||||
*/
|
||||
getTextSize_(lines) {
|
||||
const self = this;
|
||||
const glyphAtlas = this.currAtlas_;
|
||||
const textHeight = lines.length * glyphAtlas.height;
|
||||
//Split every line to an array of chars, sum up their width, and select the longest.
|
||||
const textWidth = lines.map(function(str) {
|
||||
let sum = 0;
|
||||
for (let i = 0, ii = str.length; i < ii; ++i) {
|
||||
const curr = str[i];
|
||||
if (!glyphAtlas.width[curr]) {
|
||||
self.addCharToAtlas_(curr);
|
||||
}
|
||||
sum += glyphAtlas.width[curr] ? glyphAtlas.width[curr] : 0;
|
||||
}
|
||||
return sum;
|
||||
}).reduce(function(max, curr) {
|
||||
return Math.max(max, curr);
|
||||
});
|
||||
|
||||
return [textWidth, textHeight];
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {number} offset Offset.
|
||||
* @param {number} end End.
|
||||
* @param {number} stride Stride.
|
||||
*/
|
||||
drawText_(flatCoordinates, offset, end, stride) {
|
||||
for (let i = offset, ii = end; i < ii; i += stride) {
|
||||
this.drawCoordinates(flatCoordinates, offset, end, stride);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {string} char Character.
|
||||
*/
|
||||
addCharToAtlas_(char) {
|
||||
if (char.length === 1) {
|
||||
const glyphAtlas = this.currAtlas_;
|
||||
const state = this.state_;
|
||||
const mCtx = this.measureCanvas_.getContext('2d');
|
||||
mCtx.font = state.font;
|
||||
const width = Math.ceil(mCtx.measureText(char).width * state.scale);
|
||||
|
||||
const info = glyphAtlas.atlas.add(char, width, glyphAtlas.height,
|
||||
function(ctx, x, y) {
|
||||
//Parameterize the canvas
|
||||
ctx.font = /** @type {string} */ (state.font);
|
||||
ctx.fillStyle = state.fillColor;
|
||||
ctx.strokeStyle = state.strokeColor;
|
||||
ctx.lineWidth = state.lineWidth;
|
||||
ctx.lineCap = /** @type {CanvasLineCap} */ (state.lineCap);
|
||||
ctx.lineJoin = /** @type {CanvasLineJoin} */ (state.lineJoin);
|
||||
ctx.miterLimit = /** @type {number} */ (state.miterLimit);
|
||||
ctx.textAlign = 'left';
|
||||
ctx.textBaseline = 'top';
|
||||
if (CANVAS_LINE_DASH && state.lineDash) {
|
||||
//FIXME: use pixelRatio
|
||||
ctx.setLineDash(state.lineDash);
|
||||
ctx.lineDashOffset = /** @type {number} */ (state.lineDashOffset);
|
||||
}
|
||||
if (state.scale !== 1) {
|
||||
//FIXME: use pixelRatio
|
||||
ctx.setTransform(/** @type {number} */ (state.scale), 0, 0,
|
||||
/** @type {number} */ (state.scale), 0, 0);
|
||||
}
|
||||
|
||||
//Draw the character on the canvas
|
||||
if (state.strokeColor) {
|
||||
ctx.strokeText(char, x, y);
|
||||
}
|
||||
if (state.fillColor) {
|
||||
ctx.fillText(char, x, y);
|
||||
}
|
||||
});
|
||||
|
||||
if (info) {
|
||||
glyphAtlas.width[char] = width;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
finish(context) {
|
||||
const gl = context.getGL();
|
||||
|
||||
this.groupIndices.push(this.indices.length);
|
||||
this.hitDetectionGroupIndices = this.groupIndices;
|
||||
|
||||
// create, bind, and populate the vertices buffer
|
||||
this.verticesBuffer = new WebGLBuffer(this.vertices);
|
||||
|
||||
// create, bind, and populate the indices buffer
|
||||
this.indicesBuffer = new WebGLBuffer(this.indices);
|
||||
|
||||
// create textures
|
||||
/** @type {Object<string, WebGLTexture>} */
|
||||
const texturePerImage = {};
|
||||
|
||||
this.createTextures(this.textures_, this.images_, texturePerImage, gl);
|
||||
|
||||
this.state_ = {
|
||||
strokeColor: null,
|
||||
lineCap: undefined,
|
||||
lineDash: null,
|
||||
lineDashOffset: undefined,
|
||||
lineJoin: undefined,
|
||||
lineWidth: 0,
|
||||
miterLimit: undefined,
|
||||
fillColor: null,
|
||||
font: undefined,
|
||||
scale: undefined
|
||||
};
|
||||
this.text_ = '';
|
||||
this.textAlign_ = undefined;
|
||||
this.textBaseline_ = undefined;
|
||||
this.offsetX_ = undefined;
|
||||
this.offsetY_ = undefined;
|
||||
this.images_ = null;
|
||||
this.atlases_ = {};
|
||||
this.currAtlas_ = undefined;
|
||||
super.finish(context);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setTextStyle(textStyle) {
|
||||
const state = this.state_;
|
||||
const textFillStyle = textStyle.getFill();
|
||||
const textStrokeStyle = textStyle.getStroke();
|
||||
if (!textStyle || !textStyle.getText() || (!textFillStyle && !textStrokeStyle)) {
|
||||
this.text_ = '';
|
||||
} else {
|
||||
if (!textFillStyle) {
|
||||
state.fillColor = null;
|
||||
} else {
|
||||
const textFillStyleColor = textFillStyle.getColor();
|
||||
state.fillColor = asColorLike(textFillStyleColor ?
|
||||
textFillStyleColor : DEFAULT_FILLSTYLE);
|
||||
}
|
||||
if (!textStrokeStyle) {
|
||||
state.strokeColor = null;
|
||||
state.lineWidth = 0;
|
||||
} else {
|
||||
const textStrokeStyleColor = textStrokeStyle.getColor();
|
||||
state.strokeColor = asColorLike(textStrokeStyleColor ?
|
||||
textStrokeStyleColor : DEFAULT_STROKESTYLE);
|
||||
state.lineWidth = textStrokeStyle.getWidth() || DEFAULT_LINEWIDTH;
|
||||
state.lineCap = textStrokeStyle.getLineCap() || DEFAULT_LINECAP;
|
||||
state.lineDashOffset = textStrokeStyle.getLineDashOffset() || DEFAULT_LINEDASHOFFSET;
|
||||
state.lineJoin = textStrokeStyle.getLineJoin() || DEFAULT_LINEJOIN;
|
||||
state.miterLimit = textStrokeStyle.getMiterLimit() || DEFAULT_MITERLIMIT;
|
||||
const lineDash = textStrokeStyle.getLineDash();
|
||||
state.lineDash = lineDash ? lineDash.slice() : DEFAULT_LINEDASH;
|
||||
}
|
||||
state.font = textStyle.getFont() || DEFAULT_FONT;
|
||||
state.scale = textStyle.getScale() || 1;
|
||||
this.text_ = /** @type {string} */ (textStyle.getText());
|
||||
const textAlign = TEXT_ALIGN[textStyle.getTextAlign()];
|
||||
const textBaseline = TEXT_ALIGN[textStyle.getTextBaseline()];
|
||||
this.textAlign_ = textAlign === undefined ?
|
||||
DEFAULT_TEXTALIGN : textAlign;
|
||||
this.textBaseline_ = textBaseline === undefined ?
|
||||
DEFAULT_TEXTBASELINE : textBaseline;
|
||||
this.offsetX_ = textStyle.getOffsetX() || 0;
|
||||
this.offsetY_ = textStyle.getOffsetY() || 0;
|
||||
this.rotateWithView = !!textStyle.getRotateWithView();
|
||||
this.rotation = textStyle.getRotation() || 0;
|
||||
|
||||
this.currAtlas_ = this.getAtlas_(state);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {Object} state Font attributes.
|
||||
* @return {GlyphAtlas} Glyph atlas.
|
||||
*/
|
||||
getAtlas_(state) {
|
||||
let params = [];
|
||||
for (const i in state) {
|
||||
if (state[i] || state[i] === 0) {
|
||||
if (Array.isArray(state[i])) {
|
||||
params = params.concat(state[i]);
|
||||
} else {
|
||||
params.push(state[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
const hash = this.calculateHash_(params);
|
||||
if (!this.atlases_[hash]) {
|
||||
const mCtx = this.measureCanvas_.getContext('2d');
|
||||
mCtx.font = state.font;
|
||||
const height = Math.ceil((mCtx.measureText('M').width * 1.5 +
|
||||
state.lineWidth / 2) * state.scale);
|
||||
|
||||
this.atlases_[hash] = {
|
||||
atlas: new AtlasManager({
|
||||
space: state.lineWidth + 1
|
||||
}),
|
||||
width: {},
|
||||
height: height
|
||||
};
|
||||
}
|
||||
return this.atlases_[hash];
|
||||
}
|
||||
|
||||
/**
|
||||
* @private
|
||||
* @param {Array<string|number>} params Array of parameters.
|
||||
* @return {string} Hash string.
|
||||
*/
|
||||
calculateHash_(params) {
|
||||
//TODO: Create a more performant, reliable, general hash function.
|
||||
let hash = '';
|
||||
for (let i = 0, ii = params.length; i < ii; ++i) {
|
||||
hash += params[i];
|
||||
}
|
||||
return hash;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getTextures(opt_all) {
|
||||
return this.textures_;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getHitDetectionTextures() {
|
||||
return this.textures_;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLTextReplay;
|
||||
@@ -1,480 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/TextureReplay
|
||||
*/
|
||||
import {abstract, getUid} from '../../util.js';
|
||||
import {intersects} from '../../extent.js';
|
||||
import {isEmpty} from '../../obj.js';
|
||||
import {fragment, vertex} from './texturereplay/defaultshader.js';
|
||||
import Locations from './texturereplay/defaultshader/Locations.js';
|
||||
import WebGLReplay from './Replay.js';
|
||||
import {CLAMP_TO_EDGE, FLOAT, TEXTURE_2D} from '../../webgl.js';
|
||||
import {createTexture} from '../../webgl/Context.js';
|
||||
|
||||
class WebGLTextureReplay extends WebGLReplay {
|
||||
/**
|
||||
* @param {number} tolerance Tolerance.
|
||||
* @param {import("../../extent.js").Extent} maxExtent Max extent.
|
||||
*/
|
||||
constructor(tolerance, maxExtent) {
|
||||
super(tolerance, maxExtent);
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.anchorX = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.anchorY = undefined;
|
||||
|
||||
/**
|
||||
* @type {Array<number>}
|
||||
* @protected
|
||||
*/
|
||||
this.groupIndices = [];
|
||||
|
||||
/**
|
||||
* @type {Array<number>}
|
||||
* @protected
|
||||
*/
|
||||
this.hitDetectionGroupIndices = [];
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.height = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.imageHeight = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.imageWidth = undefined;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {import("./texturereplay/defaultshader/Locations.js").default}
|
||||
*/
|
||||
this.defaultLocations = null;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.opacity = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.originX = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.originY = undefined;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {boolean|undefined}
|
||||
*/
|
||||
this.rotateWithView = undefined;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.rotation = undefined;
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @type {number|undefined}
|
||||
*/
|
||||
this.scale = undefined;
|
||||
|
||||
/**
|
||||
* @type {number|undefined}
|
||||
* @protected
|
||||
*/
|
||||
this.width = undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
getDeleteResourcesFunction(context) {
|
||||
const verticesBuffer = this.verticesBuffer;
|
||||
const indicesBuffer = this.indicesBuffer;
|
||||
const textures = this.getTextures(true);
|
||||
const gl = context.getGL();
|
||||
return function() {
|
||||
if (!gl.isContextLost()) {
|
||||
let i, ii;
|
||||
for (i = 0, ii = textures.length; i < ii; ++i) {
|
||||
gl.deleteTexture(textures[i]);
|
||||
}
|
||||
}
|
||||
context.deleteBuffer(verticesBuffer);
|
||||
context.deleteBuffer(indicesBuffer);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Array<number>} flatCoordinates Flat coordinates.
|
||||
* @param {number} offset Offset.
|
||||
* @param {number} end End.
|
||||
* @param {number} stride Stride.
|
||||
* @return {number} My end.
|
||||
* @protected
|
||||
*/
|
||||
drawCoordinates(flatCoordinates, offset, end, stride) {
|
||||
const anchorX = /** @type {number} */ (this.anchorX);
|
||||
const anchorY = /** @type {number} */ (this.anchorY);
|
||||
const height = /** @type {number} */ (this.height);
|
||||
const imageHeight = /** @type {number} */ (this.imageHeight);
|
||||
const imageWidth = /** @type {number} */ (this.imageWidth);
|
||||
const opacity = /** @type {number} */ (this.opacity);
|
||||
const originX = /** @type {number} */ (this.originX);
|
||||
const originY = /** @type {number} */ (this.originY);
|
||||
const rotateWithView = this.rotateWithView ? 1.0 : 0.0;
|
||||
// this.rotation_ is anti-clockwise, but rotation is clockwise
|
||||
const rotation = /** @type {number} */ (-this.rotation);
|
||||
const scale = /** @type {number} */ (this.scale);
|
||||
const width = /** @type {number} */ (this.width);
|
||||
const cos = Math.cos(rotation);
|
||||
const sin = Math.sin(rotation);
|
||||
let numIndices = this.indices.length;
|
||||
let numVertices = this.vertices.length;
|
||||
let i, n, offsetX, offsetY, x, y;
|
||||
for (i = offset; i < end; i += stride) {
|
||||
x = flatCoordinates[i] - this.origin[0];
|
||||
y = flatCoordinates[i + 1] - this.origin[1];
|
||||
|
||||
// There are 4 vertices per [x, y] point, one for each corner of the
|
||||
// rectangle we're going to draw. We'd use 1 vertex per [x, y] point if
|
||||
// WebGL supported Geometry Shaders (which can emit new vertices), but that
|
||||
// is not currently the case.
|
||||
//
|
||||
// And each vertex includes 8 values: the x and y coordinates, the x and
|
||||
// y offsets used to calculate the position of the corner, the u and
|
||||
// v texture coordinates for the corner, the opacity, and whether the
|
||||
// the image should be rotated with the view (rotateWithView).
|
||||
|
||||
n = numVertices / 8;
|
||||
|
||||
// bottom-left corner
|
||||
offsetX = -scale * anchorX;
|
||||
offsetY = -scale * (height - anchorY);
|
||||
this.vertices[numVertices++] = x;
|
||||
this.vertices[numVertices++] = y;
|
||||
this.vertices[numVertices++] = offsetX * cos - offsetY * sin;
|
||||
this.vertices[numVertices++] = offsetX * sin + offsetY * cos;
|
||||
this.vertices[numVertices++] = originX / imageWidth;
|
||||
this.vertices[numVertices++] = (originY + height) / imageHeight;
|
||||
this.vertices[numVertices++] = opacity;
|
||||
this.vertices[numVertices++] = rotateWithView;
|
||||
|
||||
// bottom-right corner
|
||||
offsetX = scale * (width - anchorX);
|
||||
offsetY = -scale * (height - anchorY);
|
||||
this.vertices[numVertices++] = x;
|
||||
this.vertices[numVertices++] = y;
|
||||
this.vertices[numVertices++] = offsetX * cos - offsetY * sin;
|
||||
this.vertices[numVertices++] = offsetX * sin + offsetY * cos;
|
||||
this.vertices[numVertices++] = (originX + width) / imageWidth;
|
||||
this.vertices[numVertices++] = (originY + height) / imageHeight;
|
||||
this.vertices[numVertices++] = opacity;
|
||||
this.vertices[numVertices++] = rotateWithView;
|
||||
|
||||
// top-right corner
|
||||
offsetX = scale * (width - anchorX);
|
||||
offsetY = scale * anchorY;
|
||||
this.vertices[numVertices++] = x;
|
||||
this.vertices[numVertices++] = y;
|
||||
this.vertices[numVertices++] = offsetX * cos - offsetY * sin;
|
||||
this.vertices[numVertices++] = offsetX * sin + offsetY * cos;
|
||||
this.vertices[numVertices++] = (originX + width) / imageWidth;
|
||||
this.vertices[numVertices++] = originY / imageHeight;
|
||||
this.vertices[numVertices++] = opacity;
|
||||
this.vertices[numVertices++] = rotateWithView;
|
||||
|
||||
// top-left corner
|
||||
offsetX = -scale * anchorX;
|
||||
offsetY = scale * anchorY;
|
||||
this.vertices[numVertices++] = x;
|
||||
this.vertices[numVertices++] = y;
|
||||
this.vertices[numVertices++] = offsetX * cos - offsetY * sin;
|
||||
this.vertices[numVertices++] = offsetX * sin + offsetY * cos;
|
||||
this.vertices[numVertices++] = originX / imageWidth;
|
||||
this.vertices[numVertices++] = originY / imageHeight;
|
||||
this.vertices[numVertices++] = opacity;
|
||||
this.vertices[numVertices++] = rotateWithView;
|
||||
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 1;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n;
|
||||
this.indices[numIndices++] = n + 2;
|
||||
this.indices[numIndices++] = n + 3;
|
||||
}
|
||||
|
||||
return numVertices;
|
||||
}
|
||||
|
||||
/**
|
||||
* @protected
|
||||
* @param {Array<WebGLTexture>} textures Textures.
|
||||
* @param {Array<HTMLCanvasElement|HTMLImageElement|HTMLVideoElement>} images Images.
|
||||
* @param {!Object<string, WebGLTexture>} texturePerImage Texture cache.
|
||||
* @param {WebGLRenderingContext} gl Gl.
|
||||
*/
|
||||
createTextures(textures, images, texturePerImage, gl) {
|
||||
let texture, image, uid, i;
|
||||
const ii = images.length;
|
||||
for (i = 0; i < ii; ++i) {
|
||||
image = images[i];
|
||||
|
||||
uid = getUid(image);
|
||||
if (uid in texturePerImage) {
|
||||
texture = texturePerImage[uid];
|
||||
} else {
|
||||
texture = createTexture(
|
||||
gl, image, CLAMP_TO_EDGE, CLAMP_TO_EDGE);
|
||||
texturePerImage[uid] = texture;
|
||||
}
|
||||
textures[i] = texture;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
setUpProgram(gl, context, size, pixelRatio) {
|
||||
// get the program
|
||||
const program = context.getProgram(fragment, vertex);
|
||||
|
||||
// get the locations
|
||||
let locations;
|
||||
if (!this.defaultLocations) {
|
||||
locations = new Locations(gl, program);
|
||||
this.defaultLocations = locations;
|
||||
} else {
|
||||
locations = this.defaultLocations;
|
||||
}
|
||||
|
||||
// use the program (FIXME: use the return value)
|
||||
context.useProgram(program);
|
||||
|
||||
// enable the vertex attrib arrays
|
||||
gl.enableVertexAttribArray(locations.a_position);
|
||||
gl.vertexAttribPointer(locations.a_position, 2, FLOAT,
|
||||
false, 32, 0);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_offsets);
|
||||
gl.vertexAttribPointer(locations.a_offsets, 2, FLOAT,
|
||||
false, 32, 8);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_texCoord);
|
||||
gl.vertexAttribPointer(locations.a_texCoord, 2, FLOAT,
|
||||
false, 32, 16);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_opacity);
|
||||
gl.vertexAttribPointer(locations.a_opacity, 1, FLOAT,
|
||||
false, 32, 24);
|
||||
|
||||
gl.enableVertexAttribArray(locations.a_rotateWithView);
|
||||
gl.vertexAttribPointer(locations.a_rotateWithView, 1, FLOAT,
|
||||
false, 32, 28);
|
||||
|
||||
return locations;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
shutDownProgram(gl, locations) {
|
||||
gl.disableVertexAttribArray(locations.a_position);
|
||||
gl.disableVertexAttribArray(locations.a_offsets);
|
||||
gl.disableVertexAttribArray(locations.a_texCoord);
|
||||
gl.disableVertexAttribArray(locations.a_opacity);
|
||||
gl.disableVertexAttribArray(locations.a_rotateWithView);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawReplay(gl, context, skippedFeaturesHash, hitDetection) {
|
||||
const textures = hitDetection ? this.getHitDetectionTextures() : this.getTextures();
|
||||
const groupIndices = hitDetection ? this.hitDetectionGroupIndices : this.groupIndices;
|
||||
|
||||
if (!isEmpty(skippedFeaturesHash)) {
|
||||
this.drawReplaySkipping(gl, context, skippedFeaturesHash, textures, groupIndices);
|
||||
} else {
|
||||
let i, ii, start;
|
||||
for (i = 0, ii = textures.length, start = 0; i < ii; ++i) {
|
||||
gl.bindTexture(TEXTURE_2D, textures[i]);
|
||||
const end = groupIndices[i];
|
||||
this.drawElements(gl, context, start, end);
|
||||
start = end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Draw the replay while paying attention to skipped features.
|
||||
*
|
||||
* This functions creates groups of features that can be drawn to together,
|
||||
* so that the number of `drawElements` calls is minimized.
|
||||
*
|
||||
* For example given the following texture groups:
|
||||
*
|
||||
* Group 1: A B C
|
||||
* Group 2: D [E] F G
|
||||
*
|
||||
* If feature E should be skipped, the following `drawElements` calls will be
|
||||
* made:
|
||||
*
|
||||
* drawElements with feature A, B and C
|
||||
* drawElements with feature D
|
||||
* drawElements with feature F and G
|
||||
*
|
||||
* @protected
|
||||
* @param {WebGLRenderingContext} gl gl.
|
||||
* @param {import("../../webgl/Context.js").default} context Context.
|
||||
* @param {Object<string, boolean>} skippedFeaturesHash Ids of features
|
||||
* to skip.
|
||||
* @param {Array<WebGLTexture>} textures Textures.
|
||||
* @param {Array<number>} groupIndices Texture group indices.
|
||||
*/
|
||||
drawReplaySkipping(gl, context, skippedFeaturesHash, textures, groupIndices) {
|
||||
let featureIndex = 0;
|
||||
|
||||
let i, ii;
|
||||
for (i = 0, ii = textures.length; i < ii; ++i) {
|
||||
gl.bindTexture(TEXTURE_2D, textures[i]);
|
||||
const groupStart = (i > 0) ? groupIndices[i - 1] : 0;
|
||||
const groupEnd = groupIndices[i];
|
||||
|
||||
let start = groupStart;
|
||||
let end = groupStart;
|
||||
while (featureIndex < this.startIndices.length &&
|
||||
this.startIndices[featureIndex] <= groupEnd) {
|
||||
const feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)] !== undefined) {
|
||||
// feature should be skipped
|
||||
if (start !== end) {
|
||||
// draw the features so far
|
||||
this.drawElements(gl, context, start, end);
|
||||
}
|
||||
// continue with the next feature
|
||||
start = (featureIndex === this.startIndices.length - 1) ?
|
||||
groupEnd : this.startIndices[featureIndex + 1];
|
||||
end = start;
|
||||
} else {
|
||||
// the feature is not skipped, augment the end index
|
||||
end = (featureIndex === this.startIndices.length - 1) ?
|
||||
groupEnd : this.startIndices[featureIndex + 1];
|
||||
}
|
||||
featureIndex++;
|
||||
}
|
||||
|
||||
if (start !== end) {
|
||||
// draw the remaining features (in case there was no skipped feature
|
||||
// in this texture group, all features of a group are drawn together)
|
||||
this.drawElements(gl, context, start, end);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
drawHitDetectionReplayOneByOne(gl, context, skippedFeaturesHash, featureCallback, opt_hitExtent) {
|
||||
let i, groupStart, start, end, feature;
|
||||
let featureIndex = this.startIndices.length - 1;
|
||||
const hitDetectionTextures = this.getHitDetectionTextures();
|
||||
for (i = hitDetectionTextures.length - 1; i >= 0; --i) {
|
||||
gl.bindTexture(TEXTURE_2D, hitDetectionTextures[i]);
|
||||
groupStart = (i > 0) ? this.hitDetectionGroupIndices[i - 1] : 0;
|
||||
end = this.hitDetectionGroupIndices[i];
|
||||
|
||||
// draw all features for this texture group
|
||||
while (featureIndex >= 0 &&
|
||||
this.startIndices[featureIndex] >= groupStart) {
|
||||
start = this.startIndices[featureIndex];
|
||||
feature = this.startIndicesFeature[featureIndex];
|
||||
|
||||
if (skippedFeaturesHash[getUid(feature)] === undefined &&
|
||||
feature.getGeometry() &&
|
||||
(opt_hitExtent === undefined || intersects(
|
||||
/** @type {Array<number>} */ (opt_hitExtent),
|
||||
feature.getGeometry().getExtent()))) {
|
||||
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
|
||||
this.drawElements(gl, context, start, end);
|
||||
|
||||
const result = featureCallback(feature);
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
|
||||
end = start;
|
||||
featureIndex--;
|
||||
}
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritDoc
|
||||
*/
|
||||
finish(context) {
|
||||
this.anchorX = undefined;
|
||||
this.anchorY = undefined;
|
||||
this.height = undefined;
|
||||
this.imageHeight = undefined;
|
||||
this.imageWidth = undefined;
|
||||
this.indices = null;
|
||||
this.opacity = undefined;
|
||||
this.originX = undefined;
|
||||
this.originY = undefined;
|
||||
this.rotateWithView = undefined;
|
||||
this.rotation = undefined;
|
||||
this.scale = undefined;
|
||||
this.vertices = null;
|
||||
this.width = undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @param {boolean=} opt_all Return hit detection textures with regular ones.
|
||||
* @return {Array<WebGLTexture>} Textures.
|
||||
*/
|
||||
getTextures(opt_all) {
|
||||
return abstract();
|
||||
}
|
||||
|
||||
/**
|
||||
* @abstract
|
||||
* @protected
|
||||
* @return {Array<WebGLTexture>} Textures.
|
||||
*/
|
||||
getHitDetectionTextures() {
|
||||
return abstract();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default WebGLTextureReplay;
|
||||
@@ -1,100 +0,0 @@
|
||||
//! MODULE=ol/render/webgl/circlereplay/defaultshader
|
||||
|
||||
|
||||
//! COMMON
|
||||
varying vec2 v_center;
|
||||
varying vec2 v_offset;
|
||||
varying float v_halfWidth;
|
||||
varying float v_pixelRatio;
|
||||
|
||||
|
||||
//! VERTEX
|
||||
attribute vec2 a_position;
|
||||
attribute float a_instruction;
|
||||
attribute float a_radius;
|
||||
|
||||
uniform mat4 u_projectionMatrix;
|
||||
uniform mat4 u_offsetScaleMatrix;
|
||||
uniform mat4 u_offsetRotateMatrix;
|
||||
uniform float u_lineWidth;
|
||||
uniform float u_pixelRatio;
|
||||
|
||||
void main(void) {
|
||||
mat4 offsetMatrix = u_offsetScaleMatrix * u_offsetRotateMatrix;
|
||||
v_center = vec4(u_projectionMatrix * vec4(a_position, 0.0, 1.0)).xy;
|
||||
v_pixelRatio = u_pixelRatio;
|
||||
float lineWidth = u_lineWidth * u_pixelRatio;
|
||||
v_halfWidth = lineWidth / 2.0;
|
||||
if (lineWidth == 0.0) {
|
||||
lineWidth = 2.0 * u_pixelRatio;
|
||||
}
|
||||
vec2 offset;
|
||||
// Radius with anitaliasing (roughly).
|
||||
float radius = a_radius + 3.0 * u_pixelRatio;
|
||||
// Until we get gl_VertexID in WebGL, we store an instruction.
|
||||
if (a_instruction == 0.0) {
|
||||
// Offsetting the edges of the triangle by lineWidth / 2 is necessary, however
|
||||
// we should also leave some space for the antialiasing, thus we offset by lineWidth.
|
||||
offset = vec2(-1.0, 1.0);
|
||||
} else if (a_instruction == 1.0) {
|
||||
offset = vec2(-1.0, -1.0);
|
||||
} else if (a_instruction == 2.0) {
|
||||
offset = vec2(1.0, -1.0);
|
||||
} else {
|
||||
offset = vec2(1.0, 1.0);
|
||||
}
|
||||
|
||||
gl_Position = u_projectionMatrix * vec4(a_position + offset * radius, 0.0, 1.0) +
|
||||
offsetMatrix * vec4(offset * lineWidth, 0.0, 0.0);
|
||||
v_offset = vec4(u_projectionMatrix * vec4(a_position.x + a_radius, a_position.y,
|
||||
0.0, 1.0)).xy;
|
||||
|
||||
if (distance(v_center, v_offset) > 20000.0) {
|
||||
gl_Position = vec4(v_center, 0.0, 1.0);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//! FRAGMENT
|
||||
|
||||
uniform float u_opacity;
|
||||
uniform vec4 u_fillColor;
|
||||
uniform vec4 u_strokeColor;
|
||||
uniform vec2 u_size;
|
||||
|
||||
void main(void) {
|
||||
vec2 windowCenter = vec2((v_center.x + 1.0) / 2.0 * u_size.x * v_pixelRatio,
|
||||
(v_center.y + 1.0) / 2.0 * u_size.y * v_pixelRatio);
|
||||
vec2 windowOffset = vec2((v_offset.x + 1.0) / 2.0 * u_size.x * v_pixelRatio,
|
||||
(v_offset.y + 1.0) / 2.0 * u_size.y * v_pixelRatio);
|
||||
float radius = length(windowCenter - windowOffset);
|
||||
float dist = length(windowCenter - gl_FragCoord.xy);
|
||||
if (dist > radius + v_halfWidth) {
|
||||
if (u_strokeColor.a == 0.0) {
|
||||
gl_FragColor = u_fillColor;
|
||||
} else {
|
||||
gl_FragColor = u_strokeColor;
|
||||
}
|
||||
gl_FragColor.a = gl_FragColor.a - (dist - (radius + v_halfWidth));
|
||||
} else if (u_fillColor.a == 0.0) {
|
||||
// Hooray, no fill, just stroke. We can use real antialiasing.
|
||||
gl_FragColor = u_strokeColor;
|
||||
if (dist < radius - v_halfWidth) {
|
||||
gl_FragColor.a = gl_FragColor.a - (radius - v_halfWidth - dist);
|
||||
}
|
||||
} else {
|
||||
gl_FragColor = u_fillColor;
|
||||
float strokeDist = radius - v_halfWidth;
|
||||
float antialias = 2.0 * v_pixelRatio;
|
||||
if (dist > strokeDist) {
|
||||
gl_FragColor = u_strokeColor;
|
||||
} else if (dist >= strokeDist - antialias) {
|
||||
float step = smoothstep(strokeDist - antialias, strokeDist, dist);
|
||||
gl_FragColor = mix(u_fillColor, u_strokeColor, step);
|
||||
}
|
||||
}
|
||||
gl_FragColor.a = gl_FragColor.a * u_opacity;
|
||||
if (gl_FragColor.a <= 0.0) {
|
||||
discard;
|
||||
}
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/circlereplay/defaultshader
|
||||
*/
|
||||
// This file is automatically generated, do not edit.
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
|
||||
import WebGLFragment from '../../../webgl/Fragment.js';
|
||||
import WebGLVertex from '../../../webgl/Vertex.js';
|
||||
|
||||
export const fragment = new WebGLFragment(DEBUG_WEBGL ?
|
||||
'precision mediump float;\nvarying vec2 v_center;\nvarying vec2 v_offset;\nvarying float v_halfWidth;\nvarying float v_pixelRatio;\n\n\n\nuniform float u_opacity;\nuniform vec4 u_fillColor;\nuniform vec4 u_strokeColor;\nuniform vec2 u_size;\n\nvoid main(void) {\n vec2 windowCenter = vec2((v_center.x + 1.0) / 2.0 * u_size.x * v_pixelRatio,\n (v_center.y + 1.0) / 2.0 * u_size.y * v_pixelRatio);\n vec2 windowOffset = vec2((v_offset.x + 1.0) / 2.0 * u_size.x * v_pixelRatio,\n (v_offset.y + 1.0) / 2.0 * u_size.y * v_pixelRatio);\n float radius = length(windowCenter - windowOffset);\n float dist = length(windowCenter - gl_FragCoord.xy);\n if (dist > radius + v_halfWidth) {\n if (u_strokeColor.a == 0.0) {\n gl_FragColor = u_fillColor;\n } else {\n gl_FragColor = u_strokeColor;\n }\n gl_FragColor.a = gl_FragColor.a - (dist - (radius + v_halfWidth));\n } else if (u_fillColor.a == 0.0) {\n // Hooray, no fill, just stroke. We can use real antialiasing.\n gl_FragColor = u_strokeColor;\n if (dist < radius - v_halfWidth) {\n gl_FragColor.a = gl_FragColor.a - (radius - v_halfWidth - dist);\n }\n } else {\n gl_FragColor = u_fillColor;\n float strokeDist = radius - v_halfWidth;\n float antialias = 2.0 * v_pixelRatio;\n if (dist > strokeDist) {\n gl_FragColor = u_strokeColor;\n } else if (dist >= strokeDist - antialias) {\n float step = smoothstep(strokeDist - antialias, strokeDist, dist);\n gl_FragColor = mix(u_fillColor, u_strokeColor, step);\n }\n }\n gl_FragColor.a = gl_FragColor.a * u_opacity;\n if (gl_FragColor.a <= 0.0) {\n discard;\n }\n}\n' :
|
||||
'precision mediump float;varying vec2 a;varying vec2 b;varying float c;varying float d;uniform float m;uniform vec4 n;uniform vec4 o;uniform vec2 p;void main(void){vec2 windowCenter=vec2((a.x+1.0)/2.0*p.x*d,(a.y+1.0)/2.0*p.y*d);vec2 windowOffset=vec2((b.x+1.0)/2.0*p.x*d,(b.y+1.0)/2.0*p.y*d);float radius=length(windowCenter-windowOffset);float dist=length(windowCenter-gl_FragCoord.xy);if(dist>radius+c){if(o.a==0.0){gl_FragColor=n;}else{gl_FragColor=o;}gl_FragColor.a=gl_FragColor.a-(dist-(radius+c));}else if(n.a==0.0){gl_FragColor=o;if(dist<radius-c){gl_FragColor.a=gl_FragColor.a-(radius-c-dist);}} else{gl_FragColor=n;float strokeDist=radius-c;float antialias=2.0*d;if(dist>strokeDist){gl_FragColor=o;}else if(dist>=strokeDist-antialias){float step=smoothstep(strokeDist-antialias,strokeDist,dist);gl_FragColor=mix(n,o,step);}} gl_FragColor.a=gl_FragColor.a*m;if(gl_FragColor.a<=0.0){discard;}}');
|
||||
|
||||
export const vertex = new WebGLVertex(DEBUG_WEBGL ?
|
||||
'varying vec2 v_center;\nvarying vec2 v_offset;\nvarying float v_halfWidth;\nvarying float v_pixelRatio;\n\n\nattribute vec2 a_position;\nattribute float a_instruction;\nattribute float a_radius;\n\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_offsetScaleMatrix;\nuniform mat4 u_offsetRotateMatrix;\nuniform float u_lineWidth;\nuniform float u_pixelRatio;\n\nvoid main(void) {\n mat4 offsetMatrix = u_offsetScaleMatrix * u_offsetRotateMatrix;\n v_center = vec4(u_projectionMatrix * vec4(a_position, 0.0, 1.0)).xy;\n v_pixelRatio = u_pixelRatio;\n float lineWidth = u_lineWidth * u_pixelRatio;\n v_halfWidth = lineWidth / 2.0;\n if (lineWidth == 0.0) {\n lineWidth = 2.0 * u_pixelRatio;\n }\n vec2 offset;\n // Radius with anitaliasing (roughly).\n float radius = a_radius + 3.0 * u_pixelRatio;\n // Until we get gl_VertexID in WebGL, we store an instruction.\n if (a_instruction == 0.0) {\n // Offsetting the edges of the triangle by lineWidth / 2 is necessary, however\n // we should also leave some space for the antialiasing, thus we offset by lineWidth.\n offset = vec2(-1.0, 1.0);\n } else if (a_instruction == 1.0) {\n offset = vec2(-1.0, -1.0);\n } else if (a_instruction == 2.0) {\n offset = vec2(1.0, -1.0);\n } else {\n offset = vec2(1.0, 1.0);\n }\n\n gl_Position = u_projectionMatrix * vec4(a_position + offset * radius, 0.0, 1.0) +\n offsetMatrix * vec4(offset * lineWidth, 0.0, 0.0);\n v_offset = vec4(u_projectionMatrix * vec4(a_position.x + a_radius, a_position.y,\n 0.0, 1.0)).xy;\n\n if (distance(v_center, v_offset) > 20000.0) {\n gl_Position = vec4(v_center, 0.0, 1.0);\n }\n}\n\n\n' :
|
||||
'varying vec2 a;varying vec2 b;varying float c;varying float d;attribute vec2 e;attribute float f;attribute float g;uniform mat4 h;uniform mat4 i;uniform mat4 j;uniform float k;uniform float l;void main(void){mat4 offsetMatrix=i*j;a=vec4(h*vec4(e,0.0,1.0)).xy;d=l;float lineWidth=k*l;c=lineWidth/2.0;if(lineWidth==0.0){lineWidth=2.0*l;}vec2 offset;float radius=g+3.0*l;if(f==0.0){offset=vec2(-1.0,1.0);}else if(f==1.0){offset=vec2(-1.0,-1.0);}else if(f==2.0){offset=vec2(1.0,-1.0);}else{offset=vec2(1.0,1.0);}gl_Position=h*vec4(e+offset*radius,0.0,1.0)+offsetMatrix*vec4(offset*lineWidth,0.0,0.0);b=vec4(h*vec4(e.x+g,e.y,0.0,1.0)).xy;if(distance(a,b)>20000.0){gl_Position=vec4(a,0.0,1.0);}}');
|
||||
@@ -1,93 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/circlereplay/defaultshader/Locations
|
||||
*/
|
||||
// This file is automatically generated, do not edit
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
|
||||
|
||||
class Locations {
|
||||
|
||||
/**
|
||||
* @param {WebGLRenderingContext} gl GL.
|
||||
* @param {WebGLProgram} program Program.
|
||||
*/
|
||||
constructor(gl, program) {
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_projectionMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_projectionMatrix' : 'h');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetScaleMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetScaleMatrix' : 'i');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetRotateMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetRotateMatrix' : 'j');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_lineWidth = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_lineWidth' : 'k');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_pixelRatio = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_pixelRatio' : 'l');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_opacity = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_opacity' : 'm');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_fillColor = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_fillColor' : 'n');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_strokeColor = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_strokeColor' : 'o');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_size = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_size' : 'p');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_position = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_position' : 'e');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_instruction = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_instruction' : 'f');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_radius = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_radius' : 'g');
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Locations;
|
||||
@@ -1,160 +0,0 @@
|
||||
//! MODULE=ol/render/webgl/linestringreplay/defaultshader
|
||||
|
||||
|
||||
//! COMMON
|
||||
varying float v_round;
|
||||
varying vec2 v_roundVertex;
|
||||
varying float v_halfWidth;
|
||||
|
||||
|
||||
//! VERTEX
|
||||
attribute vec2 a_lastPos;
|
||||
attribute vec2 a_position;
|
||||
attribute vec2 a_nextPos;
|
||||
attribute float a_direction;
|
||||
|
||||
uniform mat4 u_projectionMatrix;
|
||||
uniform mat4 u_offsetScaleMatrix;
|
||||
uniform mat4 u_offsetRotateMatrix;
|
||||
uniform float u_lineWidth;
|
||||
uniform float u_miterLimit;
|
||||
|
||||
bool nearlyEquals(in float value, in float ref) {
|
||||
float epsilon = 0.000000000001;
|
||||
return value >= ref - epsilon && value <= ref + epsilon;
|
||||
}
|
||||
|
||||
void alongNormal(out vec2 offset, in vec2 nextP, in float turnDir, in float direction) {
|
||||
vec2 dirVect = nextP - a_position;
|
||||
vec2 normal = normalize(vec2(-turnDir * dirVect.y, turnDir * dirVect.x));
|
||||
offset = u_lineWidth / 2.0 * normal * direction;
|
||||
}
|
||||
|
||||
void miterUp(out vec2 offset, out float round, in bool isRound, in float direction) {
|
||||
float halfWidth = u_lineWidth / 2.0;
|
||||
vec2 tangent = normalize(normalize(a_nextPos - a_position) + normalize(a_position - a_lastPos));
|
||||
vec2 normal = vec2(-tangent.y, tangent.x);
|
||||
vec2 dirVect = a_nextPos - a_position;
|
||||
vec2 tmpNormal = normalize(vec2(-dirVect.y, dirVect.x));
|
||||
float miterLength = abs(halfWidth / dot(normal, tmpNormal));
|
||||
offset = normal * direction * miterLength;
|
||||
round = 0.0;
|
||||
if (isRound) {
|
||||
round = 1.0;
|
||||
} else if (miterLength > u_miterLimit + u_lineWidth) {
|
||||
offset = halfWidth * tmpNormal * direction;
|
||||
}
|
||||
}
|
||||
|
||||
bool miterDown(out vec2 offset, in vec4 projPos, in mat4 offsetMatrix, in float direction) {
|
||||
bool degenerate = false;
|
||||
vec2 tangent = normalize(normalize(a_nextPos - a_position) + normalize(a_position - a_lastPos));
|
||||
vec2 normal = vec2(-tangent.y, tangent.x);
|
||||
vec2 dirVect = a_lastPos - a_position;
|
||||
vec2 tmpNormal = normalize(vec2(-dirVect.y, dirVect.x));
|
||||
vec2 longOffset, shortOffset, longVertex;
|
||||
vec4 shortProjVertex;
|
||||
float halfWidth = u_lineWidth / 2.0;
|
||||
if (length(a_nextPos - a_position) > length(a_lastPos - a_position)) {
|
||||
longOffset = tmpNormal * direction * halfWidth;
|
||||
shortOffset = normalize(vec2(dirVect.y, -dirVect.x)) * direction * halfWidth;
|
||||
longVertex = a_nextPos;
|
||||
shortProjVertex = u_projectionMatrix * vec4(a_lastPos, 0.0, 1.0);
|
||||
} else {
|
||||
shortOffset = tmpNormal * direction * halfWidth;
|
||||
longOffset = normalize(vec2(dirVect.y, -dirVect.x)) * direction * halfWidth;
|
||||
longVertex = a_lastPos;
|
||||
shortProjVertex = u_projectionMatrix * vec4(a_nextPos, 0.0, 1.0);
|
||||
}
|
||||
//Intersection algorithm based on theory by Paul Bourke (http://paulbourke.net/geometry/pointlineplane/).
|
||||
vec4 p1 = u_projectionMatrix * vec4(longVertex, 0.0, 1.0) + offsetMatrix * vec4(longOffset, 0.0, 0.0);
|
||||
vec4 p2 = projPos + offsetMatrix * vec4(longOffset, 0.0, 0.0);
|
||||
vec4 p3 = shortProjVertex + offsetMatrix * vec4(-shortOffset, 0.0, 0.0);
|
||||
vec4 p4 = shortProjVertex + offsetMatrix * vec4(shortOffset, 0.0, 0.0);
|
||||
float denom = (p4.y - p3.y) * (p2.x - p1.x) - (p4.x - p3.x) * (p2.y - p1.y);
|
||||
float firstU = ((p4.x - p3.x) * (p1.y - p3.y) - (p4.y - p3.y) * (p1.x - p3.x)) / denom;
|
||||
float secondU = ((p2.x - p1.x) * (p1.y - p3.y) - (p2.y - p1.y) * (p1.x - p3.x)) / denom;
|
||||
float epsilon = 0.000000000001;
|
||||
if (firstU > epsilon && firstU < 1.0 - epsilon && secondU > epsilon && secondU < 1.0 - epsilon) {
|
||||
shortProjVertex.x = p1.x + firstU * (p2.x - p1.x);
|
||||
shortProjVertex.y = p1.y + firstU * (p2.y - p1.y);
|
||||
offset = shortProjVertex.xy;
|
||||
degenerate = true;
|
||||
} else {
|
||||
float miterLength = abs(halfWidth / dot(normal, tmpNormal));
|
||||
offset = normal * direction * miterLength;
|
||||
}
|
||||
return degenerate;
|
||||
}
|
||||
|
||||
void squareCap(out vec2 offset, out float round, in bool isRound, in vec2 nextP,
|
||||
in float turnDir, in float direction) {
|
||||
round = 0.0;
|
||||
vec2 dirVect = a_position - nextP;
|
||||
vec2 firstNormal = normalize(dirVect);
|
||||
vec2 secondNormal = vec2(turnDir * firstNormal.y * direction, -turnDir * firstNormal.x * direction);
|
||||
vec2 hypotenuse = normalize(firstNormal - secondNormal);
|
||||
vec2 normal = vec2(turnDir * hypotenuse.y * direction, -turnDir * hypotenuse.x * direction);
|
||||
float length = sqrt(v_halfWidth * v_halfWidth * 2.0);
|
||||
offset = normal * length;
|
||||
if (isRound) {
|
||||
round = 1.0;
|
||||
}
|
||||
}
|
||||
|
||||
void main(void) {
|
||||
bool degenerate = false;
|
||||
float direction = float(sign(a_direction));
|
||||
mat4 offsetMatrix = u_offsetScaleMatrix * u_offsetRotateMatrix;
|
||||
vec2 offset;
|
||||
vec4 projPos = u_projectionMatrix * vec4(a_position, 0.0, 1.0);
|
||||
bool round = nearlyEquals(mod(a_direction, 2.0), 0.0);
|
||||
|
||||
v_round = 0.0;
|
||||
v_halfWidth = u_lineWidth / 2.0;
|
||||
v_roundVertex = projPos.xy;
|
||||
|
||||
if (nearlyEquals(mod(a_direction, 3.0), 0.0) || nearlyEquals(mod(a_direction, 17.0), 0.0)) {
|
||||
alongNormal(offset, a_nextPos, 1.0, direction);
|
||||
} else if (nearlyEquals(mod(a_direction, 5.0), 0.0) || nearlyEquals(mod(a_direction, 13.0), 0.0)) {
|
||||
alongNormal(offset, a_lastPos, -1.0, direction);
|
||||
} else if (nearlyEquals(mod(a_direction, 23.0), 0.0)) {
|
||||
miterUp(offset, v_round, round, direction);
|
||||
} else if (nearlyEquals(mod(a_direction, 19.0), 0.0)) {
|
||||
degenerate = miterDown(offset, projPos, offsetMatrix, direction);
|
||||
} else if (nearlyEquals(mod(a_direction, 7.0), 0.0)) {
|
||||
squareCap(offset, v_round, round, a_nextPos, 1.0, direction);
|
||||
} else if (nearlyEquals(mod(a_direction, 11.0), 0.0)) {
|
||||
squareCap(offset, v_round, round, a_lastPos, -1.0, direction);
|
||||
}
|
||||
if (!degenerate) {
|
||||
vec4 offsets = offsetMatrix * vec4(offset, 0.0, 0.0);
|
||||
gl_Position = projPos + offsets;
|
||||
} else {
|
||||
gl_Position = vec4(offset, 0.0, 1.0);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//! FRAGMENT
|
||||
|
||||
uniform float u_opacity;
|
||||
uniform vec4 u_color;
|
||||
uniform vec2 u_size;
|
||||
uniform float u_pixelRatio;
|
||||
|
||||
void main(void) {
|
||||
if (v_round > 0.0) {
|
||||
vec2 windowCoords = vec2((v_roundVertex.x + 1.0) / 2.0 * u_size.x * u_pixelRatio,
|
||||
(v_roundVertex.y + 1.0) / 2.0 * u_size.y * u_pixelRatio);
|
||||
if (length(windowCoords - gl_FragCoord.xy) > v_halfWidth * u_pixelRatio) {
|
||||
discard;
|
||||
}
|
||||
}
|
||||
gl_FragColor = u_color;
|
||||
float alpha = u_color.a * u_opacity;
|
||||
if (alpha == 0.0) {
|
||||
discard;
|
||||
}
|
||||
gl_FragColor.a = alpha;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
@@ -1,99 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/linestringreplay/defaultshader/Locations
|
||||
*/
|
||||
// This file is automatically generated, do not edit
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
|
||||
|
||||
class Locations {
|
||||
|
||||
/**
|
||||
* @param {WebGLRenderingContext} gl GL.
|
||||
* @param {WebGLProgram} program Program.
|
||||
*/
|
||||
constructor(gl, program) {
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_projectionMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_projectionMatrix' : 'h');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetScaleMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetScaleMatrix' : 'i');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetRotateMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetRotateMatrix' : 'j');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_lineWidth = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_lineWidth' : 'k');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_miterLimit = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_miterLimit' : 'l');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_opacity = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_opacity' : 'm');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_color = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_color' : 'n');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_size = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_size' : 'o');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_pixelRatio = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_pixelRatio' : 'p');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_lastPos = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_lastPos' : 'd');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_position = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_position' : 'e');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_nextPos = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_nextPos' : 'f');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_direction = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_direction' : 'g');
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Locations;
|
||||
@@ -1,31 +0,0 @@
|
||||
//! MODULE=ol/render/webgl/polygonreplay/defaultshader
|
||||
|
||||
|
||||
//! COMMON
|
||||
|
||||
|
||||
//! VERTEX
|
||||
attribute vec2 a_position;
|
||||
|
||||
uniform mat4 u_projectionMatrix;
|
||||
uniform mat4 u_offsetScaleMatrix;
|
||||
uniform mat4 u_offsetRotateMatrix;
|
||||
|
||||
void main(void) {
|
||||
gl_Position = u_projectionMatrix * vec4(a_position, 0.0, 1.0);
|
||||
}
|
||||
|
||||
|
||||
//! FRAGMENT
|
||||
|
||||
uniform vec4 u_color;
|
||||
uniform float u_opacity;
|
||||
|
||||
void main(void) {
|
||||
gl_FragColor = u_color;
|
||||
float alpha = u_color.a * u_opacity;
|
||||
if (alpha == 0.0) {
|
||||
discard;
|
||||
}
|
||||
gl_FragColor.a = alpha;
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/polygonreplay/defaultshader
|
||||
*/
|
||||
// This file is automatically generated, do not edit.
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
|
||||
import WebGLFragment from '../../../webgl/Fragment.js';
|
||||
import WebGLVertex from '../../../webgl/Vertex.js';
|
||||
|
||||
export const fragment = new WebGLFragment(DEBUG_WEBGL ?
|
||||
'precision mediump float;\n\n\n\nuniform vec4 u_color;\nuniform float u_opacity;\n\nvoid main(void) {\n gl_FragColor = u_color;\n float alpha = u_color.a * u_opacity;\n if (alpha == 0.0) {\n discard;\n }\n gl_FragColor.a = alpha;\n}\n' :
|
||||
'precision mediump float;uniform vec4 e;uniform float f;void main(void){gl_FragColor=e;float alpha=e.a*f;if(alpha==0.0){discard;}gl_FragColor.a=alpha;}');
|
||||
|
||||
export const vertex = new WebGLVertex(DEBUG_WEBGL ?
|
||||
'\n\nattribute vec2 a_position;\n\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_offsetScaleMatrix;\nuniform mat4 u_offsetRotateMatrix;\n\nvoid main(void) {\n gl_Position = u_projectionMatrix * vec4(a_position, 0.0, 1.0);\n}\n\n\n' :
|
||||
'attribute vec2 a;uniform mat4 b;uniform mat4 c;uniform mat4 d;void main(void){gl_Position=b*vec4(a,0.0,1.0);}');
|
||||
@@ -1,57 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/polygonreplay/defaultshader/Locations
|
||||
*/
|
||||
// This file is automatically generated, do not edit
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
|
||||
|
||||
class Locations {
|
||||
|
||||
/**
|
||||
* @param {WebGLRenderingContext} gl GL.
|
||||
* @param {WebGLProgram} program Program.
|
||||
*/
|
||||
constructor(gl, program) {
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_projectionMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_projectionMatrix' : 'b');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetScaleMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetScaleMatrix' : 'c');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetRotateMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetRotateMatrix' : 'd');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_color = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_color' : 'e');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_opacity = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_opacity' : 'f');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_position = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_position' : 'a');
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Locations;
|
||||
@@ -1,43 +0,0 @@
|
||||
//! MODULE=ol/render/webgl/texturereplay/defaultshader
|
||||
|
||||
|
||||
//! 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, 0.0);
|
||||
gl_Position = u_projectionMatrix * vec4(a_position, 0.0, 1.0) + offsets;
|
||||
v_texCoord = a_texCoord;
|
||||
v_opacity = a_opacity;
|
||||
}
|
||||
|
||||
|
||||
//! FRAGMENT
|
||||
uniform float u_opacity;
|
||||
uniform sampler2D u_image;
|
||||
|
||||
void main(void) {
|
||||
vec4 texColor = texture2D(u_image, v_texCoord);
|
||||
gl_FragColor.rgb = texColor.rgb;
|
||||
float alpha = texColor.a * v_opacity * u_opacity;
|
||||
if (alpha == 0.0) {
|
||||
discard;
|
||||
}
|
||||
gl_FragColor.a = alpha;
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/texturereplay/defaultshader
|
||||
*/
|
||||
// This file is automatically generated, do not edit.
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../webgl.js';
|
||||
import WebGLFragment from '../../../webgl/Fragment.js';
|
||||
import WebGLVertex from '../../../webgl/Vertex.js';
|
||||
|
||||
export const fragment = new WebGLFragment(DEBUG_WEBGL ?
|
||||
'precision mediump float;\nvarying vec2 v_texCoord;\nvarying float v_opacity;\n\nuniform float u_opacity;\nuniform sampler2D u_image;\n\nvoid main(void) {\n vec4 texColor = texture2D(u_image, v_texCoord);\n gl_FragColor.rgb = texColor.rgb;\n float alpha = texColor.a * v_opacity * u_opacity;\n if (alpha == 0.0) {\n discard;\n }\n gl_FragColor.a = alpha;\n}\n' :
|
||||
'precision mediump float;varying vec2 a;varying float b;uniform float k;uniform sampler2D l;void main(void){vec4 texColor=texture2D(l,a);gl_FragColor.rgb=texColor.rgb;float alpha=texColor.a*b*k;if(alpha==0.0){discard;}gl_FragColor.a=alpha;}');
|
||||
|
||||
export const vertex = new WebGLVertex(DEBUG_WEBGL ?
|
||||
'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, 0.0);\n gl_Position = u_projectionMatrix * vec4(a_position, 0.0, 1.0) + offsets;\n v_texCoord = a_texCoord;\n v_opacity = a_opacity;\n}\n\n\n' :
|
||||
'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,0.0);gl_Position=h*vec4(c,0.0,1.0)+offsets;a=d;b=f;}');
|
||||
@@ -1,81 +0,0 @@
|
||||
/**
|
||||
* @module ol/render/webgl/texturereplay/defaultshader/Locations
|
||||
*/
|
||||
// This file is automatically generated, do not edit
|
||||
// Run `make shaders` to generate, and commit the result.
|
||||
|
||||
import {DEBUG as DEBUG_WEBGL} from '../../../../webgl.js';
|
||||
|
||||
class Locations {
|
||||
|
||||
/**
|
||||
* @param {WebGLRenderingContext} gl GL.
|
||||
* @param {WebGLProgram} program Program.
|
||||
*/
|
||||
constructor(gl, program) {
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_projectionMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_projectionMatrix' : 'h');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetScaleMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetScaleMatrix' : 'i');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_offsetRotateMatrix = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_offsetRotateMatrix' : 'j');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_opacity = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_opacity' : 'k');
|
||||
|
||||
/**
|
||||
* @type {WebGLUniformLocation}
|
||||
*/
|
||||
this.u_image = gl.getUniformLocation(
|
||||
program, DEBUG_WEBGL ? 'u_image' : 'l');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_position = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_position' : 'c');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_texCoord = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_texCoord' : 'd');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_offsets = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_offsets' : 'e');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_opacity = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_opacity' : 'f');
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
this.a_rotateWithView = gl.getAttribLocation(
|
||||
program, DEBUG_WEBGL ? 'a_rotateWithView' : 'g');
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
export default Locations;
|
||||
Reference in New Issue
Block a user