@pirireis/webglobeplugins 1.1.14 → 1.1.16

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@pirireis/webglobeplugins",
-    "version": "1.1.14",
+    "version": "1.1.16",
     "main": "index.js",
     "author": "Toprak Nihat Deniz Ozturk",
     "license": "MIT",

package/programs/polygon-on-globe/texture-dem-triangles.js

@@ -4,7 +4,7 @@ import { DemTextureManagerCache, DEM_TEXTURE_BLOCK_STRING } from "../totems/atta
 import { cartesian3DToGLPosition, mercatorXYToGLPosition, POLE_BY_PI } from "../../util/shaderfunctions/geometrytransformations";
 import { relativeBBoxPositionRadian } from "../../util/shaderfunctions/geometrytransformations";
 import { drawArrays } from "../../util/gl-util/draw-options/methods";
-import { attributeLoader } from "../../util/gl-util/buffer/attribute-loader";
+import { attributeLoader, resetAttributeDefault, setDefaultAttributeValues } from "../../util/gl-util/buffer/attribute-loader";
 import { WORLD_RADIUS_3D } from "../../Math/constants";
 import { UniformBlockManager } from "../../util/gl-util/uniform-block/manager";
 // const ESCAPE_VALUE = 0.123456;
@@ -15,7 +15,7 @@ const uniformBindingPoints = {
     selection: 3,
 };
 // last value of uint16 is 65535
-export const IndexAttributeEscapeValue = 65535;
+export const IndexAttributeEscapeValue = -1;
 const styleBlockManager = new UniformBlockManager('Style', [
     { name: "defaultColor", type: "vec4", value: new Float32Array([0.0, 0.0, 0.0, 0.0]) },
     { name: "pickedColor", type: "vec4", value: new Float32Array([0, 0, 0, 0]) },
@@ -55,6 +55,8 @@ void main() {
     float elevation = ${WORLD_RADIUS_3D};
     float altitude = 0.0;
 
+    // Always define v_index to avoid undefined varyings when picking is disabled.
+
     vec4 decodedColor = vec4(
         float(a_color.r) / 255.0,
         float(a_color.g) / 255.0,
@@ -119,10 +121,6 @@ void main() {
     outIndex = v_index;
 }
 `;
-function resCalculation(sourceResolution, mergeCount) {
-    return sourceResolution + (mergeCount - 1) * (sourceResolution - 1);
-}
-const RESOLUTION = resCalculation(5, 20); // 5 is tile dimension length, 12 is merge count
 export class TextureDemTriangles {
     globe;
     gl;
@@ -208,13 +206,24 @@ export class TextureDemTriangles {
         this.demTextureManager.bindData(0, uniformBindingPoints.dem);
         gl.bindVertexArray(vao);
         ubo.bind();
-        if (this.globe.api_GetCurrentLODWithDecimal() < 14.5) {
-            drawOnTopBegin(gl);
-        }
+        // This program has two fragment outputs (location 0: color, location 1: index).
+        // When rendering to the default framebuffer (no picking FBO bound), only location 0
+        // is valid; explicitly discard location 1 to avoid GL_INVALID_OPERATION.
+        // const boundFbo = gl.getParameter(gl.FRAMEBUFFER_BINDING) as WebGLFramebuffer | null;
+        // if (boundFbo == null) {
+        // gl.drawBuffers([gl.BACK, gl.NONE]);
+        // // }
+        // if (this.globe.api_GetCurrentLODWithDecimal() < 14.5) {
+        //     drawOnTopBegin(gl);
+        // }
         drawArrays(gl, drawOptions.drawMode ?? gl.TRIANGLES, drawOptions);
-        if (this.globe.api_GetCurrentLODWithDecimal() < 14.5) {
-            drawOnTopEnd(gl);
-        }
+        // if (this.globe.api_GetCurrentLODWithDecimal() < 14.5) {
+        //     drawOnTopEnd(gl);
+        // }
+        // if (boundFbo == null) {
+        //     // Restore the default draw buffer mapping for subsequent draws.
+        //     gl.drawBuffers([gl.BACK]);
+        // }
         this.demTextureManager.unbindData(0, uniformBindingPoints.dem);
         gl.bindVertexArray(null);
         gl.bindTexture(gl.TEXTURE_2D_ARRAY, null);
@@ -222,6 +231,18 @@ export class TextureDemTriangles {
         ubo.unbind();
         this.cameraUniformBlock.unbind(uniformBindingPoints.camera);
     }
+    setDefaultDefaultAttributeValues() {
+        const gl = this.gl;
+        setDefaultAttributeValues(gl, this.locations.attributes.a_index, 1, [IndexAttributeEscapeValue], "uint16");
+        setDefaultAttributeValues(gl, this.locations.attributes.a_color, 4, [0, 0, 0, 255], "uint8");
+    }
+    resetDefaultAttributeValues() {
+        const gl = this.gl;
+        gl.disableVertexAttribArray(this.locations.attributes.a_index);
+        resetAttributeDefault(gl, this.locations.attributes.a_index);
+        gl.disableVertexAttribArray(this.locations.attributes.a_color);
+        resetAttributeDefault(gl, this.locations.attributes.a_color);
+    }
     _getUniformBlockOffset(name) {
         // hardcoded offsets based on std140 layout rules
         const offsets = {
@@ -234,25 +255,3 @@ export class TextureDemTriangles {
         return result;
     }
 }
-function drawOnTopBegin(gl) {
-    gl.disable(gl.DEPTH_TEST);
-    // gl.enable(gl.POLYGON_OFFSET_FILL);
-    // // Use an offset to "nudge" the depth value slightly closer or farther.
-    // // Common values are gl.polygonOffset(1.0, 1.0) or gl.polygonOffset(0.RESOLUTION, 0.RESOLUTION)
-    // gl.polygonOffset(1.0, 1.0);
-    // gl.depthRange(0.0, 0.0001);  // Use near 0.01% of depth range
-    // gl.enable(gl.POLYGON_OFFSET_FILL);
-    // You will need to experiment with these values!
-    // A good starting point is -1.0, -1.0.
-    // Negative values "pull" the fragments closer to the camera.
-    // gl.polygonOffset(-1.0, -1.0);
-    // gl.enable(gl.POLYGON_OFFSET_FILL);
-    // gl.polygonOffset(-1.0, -2.0);
-}
-function drawOnTopEnd(gl) {
-    gl.enable(gl.DEPTH_TEST);
-    // gl.disable(gl.POLYGON_OFFSET_FILL);
-    // gl.disable(gl.POLYGON_OFFSET_FILL);
-    // gl.depthRange(0.0, 1.0);  // Restore full depth range
-    // gl.disable(gl.POLYGON_OFFSET_FILL);
-}

package/semiplugins/shape-on-terrain/terrain-polygon/terrain-polygon.js

@@ -114,11 +114,15 @@ export class TerrainPolygonSemiPlugin {
             this._uboHandler.updateSingle("private_isPickedOn", new Float32Array([1.0]));
             this._uboHandler.updateSingle("pickedColor", new Float32Array(this._options.polygonStyle.pickedColor));
         }
+        else {
+            this._uboHandler.updateSingle("private_isPickedOn", new Float32Array([0.0]));
+        }
         if (this._options.drawEdges) {
             this._uboForRealEdgeArcs = this._program.createUBO();
             this._uboForRealEdgeArcs.updateSingle("defaultColor", new Float32Array(this._options.edgeStyle.defaultColor));
             this._uboForRealEdgeArcs.updateSingle("useDefaultColor", new Float32Array([1]));
             this._uboForRealEdgeArcs.updateSingle("opacity", this._effectiveOpacity("edgeArc"));
+            this._uboForRealEdgeArcs.updateSingle("private_isPickedOn", new Float32Array([0.0]));
             this._drawRealEdgeArcs.elementBuffer = gl.createBuffer();
         }
         if (this._options.variativeColorsOn) {
@@ -373,6 +377,7 @@ export class TerrainPolygonSemiPlugin {
         gl.disable(gl.DEPTH_TEST);
         gl.enable(gl.BLEND);
         defaultblendfunction(gl);
+        this._program.setDefaultDefaultAttributeValues();
         // drawPoints 
         if (this._options.showTesselationPoints) {
             this._program.draw(this._vao, this._drawPointsRangeIndexParams, this._uboHandler);
@@ -397,6 +402,7 @@ export class TerrainPolygonSemiPlugin {
             this._program.draw(this._vao, this._drawRealEdgeArcs, this._uboForRealEdgeArcs);
             // gl.disable(gl.POLYGON_OFFSET_FILL);
         }
+        this._program.resetDefaultAttributeValues();
         gl.enable(gl.DEPTH_TEST);
     }
     free() {

package/util/gl-util/buffer/attribute-loader.js

@@ -8,10 +8,25 @@ const DATA_TYPE_MAP = {
     uint32: { getGLType: (gl) => gl.UNSIGNED_INT, useIntegerPointer: true, isSigned: false },
 };
 const attributeLoader = (gl, bufferAndReadInfo, index, size, { divisor = null, dataType = null, escapeValues = null, normalized = false, } = {}) => {
+    // WebGL returns -1 for inactive attributes (optimized out). Treat as a no-op.
+    // This also avoids accidentally mutating global generic attribute state.
+    if (index < 0) {
+        return;
+    }
     const typeInfo = dataType ? DATA_TYPE_MAP[dataType] : DATA_TYPE_MAP.float;
     if (bufferAndReadInfo == null || bufferAndReadInfo.buffer == null) {
-        if (escapeValues)
-            constantFunction(gl, index, size, escapeValues, typeInfo);
+        // Disable array and set constant value
+        gl.disableVertexAttribArray(index);
+        // If the shader expects an integer attribute (in uint/int/ivec*/uvec*),
+        // WebGL requires the constant to be set via vertexAttribI4i/vertexAttribI4ui.
+        // Otherwise you'll hit: "Vertex shader input type does not match...".
+        if (escapeValues != null) {
+            setConstantAttribute(gl, index, size, escapeValues, typeInfo);
+        }
+        else if (typeInfo.useIntegerPointer) {
+            // Default constant for integer attributes when not provided.
+            setConstantAttribute(gl, index, size, [0, 0, 0, 0], typeInfo);
+        }
         return;
     }
     const { buffer, stride, offset } = bufferAndReadInfo;
@@ -49,16 +64,40 @@ const createBufferAndReadInfo = (buffer, stride = 0, offset = 0) => {
         return null;
     return { buffer, stride, offset };
 };
-const constantFunction = (gl, index, size, escapeValues, typeInfo) => {
-    if (!typeInfo.useIntegerPointer) {
-        const func = `vertexAttrib${size}f`;
+const setConstantAttribute = (gl, index, size, values, typeInfo) => {
+    // Array should already be disabled by caller
+    if (size < 1 || size > 4) {
+        throw new Error(`Attribute size must be between 1 and 4. Got ${size}.`);
+    }
+    if (typeInfo.useIntegerPointer) {
+        gl.vertexAttrib4f(index, 0, 0, 0, 1);
+        // Integer attributes: WebGL2 ONLY supports vertexAttribI4i/I4ui for constants.
+        const intValues = values.map((v) => Math.trunc(v));
+        while (intValues.length < 4)
+            intValues.push(0);
+        const func = typeInfo.isSigned ? "vertexAttribI4i" : "vertexAttribI4ui";
         // @ts-ignore
-        gl[func](index, ...escapeValues);
+        gl[func](index, intValues[0], intValues[1], intValues[2], intValues[3]);
         return;
     }
-    const values = escapeValues.map((v) => Math.trunc(v));
-    const func = typeInfo.isSigned ? `vertexAttribI${size}i` : `vertexAttribI${size}ui`;
-    // @ts-ignore
-    gl[func](index, ...values);
+    // Float attributes: use vertexAttrib{1..4}f.
+    const v = values.slice(0, 4);
+    while (v.length < 4)
+        v.push(size === 4 ? 0 : (v.length === 3 ? 1 : 0));
+    if (size === 1)
+        gl.vertexAttrib1f(index, v[0]);
+    else if (size === 2)
+        gl.vertexAttrib2f(index, v[0], v[1]);
+    else if (size === 3)
+        gl.vertexAttrib3f(index, v[0], v[1], v[2]);
+    else
+        gl.vertexAttrib4f(index, v[0], v[1], v[2], v[3]);
 };
-export { attributeLoader, createBufferAndReadInfo };
+function resetAttributeDefault(gl, index) {
+    gl.vertexAttrib4f(index, 0, 0, 0, 1);
+}
+function setDefaultAttributeValues(gl, index, size, escapeValues, typeInfo) {
+    // gl.disableVertexAttribArray(index);
+    setConstantAttribute(gl, index, size, escapeValues, DATA_TYPE_MAP[typeInfo]);
+}
+export { attributeLoader, createBufferAndReadInfo, resetAttributeDefault, setDefaultAttributeValues };