ol 10.6.2-dev.1754987648675 → 10.6.2-dev.1755096180018

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ol",
-  "version": "10.6.2-dev.1754987648675",
+  "version": "10.6.2-dev.1755096180018",
   "description": "OpenLayers mapping library",
   "keywords": [
     "map",

package/render/webgl/ShaderBuilder.d.ts

@@ -1,4 +1,4 @@
-export const COMMON_HEADER: "#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_screenToWorldMatrix;\nuniform vec2 u_viewportSizePx;\nuniform float u_pixelRatio;\nuniform float u_globalAlpha;\nuniform float u_time;\nuniform float u_zoom;\nuniform float u_resolution;\nuniform float u_rotation;\nuniform vec4 u_renderExtent;\nuniform vec2 u_patternOrigin;\nuniform float u_depth;\nuniform mediump int u_hitDetection;\n\nconst float PI = 3.141592653589793238;\nconst float TWO_PI = 2.0 * PI;\nfloat currentLineMetric = 0.; // an actual value will be used in the stroke shaders\n";
+export const COMMON_HEADER: "#ifdef GL_FRAGMENT_PRECISION_HIGH\nprecision highp float;\n#else\nprecision mediump float;\n#endif\nuniform mat4 u_projectionMatrix;\nuniform mat4 u_screenToWorldMatrix;\nuniform vec2 u_viewportSizePx;\nuniform float u_pixelRatio;\nuniform float u_globalAlpha;\nuniform float u_time;\nuniform float u_zoom;\nuniform float u_resolution;\nuniform float u_rotation;\nuniform vec4 u_renderExtent;\nuniform vec2 u_patternOrigin;\nuniform float u_depth;\nuniform mediump int u_hitDetection;\n\nconst float PI = 3.141592653589793238;\nconst float TWO_PI = 2.0 * PI;\nfloat currentLineMetric = 0.; // an actual value will be used in the stroke shaders\n\nvec4 unpackColor(vec2 packedColor) {\n  return vec4(\n    min(floor(packedColor[0] / 256.0) / 255.0, 1.0),\n    min(mod(packedColor[0], 256.0) / 255.0, 1.0),\n    min(floor(packedColor[1] / 256.0) / 255.0, 1.0),\n    min(mod(packedColor[1], 256.0) / 255.0, 1.0)\n  );\n}\n";
 /**
  * @typedef {Object} AttributeDescription
  * @property {string} name Attribute name, as will be declared in the header of the vertex shader (including a_)

package/render/webgl/ShaderBuilder.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ShaderBuilder.d.ts","sourceRoot":"","sources":["ShaderBuilder.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"ShaderBuilder.d.ts","sourceRoot":"","sources":["ShaderBuilder.js"],"names":[],"mappings":"AASA,s7BAwBE;AAIF;;;;;;;GAOG;AAEH;;;;GAIG;AAEH;;;;;;;;;;;;;;;;;GAiBG;AACH;IAEI;;;;OAIG;IACH,kBAAmB;IAEnB;;;;OAIG;IACH,oBAAqB;IAErB;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,8BAEkE;IAElE;;;OAGG;IACH,kCAAsC;IAEtC;;;OAGG;IACH,gCAA0C;IAE1C;;;OAGG;IACH,+BAEC;IAED;;;OAGG;IACH,4BAAqD;IAErD;;;OAGG;IACH,2BAAiC;IAEjC;;;OAGG;IACH,8BAAkC;IAElC;;;OAGG;IACH,mBAAuB;IAEvB;;;OAGG;IACH,+BAAyE;IAEzE;;;OAGG;IACH,+BAEC;IAED;;OAEG;IACH,gCAAmC;IAEnC;;OAEG;IACH,6BAAiD;IAEjD;;OAEG;IACH,8BAAkD;IAElD;;OAEG;IACH,oCAAwC;IAExC;;OAEG;IACH,uCAA8C;IAE9C;;;OAGG;IACH,uCAA0C;IAE1C;;;OAGG;IACH,iBAAqB;IAErB;;;OAGG;IACH,6BAEC;IAED;;;OAGG;IACH,+BAAgC;IAEhC;;;OAGG;IACH,iCAAkC;IAGpC;;;;;;OAMG;IACH,iBAJW,MAAM,QACN,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,GAAC,WAAW,GACvC,aAAa,CAQxB;IAED;;;;;;;;;;;OAWG;IACH,mBARW,MAAM,QACN,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,sBAC5B,MAAM,gBAEN,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,GAE3B,aAAa,CAWxB;IAED;;;;;;OAMG;IACH,oCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,2BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,wCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;OAMG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,6BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;;;;OAMG;IACH,2CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;;;;;OAQG;IACH,yCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;OAEG;IACH,gCAFY,MAAM,CAIjB;IAED;;;;;OAKG;IACH,wCAHW,OAAO,GACN,aAAa,CAKxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;;OAGG;IACH,qCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,4BAFY,MAAM,CAIjB;IAED;;;OAGG;IACH,sCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,oCAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;OAGG;IACH,0CAHW,MAAM,GACL,aAAa,CAKxB;IAED;;;;OAIG;IACH,6CAJW,MAAM,GAEL,aAAa,CAKxB;IAED;;;;;;;;OAQG;IACH,6CAJW,MAAM,GAEL,aAAa,CAKxB;IAED;;OAEG;IACH,oCAFY,MAAM,CAIjB;IAED;;;OAGG;IACH,mCAHW,MAAM,GACL,aAAa,CAMxB;IAED;;OAEG;IACH,0BAFY,MAAM,CAIjB;IAED,yCAMC;IACD,2CAMC;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAgEtB;IAED;;;OAGG;IACH,2BAFY,MAAM,GAAC,IAAI,CAwCtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CA8HtB;IAED;;;;OAIG;IACH,2BAFY,MAAM,GAAC,IAAI,CA4KtB;IAED;;;;OAIG;IACH,uBAFY,MAAM,GAAC,IAAI,CA+BtB;IAED;;;OAGG;IACH,yBAFY,MAAM,GAAC,IAAI,CAyDtB;CACF;;;;;UA38Ba,MAAM;;;;UACN,MAAM;;;;iBACN,MAAM;;;;iBACN,MAAM;;;;uBACN,MAAM;;;;;;UAKN,MAAM;;;;UACN,MAAM"}

package/render/webgl/ShaderBuilder.js

@@ -5,6 +5,7 @@
 import {colorToGlsl, numberToGlsl, stringToGlsl} from '../../expr/gpu.js';
 import {createDefaultStyle} from '../../style/flat.js';
 import {LINESTRING_ANGLE_COSINE_CUTOFF} from './bufferUtil.js';
+import {UNPACK_COLOR_FN} from './compileUtil.js';
 
 export const COMMON_HEADER = `#ifdef GL_FRAGMENT_PRECISION_HIGH
 precision highp float;
@@ -28,6 +29,8 @@ uniform mediump int u_hitDetection;
 const float PI = 3.141592653589793238;
 const float TWO_PI = 2.0 * PI;
 float currentLineMetric = 0.; // an actual value will be used in the stroke shaders
+
+${UNPACK_COLOR_FN}
 `;
 
 const DEFAULT_STYLE = createDefaultStyle();
@@ -503,7 +506,7 @@ export class ShaderBuilder {
 ${this.uniforms_.map((uniform) => `uniform ${uniform.type} ${uniform.name};`).join('\n')}
 attribute vec2 a_position;
 attribute vec2 a_localPosition;
-attribute vec4 a_hitColor;
+attribute vec2 a_hitColor;
 
 varying vec2 v_texCoord;
 varying vec2 v_quadCoord;
@@ -543,7 +546,7 @@ void main(void) {
   float u = mix(texCoord.s, texCoord.p, a_localPosition.x * 0.5 + 0.5);
   float v = mix(texCoord.t, texCoord.q, a_localPosition.y * 0.5 + 0.5);
   v_texCoord = vec2(u, v);
-  v_hitColor = a_hitColor;
+  v_hitColor = unpackColor(a_hitColor);
   v_angle = angle;
   c = cos(-v_angle);
   s = sin(-v_angle);
@@ -622,7 +625,7 @@ attribute float a_angleTangentSum;
 attribute float a_distanceLow;
 attribute float a_distanceHigh;
 attribute vec2 a_joinAngles;
-attribute vec4 a_hitColor;
+attribute vec2 a_hitColor;
 
 varying vec2 v_segmentStartPx;
 varying vec2 v_segmentEndPx;
@@ -709,7 +712,7 @@ void main(void) {
   v_segmentStartPx = segmentStartPx;
   v_segmentEndPx = segmentEndPx;
   v_width = lineWidth;
-  v_hitColor = a_hitColor;
+  v_hitColor = unpackColor(a_hitColor);
 
   v_distancePx = a_distanceLow / u_resolution - (lineOffsetPx * a_angleTangentSum);
   float distanceHighPx = a_distanceHigh / u_resolution;
@@ -922,7 +925,7 @@ ${this.attributes_
     return `${COMMON_HEADER}
 ${this.uniforms_.map((uniform) => `uniform ${uniform.type} ${uniform.name};`).join('\n')}
 attribute vec2 a_position;
-attribute vec4 a_hitColor;
+attribute vec2 a_hitColor;
 
 varying vec4 v_hitColor;
 
@@ -935,7 +938,7 @@ varying ${attribute.varyingType} ${attribute.varyingName};`,
 ${this.vertexShaderFunctions_.join('\n')}
 void main(void) {
   gl_Position = u_projectionMatrix * vec4(a_position, u_depth, 1.0);
-  v_hitColor = a_hitColor;
+  v_hitColor = unpackColor(a_hitColor);
 ${this.attributes_
   .map(
     (attribute) =>

package/render/webgl/VectorStyleRenderer.js

@@ -10,7 +10,7 @@ import {AttributeType} from '../../webgl/Helper.js';
 import {ARRAY_BUFFER, DYNAMIC_DRAW, ELEMENT_ARRAY_BUFFER} from '../../webgl.js';
 import {create as createWebGLWorker} from '../../worker/webgl.js';
 import {WebGLWorkerMessageType} from './constants.js';
-import {colorEncodeId} from './encodeUtil.js';
+import {colorEncodeIdAndPack} from './encodeUtil.js';
 import {
   generateLineStringRenderInstructions,
   generatePointRenderInstructions,
@@ -170,9 +170,9 @@ class VectorStyleRenderer {
     if (this.hitDetectionEnabled_) {
       this.customAttributes_['hitColor'] = {
         callback() {
-          return colorEncodeId(this.ref, tmpColor);
+          return colorEncodeIdAndPack(this.ref, tmpColor);
         },
-        size: 4,
+        size: 2,
       };
     }
 

package/render/webgl/compileUtil.d.ts

@@ -13,6 +13,13 @@ export function expressionToGlsl(compilationContext: import("../../expr/gpu.js")
  * @return {Array<number>} Vec2 array containing the color in compressed form
  */
 export function packColor(color: import("../../color.js").Color | string): Array<number>;
+/**
+ * Unpacks a color from a packed color in two-floats array form
+ * NOTE: this is only used for testing purposes
+ * @param {Array<number>} packedColor Packed color generated by the `packColor` function
+ * @return {Array<number>} Resulting unpacked color in array form with components in the range [0, 1]
+ */
+export function unpackColor(packedColor: Array<number>): Array<number>;
 /**
  * @param {number} type Value type
  * @return {1|2|3|4} The amount of components for this value
@@ -47,5 +54,9 @@ export function generateUniformsFromContext(context: import("../../expr/gpu.js")
  * @return {import('./VectorStyleRenderer.js').AttributeDefinitions} Attributes
  */
 export function generateAttributesFromContext(context: import("../../expr/gpu.js").CompilationContext): import("./VectorStyleRenderer.js").AttributeDefinitions;
-export const UNPACK_COLOR_FN: "vec4 unpackColor(vec2 packedColor) {\n  return vec4(\n    fract(floor(packedColor[0] / 256.0) / 256.0),\n    fract(packedColor[0] / 256.0),\n    fract(floor(packedColor[1] / 256.0) / 256.0),\n    fract(packedColor[1] / 256.0)\n  );\n}";
+/**
+ * Equivalent of `unpackColor()` in GLSL
+ * @type {string}
+ */
+export const UNPACK_COLOR_FN: string;
 //# sourceMappingURL=compileUtil.d.ts.map

package/render/webgl/compileUtil.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"compileUtil.d.ts","sourceRoot":"","sources":["compileUtil.js"],"names":[],"mappings":"AAkBA;;;;;;;GAOG;AACH,qDALW,OAAO,mBAAmB,EAAE,kBAAkB,SAC9C,OAAO,0BAA0B,EAAE,iBAAiB,iBACpD,MAAM,GACL,MAAM,CAUjB;AAED;;;;GAIG;AACH,iCAHW,OAAO,gBAAgB,EAAE,KAAK,GAAC,MAAM,GACpC,KAAK,CAAC,MAAM,CAAC,CASxB;AAWD;;;GAGG;AACH,0CAHW,MAAM,GACL,CAAC,GAAC,CAAC,GAAC,CAAC,GAAC,CAAC,CAUlB;AAED;;;GAGG;AACH,0CAHW,MAAM,GACL,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,CAQvC;AAED;;;;;GAKG;AACH,+CAHW,OAAO,oBAAoB,EAAE,aAAa,WAC1C,OAAO,mBAAmB,EAAE,kBAAkB,QAuCxD;AAED;;;;;;GAMG;AACH,qDAJW,OAAO,mBAAmB,EAAE,kBAAkB,cAC9C,OAAO,qBAAqB,EAAE,cAAc;;EAoCtD;AAED;;;;;GAKG;AACH,uDAHW,OAAO,mBAAmB,EAAE,kBAAkB,GAC7C,OAAO,0BAA0B,EAAE,oBAAoB,CA+BlE;AA7JD,2QAOG"}
+{"version":3,"file":"compileUtil.d.ts","sourceRoot":"","sources":["compileUtil.js"],"names":[],"mappings":"AAkBA;;;;;;;GAOG;AACH,qDALW,OAAO,mBAAmB,EAAE,kBAAkB,SAC9C,OAAO,0BAA0B,EAAE,iBAAiB,iBACpD,MAAM,GACL,MAAM,CAUjB;AAED;;;;GAIG;AACH,iCAHW,OAAO,gBAAgB,EAAE,KAAK,GAAC,MAAM,GACpC,KAAK,CAAC,MAAM,CAAC,CASxB;AAED;;;;;GAKG;AACH,yCAHW,KAAK,CAAC,MAAM,CAAC,GACZ,KAAK,CAAC,MAAM,CAAC,CASxB;AAeD;;;GAGG;AACH,0CAHW,MAAM,GACL,CAAC,GAAC,CAAC,GAAC,CAAC,GAAC,CAAC,CAUlB;AAED;;;GAGG;AACH,0CAHW,MAAM,GACL,OAAO,GAAC,MAAM,GAAC,MAAM,GAAC,MAAM,CAQvC;AAED;;;;;GAKG;AACH,+CAHW,OAAO,oBAAoB,EAAE,aAAa,WAC1C,OAAO,mBAAmB,EAAE,kBAAkB,QAsCxD;AAED;;;;;;GAMG;AACH,qDAJW,OAAO,mBAAmB,EAAE,kBAAkB,cAC9C,OAAO,qBAAqB,EAAE,cAAc;;EAoCtD;AAED;;;;;GAKG;AACH,uDAHW,OAAO,mBAAmB,EAAE,kBAAkB,GAC7C,OAAO,0BAA0B,EAAE,oBAAoB,CA+BlE;AAhKD;;;GAGG;AACH,8BAFU,MAAM,CASb"}

package/render/webgl/compileUtil.js

@@ -48,12 +48,31 @@ export function packColor(color) {
   return [r + g, b + a];
 }
 
+/**
+ * Unpacks a color from a packed color in two-floats array form
+ * NOTE: this is only used for testing purposes
+ * @param {Array<number>} packedColor Packed color generated by the `packColor` function
+ * @return {Array<number>} Resulting unpacked color in array form with components in the range [0, 1]
+ */
+export function unpackColor(packedColor) {
+  return [
+    Math.min(Math.floor(packedColor[0] / 256.0) / 255.0, 1),
+    Math.min((packedColor[0] % 256.0) / 255.0, 1),
+    Math.min(Math.floor(packedColor[1] / 256.0) / 255.0, 1),
+    Math.min((packedColor[1] % 256.0) / 255.0, 1),
+  ];
+}
+
+/**
+ * Equivalent of `unpackColor()` in GLSL
+ * @type {string}
+ */
 export const UNPACK_COLOR_FN = `vec4 unpackColor(vec2 packedColor) {
   return vec4(
-    fract(floor(packedColor[0] / 256.0) / 256.0),
-    fract(packedColor[0] / 256.0),
-    fract(floor(packedColor[1] / 256.0) / 256.0),
-    fract(packedColor[1] / 256.0)
+    min(floor(packedColor[0] / 256.0) / 255.0, 1.0),
+    min(mod(packedColor[0], 256.0) / 255.0, 1.0),
+    min(floor(packedColor[1] / 256.0) / 255.0, 1.0),
+    min(mod(packedColor[1], 256.0) / 255.0, 1.0)
   );
 }`;
 
@@ -115,7 +134,6 @@ export function applyContextToBuilder(builder, context) {
         `unpackColor(${attributeName})`,
         'vec4',
       );
-      builder.addVertexShaderFunction(UNPACK_COLOR_FN);
     } else {
       builder.addAttribute(attributeName, glslType);
     }

package/render/webgl/encodeUtil.d.ts

@@ -3,17 +3,17 @@
  * @module ol/render/webgl/encodeUtil
  */
 /**
- * Generates a color array based on a numerical id
+ * Generates a color array based on a numerical id, and pack it just like the `packColor` function of 'ol/render/webgl/compileUtil.js'.
  * Note: the range for each component is 0 to 1 with 256 steps
  * @param {number} id Id
  * @param {Array<number>} [array] Reusable array
- * @return {Array<number>} Color array containing the encoded id
+ * @return {Array<number>} Packed color array with two components
  */
-export function colorEncodeId(id: number, array?: Array<number>): Array<number>;
+export function colorEncodeIdAndPack(id: number, array?: Array<number>): Array<number>;
 /**
  * Reads an id from a color-encoded array
  * Note: the expected range for each component is 0 to 1 with 256 steps.
- * @param {Array<number>} color Color array containing the encoded id
+ * @param {Array<number>} color Color array containing the encoded id; color components are in the range 0 to 1
  * @return {number} Decoded id
  */
 export function colorDecodeId(color: Array<number>): number;

package/render/webgl/encodeUtil.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"encodeUtil.d.ts","sourceRoot":"","sources":["encodeUtil.js"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;;;GAMG;AACH,kCAJW,MAAM,UACN,KAAK,CAAC,MAAM,CAAC,GACZ,KAAK,CAAC,MAAM,CAAC,CAWxB;AAED;;;;;GAKG;AACH,qCAHW,KAAK,CAAC,MAAM,CAAC,GACZ,MAAM,CAWjB"}
+{"version":3,"file":"encodeUtil.d.ts","sourceRoot":"","sources":["encodeUtil.js"],"names":[],"mappings":"AAAA;;;GAGG;AAEH;;;;;;GAMG;AACH,yCAJW,MAAM,UACN,KAAK,CAAC,MAAM,CAAC,GACZ,KAAK,CAAC,MAAM,CAAC,CAaxB;AAED;;;;;GAKG;AACH,qCAHW,KAAK,CAAC,MAAM,CAAC,GACZ,MAAM,CAWjB"}

package/render/webgl/encodeUtil.js

@@ -4,27 +4,29 @@
  */
 
 /**
- * Generates a color array based on a numerical id
+ * Generates a color array based on a numerical id, and pack it just like the `packColor` function of 'ol/render/webgl/compileUtil.js'.
  * Note: the range for each component is 0 to 1 with 256 steps
  * @param {number} id Id
  * @param {Array<number>} [array] Reusable array
- * @return {Array<number>} Color array containing the encoded id
+ * @return {Array<number>} Packed color array with two components
  */
-export function colorEncodeId(id, array) {
+export function colorEncodeIdAndPack(id, array) {
   array = array || [];
   const radix = 256;
   const divide = radix - 1;
-  array[0] = Math.floor(id / radix / radix / radix) / divide;
-  array[1] = (Math.floor(id / radix / radix) % radix) / divide;
-  array[2] = (Math.floor(id / radix) % radix) / divide;
-  array[3] = (id % radix) / divide;
+  const r = Math.floor(id / radix / radix / radix) / divide;
+  const g = (Math.floor(id / radix / radix) % radix) / divide;
+  const b = (Math.floor(id / radix) % radix) / divide;
+  const a = (id % radix) / divide;
+  array[0] = r * 256 * 255 + g * 255;
+  array[1] = b * 256 * 255 + a * 255;
   return array;
 }
 
 /**
  * Reads an id from a color-encoded array
  * Note: the expected range for each component is 0 to 1 with 256 steps.
- * @param {Array<number>} color Color array containing the encoded id
+ * @param {Array<number>} color Color array containing the encoded id; color components are in the range 0 to 1
  * @return {number} Decoded id
  */
 export function colorDecodeId(color) {

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

@@ -1 +1 @@
-{"version":3,"file":"PointsLayer.d.ts","sourceRoot":"","sources":["PointsLayer.js"],"names":[],"mappings":";oBA4Bc,OAAO,qBAAqB,EAAE,OAAO;2BACrC,OAAO,eAAe,EAAE,OAAO,CAAC,KAAK,CAAC;;;;;;;;;UAKtC,MAAM;;;;;cACN,CAAS,IAAY,EAAZ,YAAY,EAAE,IAAiB,EAAjB;YAAO,MAAM,GAAE,GAAC;KAAC,KAAE,MAAM;;;;;;;;;;aAOhD,YAAY;;;;;;;;;;qBAEZ,OAAO,qBAAqB,EAAE,UAAU;;;;;;;;;;;;;;;;;;kBAWxC,MAAM;;;;oBACN,MAAM;;;;;;;;;;;;;;;;;AA5BpB,6DAA6D;AAC7D,qEAAqE;AAErE;;;;;;GAMG;AAEH;;;;;;GAMG;AAEH;;;;;;;;;;;;;;GAcG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8DG;AACH;IACE;;;OAGG;IACH,mBAHW,OAAO,sBAAsB,EAAE,OAAO,WACtC,OAAO,EAyPjB;IA7OC;;OAEG;IACH,wBAAyB;IAEzB;;OAEG;IACH,wBAAuE;IACvE;;OAEG;IACH,kCAGC;IACD;;OAEG;IACH,uBAGC;IAED;;OAEG;IACH,sBAAyC;IAEzC;;OAEG;IACH,wBAA6C;IAE7C;;;OAGG;IACH,iBAAa;IAEb;;;OAGG;IACH,6BAA+D;IAY/D;;;OAGG;IACH,YAFU,KAAK,CAAC,OAAO,uBAAuB,EAAE,oBAAoB,CAAC,CAQpE;IAED;;OAEG;IACH,oBAFU,KAAK,CAAC,OAAO,uBAAuB,EAAE,oBAAoB,CAAC,CAQpE;IAgBD,oCAAoE;IAEpE;;OAEG;IACH,wBAAoC;IAEpC;;;;;;OAMG;IACH,0BAAkD;IAElD;;;;OAIG;IACH,yBAAyC;IAEzC;;;OAGG;IACH,+BAA+C;IAE/C;;;OAGG;IACH,4BAA8C;IAE9C;;;OAGG;IACH,yBAAqB;IAErB;;;;OAIG;IACH,mBAAmB;IAEnB;;OAEG;IACH,gBAAkC;IAoClC;;;;OAIG;IACH,sBAAuB;IAEvB;;;;OAIG;IACH,sBAAsB;IAKtB;;OAEG;IACH,0BAyBC;IAoCH;;;OAGG;IACH,kCAWC;IAED;;;OAGG;IACH,oCAyBC;IAED;;;OAGG;IACH,mCAOC;IAED;;OAEG;IACH,kCAGC;IAED;;;;;OAKG;IACH,iCAJW,OAAO,cAAc,EAAE,UAAU,GAChC,WAAW,CA6BtB;IAyCD;;;;OAIG;IACH,wBAwEC;IA8CD;;;;;;;OAOG;IACH,yBANW,OAAO,cAAc,EAAE,UAAU,mBACjC,OAAO,cACP,MAAM,YACN,MAAM,cACN,MAAM,QAyChB;IAeD,wBAAoB;CACrB;+BAjsB8B,YAAY"}
+{"version":3,"file":"PointsLayer.d.ts","sourceRoot":"","sources":["PointsLayer.js"],"names":[],"mappings":";oBA+Bc,OAAO,qBAAqB,EAAE,OAAO;2BACrC,OAAO,eAAe,EAAE,OAAO,CAAC,KAAK,CAAC;;;;;;;;;UAKtC,MAAM;;;;;cACN,CAAS,IAAY,EAAZ,YAAY,EAAE,IAAiB,EAAjB;YAAO,MAAM,GAAE,GAAC;KAAC,KAAE,MAAM;;;;;;;;;;aAOhD,YAAY;;;;;;;;;;qBAEZ,OAAO,qBAAqB,EAAE,UAAU;;;;;;;;;;;;;;;;;;kBAWxC,MAAM;;;;oBACN,MAAM;;;;;;;;;;;;;;;;;AA5BpB,6DAA6D;AAC7D,qEAAqE;AAErE;;;;;;GAMG;AAEH;;;;;;GAMG;AAEH;;;;;;;;;;;;;;GAcG;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8DG;AACH;IACE;;;OAGG;IACH,mBAHW,OAAO,sBAAsB,EAAE,OAAO,WACtC,OAAO,EAyPjB;IA7OC;;OAEG;IACH,wBAAyB;IAEzB;;OAEG;IACH,wBAAuE;IACvE;;OAEG;IACH,kCAGC;IACD;;OAEG;IACH,uBAGC;IAED;;OAEG;IACH,sBAAyC;IAEzC;;OAEG;IACH,wBAA6C;IAE7C;;;OAGG;IACH,iBAAa;IAEb;;;OAGG;IACH,6BAA+D;IAY/D;;;OAGG;IACH,YAFU,KAAK,CAAC,OAAO,uBAAuB,EAAE,oBAAoB,CAAC,CAQpE;IAED;;OAEG;IACH,oBAFU,KAAK,CAAC,OAAO,uBAAuB,EAAE,oBAAoB,CAAC,CAQpE;IAgBD,oCAAoE;IAEpE;;OAEG;IACH,wBAAoC;IAEpC;;;;;;OAMG;IACH,0BAAkD;IAElD;;;;OAIG;IACH,yBAAyC;IAEzC;;;OAGG;IACH,+BAA+C;IAE/C;;;OAGG;IACH,4BAA8C;IAE9C;;;OAGG;IACH,yBAAqB;IAErB;;;;OAIG;IACH,mBAAmB;IAEnB;;OAEG;IACH,gBAAkC;IAoClC;;;;OAIG;IACH,sBAAuB;IAEvB;;;;OAIG;IACH,sBAAsB;IAKtB;;OAEG;IACH,0BAyBC;IAoCH;;;OAGG;IACH,kCAWC;IAED;;;OAGG;IACH,oCAyBC;IAED;;;OAGG;IACH,mCAOC;IAED;;OAEG;IACH,kCAGC;IAED;;;;;OAKG;IACH,iCAJW,OAAO,cAAc,EAAE,UAAU,GAChC,WAAW,CA6BtB;IAyCD;;;;OAIG;IACH,wBAsEC;IA8CD;;;;;;;OAOG;IACH,yBANW,OAAO,cAAc,EAAE,UAAU,mBACjC,OAAO,cACP,MAAM,YACN,MAAM,cACN,MAAM,QAyChB;IAeD,wBAAoB;CACrB;+BA/rB8B,YAAY"}

package/renderer/webgl/PointsLayer.js

@@ -8,7 +8,10 @@ import {buffer, createEmpty, equals} from '../../extent.js';
 import BaseVector from '../../layer/BaseVector.js';
 import {fromUserCoordinate, getUserProjection} from '../../proj.js';
 import {WebGLWorkerMessageType} from '../../render/webgl/constants.js';
-import {colorDecodeId, colorEncodeId} from '../../render/webgl/encodeUtil.js';
+import {
+  colorDecodeId,
+  colorEncodeIdAndPack,
+} from '../../render/webgl/encodeUtil.js';
 import VectorEventType from '../../source/VectorEventType.js';
 import {
   apply as applyTransform,
@@ -221,7 +224,7 @@ class WebGLPointsLayerRenderer extends WebGLLayerRenderer {
     if (this.hitDetectionEnabled_) {
       this.instanceAttributes.push({
         name: 'a_hitColor',
-        size: 4,
+        size: 2,
         type: AttributeType.FLOAT,
       });
       this.instanceAttributes.push({
@@ -554,7 +557,7 @@ class WebGLPointsLayerRenderer extends WebGLLayerRenderer {
 
     const userProjection = getUserProjection();
 
-    const baseInstructionLength = this.hitDetectionEnabled_ ? 7 : 2; // see below
+    const baseInstructionLength = this.hitDetectionEnabled_ ? 5 : 2; // see below
     const singleInstructionLength =
       baseInstructionLength + this.customAttributes.length;
     const totalSize = singleInstructionLength * this.featureCount_;
@@ -590,11 +593,9 @@ class WebGLPointsLayerRenderer extends WebGLLayerRenderer {
       // for hit detection, the feature uid is saved in the opacity value
       // and the index of the opacity value is encoded in the color values
       if (this.hitDetectionEnabled_) {
-        const hitColor = colorEncodeId(idx + 5, tmpColor);
+        const hitColor = colorEncodeIdAndPack(idx + 3, tmpColor);
         renderInstructions[++idx] = hitColor[0];
         renderInstructions[++idx] = hitColor[1];
-        renderInstructions[++idx] = hitColor[2];
-        renderInstructions[++idx] = hitColor[3];
         renderInstructions[++idx] = Number(featureUid);
       }
 

package/util.js

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