ol 7.3.1-dev.1680098251703 → 7.3.1-dev.1680173927805

package/renderer/webgl/VectorTileLayer.d.ts

@@ -0,0 +1,160 @@
+export default WebGLVectorTileLayerRenderer;
+/**
+ * A callback computing
+ * the value of a custom attribute (different for each feature) to be passed on to the GPU.
+ * Properties are available as 2nd arg for quicker access.
+ */
+export type CustomAttributeCallback = (arg0: import("../../Feature").default, arg1: {
+    [x: string]: any;
+}) => number;
+/**
+ * An object containing both shaders (vertex and fragment) as well as the required attributes
+ */
+export type ShaderProgram = {
+    /**
+     * Vertex shader source (using the default one if unspecified).
+     */
+    vertexShader?: string | undefined;
+    /**
+     * Fragment shader source (using the default one if unspecified).
+     */
+    fragmentShader?: string | undefined;
+    /**
+     * Custom attributes made available in the vertex shader.
+     * Keys are the names of the attributes which are then accessible in the vertex shader using the `a_` prefix, e.g.: `a_opacity`.
+     * Default shaders rely on the attributes in {@link module :ol/render/webgl/shaders~DefaultAttributes}.
+     */
+    attributes: any;
+};
+export type Options = {
+    /**
+     * Attributes and shaders for filling polygons.
+     */
+    fill?: ShaderProgram | undefined;
+    /**
+     * Attributes and shaders for line strings and polygon strokes.
+     */
+    stroke?: ShaderProgram | undefined;
+    /**
+     * Attributes and shaders for points.
+     */
+    point?: ShaderProgram | undefined;
+    /**
+     * Additional uniforms
+     * made available to shaders.
+     */
+    uniforms?: {
+        [x: string]: import("../../webgl/Helper").UniformValue;
+    } | undefined;
+    /**
+     * The vector tile cache size.
+     */
+    cacheSize?: number | undefined;
+};
+export type LayerType = import("../../layer/BaseTile.js").default<any, any>;
+/**
+ * @typedef {function(import("../../Feature").default, Object<string, *>):number} CustomAttributeCallback A callback computing
+ * the value of a custom attribute (different for each feature) to be passed on to the GPU.
+ * Properties are available as 2nd arg for quicker access.
+ */
+/**
+ * @typedef {Object} ShaderProgram An object containing both shaders (vertex and fragment) as well as the required attributes
+ * @property {string} [vertexShader] Vertex shader source (using the default one if unspecified).
+ * @property {string} [fragmentShader] Fragment shader source (using the default one if unspecified).
+ * @property {Object<import("./shaders.js").DefaultAttributes,CustomAttributeCallback>} attributes Custom attributes made available in the vertex shader.
+ * Keys are the names of the attributes which are then accessible in the vertex shader using the `a_` prefix, e.g.: `a_opacity`.
+ * Default shaders rely on the attributes in {@link module:ol/render/webgl/shaders~DefaultAttributes}.
+ */
+/**
+ * @typedef {Object} Options
+ * @property {ShaderProgram} [fill] Attributes and shaders for filling polygons.
+ * @property {ShaderProgram} [stroke] Attributes and shaders for line strings and polygon strokes.
+ * @property {ShaderProgram} [point] Attributes and shaders for points.
+ * @property {Object<string, import("../../webgl/Helper").UniformValue>} [uniforms] Additional uniforms
+ * made available to shaders.
+ * @property {number} [cacheSize=512] The vector tile cache size.
+ */
+/**
+ * @typedef {import("../../layer/BaseTile.js").default} LayerType
+ */
+/**
+ * @classdesc
+ * WebGL renderer for vector tile layers. Experimental.
+ * @extends {WebGLBaseTileLayerRenderer<LayerType>}
+ */
+declare class WebGLVectorTileLayerRenderer extends WebGLBaseTileLayerRenderer<import("../../layer/BaseTile.js").default<any, any>, any, any> {
+    /**
+     * @param {LayerType} tileLayer Tile layer.
+     * @param {Options} options Options.
+     */
+    constructor(tileLayer: import("../../layer/BaseTile.js").default<any, any>, options: Options);
+    /**
+     * @private
+     */
+    private worker_;
+    /**
+     * @type {PolygonBatchRenderer}
+     * @private
+     */
+    private polygonRenderer_;
+    /**
+     * @type {PointBatchRenderer}
+     * @private
+     */
+    private pointRenderer_;
+    /**
+     * @type {LineStringBatchRenderer}
+     * @private
+     */
+    private lineStringRenderer_;
+    /**
+     * This transform is updated on every frame and is the composition of:
+     * - invert of the world->screen transform that was used when rebuilding buffers (see `this.renderTransform_`)
+     * - current world->screen transform
+     * @type {import("../../transform.js").Transform}
+     * @private
+     */
+    private currentFrameStateTransform_;
+    tmpTransform_: number[];
+    tmpMat4_: number[];
+    /**
+     * @param {Options} options Options.
+     */
+    reset(options: Options): void;
+    /**
+     * @param {Options} options Options.
+     * @private
+     */
+    private applyOptions_;
+    fillVertexShader_: string | undefined;
+    fillFragmentShader_: string | undefined;
+    fillAttributes_: import("../../render/webgl/BatchRenderer").CustomAttribute[] | undefined;
+    strokeVertexShader_: string | undefined;
+    strokeFragmentShader_: string | undefined;
+    strokeAttributes_: import("../../render/webgl/BatchRenderer").CustomAttribute[] | undefined;
+    pointVertexShader_: string | undefined;
+    pointFragmentShader_: string | undefined;
+    pointAttributes_: import("../../render/webgl/BatchRenderer").CustomAttribute[] | undefined;
+    /**
+     * @private
+     */
+    private createRenderers_;
+    createTileRepresentation(options: any): TileGeometry;
+    beforeTilesRender(frameState: any, tilesWithAlpha: any): void;
+    /**
+     * @param {number} alpha Alpha value of the tile
+     * @param {import("../../extent.js").Extent} renderExtent Which extent to restrict drawing to
+     * @param {import("../../transform.js").Transform} batchInvertTransform Inverse of the transformation in which tile geometries are expressed
+     * @private
+     */
+    private applyUniforms_;
+    renderTile(tileRepresentation: any, tileTransform: any, frameState: any, renderExtent: any, tileResolution: any, tileSize: any, tileOrigin: any, tileExtent: any, depth: any, gutter: any, alpha: any): void;
+    /**
+     * Render declutter items for this layer
+     * @param {import("../../Map.js").FrameState} frameState Frame state.
+     */
+    renderDeclutter(frameState: import("../../Map.js").FrameState): void;
+}
+import WebGLBaseTileLayerRenderer from './TileLayerBase.js';
+import TileGeometry from '../../webgl/TileGeometry.js';
+//# sourceMappingURL=VectorTileLayer.d.ts.map

package/renderer/webgl/VectorTileLayer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VectorTileLayer.d.ts","sourceRoot":"","sources":["VectorTileLayer.js"],"names":[],"mappings":";;;;;;6CAwCsB,OAAO,eAAe,EAAE,OAAO;QAAS,MAAM;MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AADhF;;;;GAIG;AAEH;;;;;;;GAOG;AAEH;;;;;;;;GAQG;AAEH;;GAEG;AAEH;;;;GAIG;AACH;IACE;;;OAGG;IACH,qFAFW,OAAO,EAuCjB;IAlCC;;OAEG;IACH,gBAAkC;IAElC;;;OAGG;IACH,yBAA4B;IAC5B;;;OAGG;IACH,uBAA0B;IAC1B;;;OAGG;IACH,4BAA+B;IAE/B;;;;;;OAMG;IACH,oCAAoD;IAEpD,wBAAsC;IACtC,mBAA4B;IAK9B;;OAEG;IACH,eAFW,OAAO,QASjB;IAED;;;OAGG;IACH,sBAoDC;IAlBC,sCACmE;IACnE,wCACuE;IACvE,0FAAwD;IAExD,wCACyE;IACzE,0CAEwB;IACxB,4FAA4D;IAE5D,uCACsE;IACtE,yCAC0E;IAC1E,2FAA0D;IAG5D;;OAEG;IACH,yBAsBC;IAMD,qDAgBC;IAED,8DAMC;IAED;;;;;OAKG;IACH,uBAkBC;IAED,6MA+CC;IAED;;;OAGG;IACH,4BAFW,OAAO,cAAc,EAAE,UAAU,QAEd;CAS/B;uCApUkD,oBAAoB;yBAD9C,6BAA6B"}

package/renderer/webgl/VectorTileLayer.js

@@ -0,0 +1,335 @@
+/**
+ * @module ol/renderer/webgl/VectorTileLayer
+ */
+import EventType from '../../events/EventType.js';
+import LineStringBatchRenderer from '../../render/webgl/LineStringBatchRenderer.js';
+import PointBatchRenderer from '../../render/webgl/PointBatchRenderer.js';
+import PolygonBatchRenderer from '../../render/webgl/PolygonBatchRenderer.js';
+import TileGeometry from '../../webgl/TileGeometry.js';
+import WebGLBaseTileLayerRenderer, {Uniforms} from './TileLayerBase.js';
+import {
+  FILL_FRAGMENT_SHADER,
+  FILL_VERTEX_SHADER,
+  POINT_FRAGMENT_SHADER,
+  POINT_VERTEX_SHADER,
+  STROKE_FRAGMENT_SHADER,
+  STROKE_VERTEX_SHADER,
+  packColor,
+} from './shaders.js';
+import {
+  create as createMat4,
+  fromTransform as mat4FromTransform,
+} from '../../vec/mat4.js';
+import {
+  create as createTransform,
+  makeInverse as makeInverseTransform,
+  multiply as multiplyTransform,
+  setFromArray as setFromTransform,
+} from '../../transform.js';
+import {create as createWebGLWorker} from '../../worker/webgl.js';
+import {getIntersection} from '../../extent.js';
+
+/**
+ * @param {Object<import("./shaders.js").DefaultAttributes,CustomAttributeCallback>} obj Lookup of attribute getters.
+ * @return {Array<import("../../render/webgl/BatchRenderer").CustomAttribute>} An array of attribute descriptors.
+ */
+function toAttributesArray(obj) {
+  return Object.keys(obj).map((key) => ({name: key, callback: obj[key]}));
+}
+
+/**
+ * @typedef {function(import("../../Feature").default, Object<string, *>):number} CustomAttributeCallback A callback computing
+ * the value of a custom attribute (different for each feature) to be passed on to the GPU.
+ * Properties are available as 2nd arg for quicker access.
+ */
+
+/**
+ * @typedef {Object} ShaderProgram An object containing both shaders (vertex and fragment) as well as the required attributes
+ * @property {string} [vertexShader] Vertex shader source (using the default one if unspecified).
+ * @property {string} [fragmentShader] Fragment shader source (using the default one if unspecified).
+ * @property {Object<import("./shaders.js").DefaultAttributes,CustomAttributeCallback>} attributes Custom attributes made available in the vertex shader.
+ * Keys are the names of the attributes which are then accessible in the vertex shader using the `a_` prefix, e.g.: `a_opacity`.
+ * Default shaders rely on the attributes in {@link module:ol/render/webgl/shaders~DefaultAttributes}.
+ */
+
+/**
+ * @typedef {Object} Options
+ * @property {ShaderProgram} [fill] Attributes and shaders for filling polygons.
+ * @property {ShaderProgram} [stroke] Attributes and shaders for line strings and polygon strokes.
+ * @property {ShaderProgram} [point] Attributes and shaders for points.
+ * @property {Object<string, import("../../webgl/Helper").UniformValue>} [uniforms] Additional uniforms
+ * made available to shaders.
+ * @property {number} [cacheSize=512] The vector tile cache size.
+ */
+
+/**
+ * @typedef {import("../../layer/BaseTile.js").default} LayerType
+ */
+
+/**
+ * @classdesc
+ * WebGL renderer for vector tile layers. Experimental.
+ * @extends {WebGLBaseTileLayerRenderer<LayerType>}
+ */
+class WebGLVectorTileLayerRenderer extends WebGLBaseTileLayerRenderer {
+  /**
+   * @param {LayerType} tileLayer Tile layer.
+   * @param {Options} options Options.
+   */
+  constructor(tileLayer, options) {
+    super(tileLayer, options);
+
+    /**
+     * @private
+     */
+    this.worker_ = createWebGLWorker();
+
+    /**
+     * @type {PolygonBatchRenderer}
+     * @private
+     */
+    this.polygonRenderer_ = null;
+    /**
+     * @type {PointBatchRenderer}
+     * @private
+     */
+    this.pointRenderer_ = null;
+    /**
+     * @type {LineStringBatchRenderer}
+     * @private
+     */
+    this.lineStringRenderer_ = null;
+
+    /**
+     * This transform is updated on every frame and is the composition of:
+     * - invert of the world->screen transform that was used when rebuilding buffers (see `this.renderTransform_`)
+     * - current world->screen transform
+     * @type {import("../../transform.js").Transform}
+     * @private
+     */
+    this.currentFrameStateTransform_ = createTransform();
+
+    this.tmpTransform_ = createTransform();
+    this.tmpMat4_ = createMat4();
+
+    this.applyOptions_(options);
+  }
+
+  /**
+   * @param {Options} options Options.
+   */
+  reset(options) {
+    super.reset(options);
+
+    this.applyOptions_(options);
+    if (this.helper) {
+      this.createRenderers_();
+    }
+  }
+
+  /**
+   * @param {Options} options Options.
+   * @private
+   */
+  applyOptions_(options) {
+    const fillAttributes = {
+      color: function () {
+        return packColor('#ddd');
+      },
+      opacity: function () {
+        return 1;
+      },
+      ...(options.fill && options.fill.attributes),
+    };
+
+    const strokeAttributes = {
+      color: function () {
+        return packColor('#eee');
+      },
+      opacity: function () {
+        return 1;
+      },
+      width: function () {
+        return 1.5;
+      },
+      ...(options.stroke && options.stroke.attributes),
+    };
+
+    const pointAttributes = {
+      color: function () {
+        return packColor('#eee');
+      },
+      opacity: function () {
+        return 1;
+      },
+      ...(options.point && options.point.attributes),
+    };
+
+    this.fillVertexShader_ =
+      (options.fill && options.fill.vertexShader) || FILL_VERTEX_SHADER;
+    this.fillFragmentShader_ =
+      (options.fill && options.fill.fragmentShader) || FILL_FRAGMENT_SHADER;
+    this.fillAttributes_ = toAttributesArray(fillAttributes);
+
+    this.strokeVertexShader_ =
+      (options.stroke && options.stroke.vertexShader) || STROKE_VERTEX_SHADER;
+    this.strokeFragmentShader_ =
+      (options.stroke && options.stroke.fragmentShader) ||
+      STROKE_FRAGMENT_SHADER;
+    this.strokeAttributes_ = toAttributesArray(strokeAttributes);
+
+    this.pointVertexShader_ =
+      (options.point && options.point.vertexShader) || POINT_VERTEX_SHADER;
+    this.pointFragmentShader_ =
+      (options.point && options.point.fragmentShader) || POINT_FRAGMENT_SHADER;
+    this.pointAttributes_ = toAttributesArray(pointAttributes);
+  }
+
+  /**
+   * @private
+   */
+  createRenderers_() {
+    this.polygonRenderer_ = new PolygonBatchRenderer(
+      this.helper,
+      this.worker_,
+      this.fillVertexShader_,
+      this.fillFragmentShader_,
+      this.fillAttributes_
+    );
+    this.pointRenderer_ = new PointBatchRenderer(
+      this.helper,
+      this.worker_,
+      this.pointVertexShader_,
+      this.pointFragmentShader_,
+      this.pointAttributes_
+    );
+    this.lineStringRenderer_ = new LineStringBatchRenderer(
+      this.helper,
+      this.worker_,
+      this.strokeVertexShader_,
+      this.strokeFragmentShader_,
+      this.strokeAttributes_
+    );
+  }
+
+  afterHelperCreated() {
+    this.createRenderers_();
+  }
+
+  createTileRepresentation(options) {
+    const tileRep = new TileGeometry(
+      options,
+      this.polygonRenderer_,
+      this.lineStringRenderer_,
+      this.pointRenderer_
+    );
+    // redraw the layer when the tile is ready
+    const listener = () => {
+      if (tileRep.ready) {
+        this.getLayer().changed();
+        tileRep.removeEventListener(EventType.CHANGE, listener);
+      }
+    };
+    tileRep.addEventListener(EventType.CHANGE, listener);
+    return tileRep;
+  }
+
+  beforeTilesRender(frameState, tilesWithAlpha) {
+    super.beforeTilesRender(frameState, true); // always consider that tiles need alpha blending
+    this.helper.makeProjectionTransform(
+      frameState,
+      this.currentFrameStateTransform_
+    );
+  }
+
+  /**
+   * @param {number} alpha Alpha value of the tile
+   * @param {import("../../extent.js").Extent} renderExtent Which extent to restrict drawing to
+   * @param {import("../../transform.js").Transform} batchInvertTransform Inverse of the transformation in which tile geometries are expressed
+   * @private
+   */
+  applyUniforms_(alpha, renderExtent, batchInvertTransform) {
+    // world to screen matrix
+    setFromTransform(this.tmpTransform_, this.currentFrameStateTransform_);
+    multiplyTransform(this.tmpTransform_, batchInvertTransform);
+    this.helper.setUniformMatrixValue(
+      Uniforms.PROJECTION_MATRIX,
+      mat4FromTransform(this.tmpMat4_, this.tmpTransform_)
+    );
+
+    // screen to world matrix
+    makeInverseTransform(this.tmpTransform_, this.currentFrameStateTransform_);
+    this.helper.setUniformMatrixValue(
+      Uniforms.SCREEN_TO_WORLD_MATRIX,
+      mat4FromTransform(this.tmpMat4_, this.tmpTransform_)
+    );
+
+    this.helper.setUniformFloatValue(Uniforms.GLOBAL_ALPHA, alpha);
+    this.helper.setUniformFloatVec4(Uniforms.RENDER_EXTENT, renderExtent);
+  }
+
+  renderTile(
+    tileRepresentation,
+    tileTransform,
+    frameState,
+    renderExtent,
+    tileResolution,
+    tileSize,
+    tileOrigin,
+    tileExtent,
+    depth,
+    gutter,
+    alpha
+  ) {
+    const gutterExtent = getIntersection(tileExtent, renderExtent, tileExtent);
+
+    this.polygonRenderer_.preRender(
+      tileRepresentation.batch.polygonBatch,
+      this.frameState
+    );
+    this.applyUniforms_(
+      alpha,
+      gutterExtent,
+      tileRepresentation.batch.polygonBatch.invertVerticesBufferTransform
+    );
+    this.polygonRenderer_.render(tileRepresentation.batch.polygonBatch);
+
+    this.lineStringRenderer_.preRender(
+      tileRepresentation.batch.lineStringBatch,
+      this.frameState
+    );
+    this.applyUniforms_(
+      alpha,
+      gutterExtent,
+      tileRepresentation.batch.lineStringBatch.invertVerticesBufferTransform
+    );
+    this.lineStringRenderer_.render(tileRepresentation.batch.lineStringBatch);
+
+    this.pointRenderer_.preRender(
+      tileRepresentation.batch.pointBatch,
+      this.frameState
+    );
+    this.applyUniforms_(
+      alpha,
+      gutterExtent,
+      tileRepresentation.batch.pointBatch.invertVerticesBufferTransform
+    );
+    this.pointRenderer_.render(tileRepresentation.batch.pointBatch);
+  }
+
+  /**
+   * Render declutter items for this layer
+   * @param {import("../../Map.js").FrameState} frameState Frame state.
+   */
+  renderDeclutter(frameState) {}
+
+  /**
+   * Clean up.
+   */
+  disposeInternal() {
+    this.worker_.terminate();
+    super.disposeInternal();
+  }
+}
+
+export default WebGLVectorTileLayerRenderer;

package/renderer/webgl/shaders.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shaders.d.ts","sourceRoot":"","sources":["shaders.js"],"names":[],"mappings":"AAKA,6DAA6D;AAE7D;;;;;GAKG;AACH,iCAHW,OAAO,gBAAgB,EAAE,KAAK,GAAC,MAAM,GACpC,MAAM,CAQjB;AAQD;;;;GAIG;AACH,iCAFU,MAAM,CAeX;AAEL;;;GAGG;AACH,mCAFU,MAAM,CASX;AAEL;;;;GAIG;AACH,mCAFU,MAAM,CA6DX;AAEL;;;GAGG;AACH,qCAFU,MAAM,CAyBX;AAEL;;;;GAIG;AACH,kCAFU,MAAM,CA0BX;AAEL;;;GAGG;AACH,oCAFU,MAAM,CASX;gCAhMS,OAAO,GAAC,SAAS,GAAC,OAAO"}
+{"version":3,"file":"shaders.d.ts","sourceRoot":"","sources":["shaders.js"],"names":[],"mappings":"AAKA,6DAA6D;AAE7D;;;;;GAKG;AACH,iCAHW,OAAO,gBAAgB,EAAE,KAAK,GAAC,MAAM,GACpC,MAAM,CAQjB;AAQD;;;;GAIG;AACH,iCAFU,MAAM,CAmBX;AAEL;;;GAGG;AACH,mCAFU,MAAM,CAqCX;AAEL;;;;GAIG;AACH,mCAFU,MAAM,CAiEX;AAEL;;;GAGG;AACH,qCAFU,MAAM,CAoDX;AAEL;;;;GAIG;AACH,kCAFU,MAAM,CA0BX;AAEL;;;GAGG;AACH,oCAFU,MAAM,CAWX;gCAjQS,OAAO,GAAC,SAAS,GAAC,OAAO"}

package/renderer/webgl/shaders.js

@@ -31,7 +31,11 @@ const DECODE_COLOR_EXPRESSION = `vec3(
  * @type {string}
  */
 export const FILL_VERTEX_SHADER = `
+  #ifdef GL_FRAGMENT_PRECISION_HIGH
+  precision highp float;
+  #else
   precision mediump float;
+  #endif
   uniform mat4 u_projectionMatrix;
   attribute vec2 a_position;
   attribute float a_color;
@@ -50,12 +54,40 @@ export const FILL_VERTEX_SHADER = `
  * @type {string}
  */
 export const FILL_FRAGMENT_SHADER = `
+  #ifdef GL_FRAGMENT_PRECISION_HIGH
+  precision highp float;
+  #else
   precision mediump float;
+  #endif
+  uniform float u_globalAlpha;
+  uniform mat4 u_projectionMatrix;
+  uniform mat4 u_screenToWorldMatrix;
+  uniform vec2 u_sizePx;
+  uniform float u_pixelRatio;
+  uniform vec4 u_renderExtent;
   varying vec3 v_color;
   varying float v_opacity;
 
+  vec2 pxToWorld(vec2 pxPos) {
+    vec2 screenPos = 2.0 * pxPos / u_sizePx - 1.0;
+    return (u_screenToWorldMatrix * vec4(screenPos, 0.0, 1.0)).xy;
+  }
+
   void main(void) {
-    gl_FragColor = vec4(v_color, 1.0) * v_opacity;
+    #ifdef GL_FRAGMENT_PRECISION_HIGH
+    vec2 v_worldPos = pxToWorld(gl_FragCoord.xy / u_pixelRatio);
+    if (
+      abs(u_renderExtent[0] - u_renderExtent[2]) > 0.0 && (
+        v_worldPos[0] < u_renderExtent[0] ||
+        v_worldPos[1] < u_renderExtent[1] ||
+        v_worldPos[0] > u_renderExtent[2] ||
+        v_worldPos[1] > u_renderExtent[3]
+      )
+    ) {
+      discard;
+    }
+    #endif
+    gl_FragColor = vec4(v_color, 1.0) * v_opacity * u_globalAlpha;
   }`;
 
 /**
@@ -64,7 +96,11 @@ export const FILL_FRAGMENT_SHADER = `
  * @type {string}
  */
 export const STROKE_VERTEX_SHADER = `
+  #ifdef GL_FRAGMENT_PRECISION_HIGH
+  precision highp float;
+  #else
   precision mediump float;
+  #endif
   uniform mat4 u_projectionMatrix;
   uniform vec2 u_sizePx;
   attribute vec2 a_segmentStart;
@@ -129,8 +165,17 @@ export const STROKE_VERTEX_SHADER = `
  * @type {string}
  */
 export const STROKE_FRAGMENT_SHADER = `
+  #ifdef GL_FRAGMENT_PRECISION_HIGH
+  precision highp float;
+  #else
   precision mediump float;
+  #endif
+  uniform mat4 u_projectionMatrix;
+  uniform mat4 u_screenToWorldMatrix;
+  uniform vec2 u_sizePx;
   uniform float u_pixelRatio;
+  uniform float u_globalAlpha;
+  uniform vec4 u_renderExtent;
   varying vec2 v_segmentStart;
   varying vec2 v_segmentEnd;
   varying float v_angleStart;
@@ -139,6 +184,11 @@ export const STROKE_FRAGMENT_SHADER = `
   varying float v_opacity;
   varying float v_width;
 
+  vec2 pxToWorld(vec2 pxPos) {
+    vec2 screenPos = 2.0 * pxPos / u_sizePx - 1.0;
+    return (u_screenToWorldMatrix * vec4(screenPos, 0.0, 1.0)).xy;
+  }
+
   float segmentDistanceField(vec2 point, vec2 start, vec2 end, float radius) {
     vec2 startToPoint = point - start;
     vec2 startToEnd = end - start;
@@ -149,7 +199,20 @@ export const STROKE_FRAGMENT_SHADER = `
 
   void main(void) {
     vec2 v_currentPoint = gl_FragCoord.xy / u_pixelRatio;
-    gl_FragColor = vec4(v_color, 1.0) * v_opacity;
+    #ifdef GL_FRAGMENT_PRECISION_HIGH
+    vec2 v_worldPos = pxToWorld(v_currentPoint);
+    if (
+      abs(u_renderExtent[0] - u_renderExtent[2]) > 0.0 && (
+        v_worldPos[0] < u_renderExtent[0] ||
+        v_worldPos[1] < u_renderExtent[1] ||
+        v_worldPos[0] > u_renderExtent[2] ||
+        v_worldPos[1] > u_renderExtent[3]
+      )
+    ) {
+      discard;
+    }
+    #endif
+    gl_FragColor = vec4(v_color, 1.0) * v_opacity * u_globalAlpha;
     gl_FragColor *= segmentDistanceField(v_currentPoint, v_segmentStart, v_segmentEnd, v_width);
   }`;
 
@@ -190,9 +253,11 @@ export const POINT_VERTEX_SHADER = `
  */
 export const POINT_FRAGMENT_SHADER = `
   precision mediump float;
+  uniform float u_globalAlpha;
+  uniform vec4 u_renderExtent;
   varying vec3 v_color;
   varying float v_opacity;
 
   void main(void) {
-      gl_FragColor = vec4(v_color, 1.0) * v_opacity;
+      gl_FragColor = vec4(v_color, 1.0) * v_opacity * u_globalAlpha;
   }`;

package/util.js

@@ -33,4 +33,4 @@ export function getUid(obj) {
  * OpenLayers version.
  * @type {string}
  */
-export const VERSION = '7.3.1-dev.1680098251703';
+export const VERSION = '7.3.1-dev.1680173927805';

package/webgl/Helper.d.ts

@@ -478,8 +478,8 @@ declare class WebGLHelper extends Disposable {
      */
     getAttributeLocation(name: string): number;
     /**
-     * Modifies the given transform to apply the rotation/translation/scaling of the given frame state.
-     * The resulting transform can be used to convert world space coordinates to view coordinates.
+     * Sets the given transform to apply the rotation/translation/scaling of the given frame state.
+     * The resulting transform can be used to convert world space coordinates to view coordinates in the [-1, 1] range.
      * @param {import("../Map.js").FrameState} frameState Frame state.
      * @param {import("../transform").Transform} transform Transform to update.
      * @return {import("../transform").Transform} The updated transform object.

package/webgl/Helper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Helper.d.ts","sourceRoot":"","sources":["Helper.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"Helper.d.ts","sourceRoot":"","sources":["Helper.js"],"names":[],"mappings":"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"}