@pirireis/webglobeplugins 0.8.6 → 0.8.7

package/util/gl-util/uniform-block/types.js

@@ -0,0 +1,7 @@
+/**
+ * @typedef {string} UniformBlockName
+ *
+ * @typedef {string} GLSLType | mat4, mat3, vec4, vec3, vec2, float, int, bool
+ * @typedef {{name: string, type: GLSLType, null|Float32Array: value}} UniformBlockMember
+ * 
+ */

package/util/jshelpers/equality.js

@@ -0,0 +1,17 @@
+function arraysEqual(a, b) {
+    if (a === b) return true;
+    if (a == null || b == null) return false;
+    if (a.length !== b.length) return false;
+
+    // If you don't care about the order of the elements inside
+    // the array, you should sort both arrays here.
+    // Please note that calling sort on an array will modify that array.
+    // you might want to clone your array first.
+
+    for (var i = 0; i < a.length; ++i) {
+        if (a[i] !== b[i]) return false;
+    }
+    return true;
+}
+
+export { arraysEqual };

package/util/picking/picker-displayer.js

@@ -31,7 +31,6 @@ class PickerDisplayer {
             width = this.globe.api_ScrW();
             height = this.globe.api_ScrH();
         }
-        console.log("resize picker displayer", width, height);
         const { gl, colorTexture, indexTexture } = this;
 
         gl.deleteTexture(colorTexture);
@@ -97,6 +96,7 @@ class PickerDisplayer {
     }
 
 
+
     pickBbox(left, top, right, bottom, callback) {
         const size = (right - left) * (bottom - top) * 4;
         this._pick(size, left, top, right - left, bottom - top, callback);

package/util/programs/shapesonglobe.js

@@ -1,4 +1,5 @@
 import { createProgram } from "../webglobjectbuilders";
+import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../../programs/totems/camerauniformblock";
 import { shaderfunctions } from "..";
 /** TODO:
  * 3d icin calistir
@@ -51,19 +52,14 @@ export class ShapesOnGlobeProgram {
     }
 
     _createProgramWrapper() {
-        const gl = this.gl;
+        const { gl, globe } = this;
         const vertexSource = `#version 300 es
             precision highp float;
+            ${CameraUniformBlockString}
 
             in vec2 a_position;
             in vec4 a_color;
 
-            uniform mat4 u_model_view_matrix;
-            uniform mat4 u_proj_matrix;
-            uniform vec3 u_transpos;
-
-            uniform vec2 u_mapWH;
-            uniform vec2 u_scrWH;
 
             uniform bool u_is3D;
             uniform float height; 
@@ -77,14 +73,13 @@ export class ShapesOnGlobeProgram {
 
 
             void main() {
-                // vec3 pos = u_bbox_matrix * vec3(a_position, height);
                 vec3 pos = vec3(a_position, height);
-                if(u_is3D){
+                if(is3D){
                     pos = pixelXYToCartesian3DPoint(pos);
-                    gl_Position = u_proj_matrix * u_model_view_matrix * vec4(pos - u_transpos, 1.0);
+                    gl_Position = projection * view * vec4(pos - translate, 1.0);
                 } else {
-                    vec2 xy = pixelXYToCartesian2DPoint(pos.xy, u_transpos.xy, u_mapWH, u_scrWH);
-                    gl_Position = u_proj_matrix * vec4(xy.x, xy.y, 0.0, 1.0);
+                    vec2 xy = pixelXYToCartesian2DPoint(pos.xy, translate.xy, mapWH, screenWH);
+                    gl_Position = projection * vec4(xy.x, xy.y, 0.0, 1.0);
                 }
                 gl_PointSize = u_point_size;
                 v_color = a_color;
@@ -121,17 +116,18 @@ export class ShapesOnGlobeProgram {
         gl.vertexAttribPointer(a_color, 4, gl.FLOAT, false, 6 * 4, 2 * 4);
         gl.bindVertexArray(null);
 
+        const cm = CameraUniformBlockTotemCache.get(globe);
+        const bindingPoint = 0;
+        const cmIndex = gl.getUniformBlockIndex(program, "CameraUniformBlock");
+        gl.uniformBlockBinding(program, cmIndex, bindingPoint);
+
         return {
             program: program,
             vao: vao,
-            u_model_view_matrix: gl.getUniformLocation(program, 'u_model_view_matrix'),
-            u_proj_matrix: gl.getUniformLocation(program, 'u_proj_matrix'),
-            u_transpos: gl.getUniformLocation(program, 'u_transpos'),
             u_point_size: gl.getUniformLocation(program, 'u_point_size'),
-            u_mapWH: gl.getUniformLocation(program, 'u_mapWH'),
-            u_scrWH: gl.getUniformLocation(program, 'u_scrWH'),
-            u_is3D: gl.getUniformLocation(program, 'u_is3D'),
             u_opacity: gl.getUniformLocation(program, 'u_opacity'),
+            bindCamera: () => cm.bind(bindingPoint),
+            unbindCamera: () => cm.unbind(bindingPoint)
         };
     }
 
@@ -149,6 +145,7 @@ export class ShapesOnGlobeProgram {
         gl.uniformMatrix4fv(_programWrapper.u_proj_matrix, false, uProjectionMatrix);
         gl.uniform3f(_programWrapper.u_transpos, uTranslate.x, uTranslate.y, uTranslate.z);
         gl.bindVertexArray(_programWrapper.vao);
+        _programWrapper.bindCamera();
         if (!_is3D) {
             const mapWH = this.globe.api_GetCurrentWorldWH();
             gl.uniform2f(_programWrapper.u_mapWH, mapWH.width, mapWH.height);
@@ -157,8 +154,9 @@ export class ShapesOnGlobeProgram {
 
         for (const drawRange of drawRanges) {
             gl.drawArrays(this._drawMode, drawRange[0], drawRange[1]);
-            gl.drawArrays(gl.POINTS, drawRange[0], 1);
+            // gl.drawArrays(gl.POINTS, drawRange[0], 1);
         }
+        _programWrapper.unbindCamera();
 
         gl.bindVertexArray(null);
         if (deepTest) {

package/util/shaderfunctions/geometrytransformations.js

@@ -192,26 +192,6 @@ vec2 circleLimpFromLongLatRadCenterMercatorCompass(vec2 center, float radius, fl
 } `;
 
 
-// Function to interpolate between two Cartesian points using spherical interpolation (slerp)
-export const slerp = `
-vec3 slerp(vec3 A, vec3 B, float t) {
-    float cosTheta = dot(A, B);
-    float theta = acos(clamp(cosTheta, -1.0, 1.0)); // Angle between the points
-
-    float sinTheta = sin(theta);
-
-    // Avoid division by zero // many points falls in to this category
-    if (sinTheta < 0.00001) {
-        return mix(A, B, t); // Linear interpolation as fallback
-    }
-
-    float factorA = sin((1.0 - t) * theta) / sinTheta;
-    float factorB = sin(t * theta) / sinTheta;
-
-    return factorA * A + factorB * B;
-}
-`;
-
 // Function to convert Cartesian coordinates back to spherical (latitude, longitude)
 export const cartesianToSpherical = `
 vec2 cartesianToSpherical(vec3 point) {
@@ -223,16 +203,6 @@ vec2 cartesianToSpherical(vec3 point) {
 
 // Main function to calculate an intermediate point
 
-export const interpolateGeographicPoint = slerp + cartesianToSpherical + longLatRadToCartesian3D + `
-vec3 interpolateGeographicPoint(vec2 start, vec2 end, float t) {
-    vec3 pointA = longLatRadToCartesian3D(start);
-    vec3 pointB = longLatRadToCartesian3D(end);
-    vec3 interpolatedPoint = slerp(pointA, pointB, t);
-    return interpolatedPoint;
-    // return cartesianToSpherical(interpolatedPoint);
-}
-`;
-
 
 
 export const angleBetweenTwoPointsRadian = `
@@ -253,35 +223,7 @@ float circleCircumferenceInterPolationOf2PointsRadian(vec2 center, vec2 target,
 }
 `
 
-const circumferencePoints = `
-vec2 circumferencePoints(vec2 center, vec2 target, vec2 target2, float phase) {
-    // Calculate vectors from center to target and target2
-    vec2 v1 = target - center;
-    vec2 v2 = target2 - center;
-
-    // Normalize the vectors to ensure they are on the unit circle
-    v1 = normalize(v1);
-    v2 = normalize(v2);
-
-    // Calculate the angle between the vectors
-    float angle1 = atan(v1.y, v1.x);
-    float angle2 = atan(v2.y, v2.x);
-
-    // Ensure the angles are continuous (handle wrap-around at 2π)
-    if (angle2 < angle1) {
-        angle2 += 2.0 * 3.14159265359; // Add 2π to angle2 if it is smaller
-    }
 
-    // Interpolate the angle based on the phase
-    float interpolatedAngle = mix(angle1, angle2, phase);
-
-    // Calculate the new point on the circle
-    vec2 result = vec2(cos(interpolatedAngle), sin(interpolatedAngle));
-
-    // Scale back to the original circle radius and shift to center
-    return center + length(target - center) * result;
-}
-`
 
 
 export const realDistanceOnSphereR1 = `
@@ -294,22 +236,44 @@ float realDistanceOnSphereR1(vec2 longLat1, vec2 longLat2) {
 }
 `;
 
-const pointsOnSphereBetween = `vec3 pointsOnSphereBetween(vec3 a, vec3 b, float ratio) {
+
+
+const pointsOnSphereBetween = `
+vec3 pointsOnSphereBetween(vec3 a, vec3 b, float ratio) {
     // Normalize the input points to ensure they are on the unit sphere
     a = normalize(a);
     b = normalize(b);
 
+    // Compute the dot product and clamp it to avoid numerical issues
+    float dotProduct = clamp(dot(a, b), -1.0, 1.0);
+
     // Compute the angle between the points
-    float theta = acos(dot(a, b));
+    float theta = acos(dotProduct);
+
+    // Handle the edge case where the points are nearly identical
+    if (theta < 0.0001) {
+        return normalize(mix(a, b, ratio)); // Linear interpolation as fallback
+    }
 
     // Compute the interpolated point using spherical linear interpolation (slerp)
-    vec3 result = (sin((1.0 - ratio) * theta) * a + sin(ratio * theta) * b) / sin(theta);
+    float sinTheta = sin(theta);
+    float factorA = sin((1.0 - ratio) * theta) / sinTheta;
+    float factorB = sin(ratio * theta) / sinTheta;
+
+    vec3 result = factorA * a + factorB * b;
 
     // Return the normalized result to ensure it lies on the sphere
     return normalize(result);
-}`
+}`;
 
 
+const slerp = `
+${pointsOnSphereBetween}
+vec3 slerp(vec3 A, vec3 B, float t) {
+    return pointsOnSphereBetween(A, B, t) * mix(length(A), length(B), t);
+}
+`
+
 const circleLimpFromLongLatRadCenterCartesian3D_accurate = R + `
 vec3 circleLimpFromLongLatRadCenterCartesian3D_accurate( vec3 geoW, float radius, float angle) {
     vec3 normal = normalize(geoW);
@@ -357,7 +321,7 @@ vec2 circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate(vec2 mercato
 }`;
 
 export {
-    pointsOnSphereBetween,
+    slerp,
     circleLimpFromLongLatRadCenterCartesian3D_accurate,
     circleLimpFromLongLatRadCenterMercatorCompass_accurate,
     circleLimpFromLongLatRadCenterMercatorRealDistanceNew_accurate

package/bearing-line/roadmap.md

@@ -1,15 +0,0 @@
-# Two problems:
-lines are curved to to arrive perpendicular to the longitude lines
-patrial rings are not fit to the lines nor the bearing angle
-
-
-
-# AngledLine 
-
-Does not render
-Check:
-[-] VAO
-[-] Attributes are loaded with data  
-    Assign constants to attributes. 
-[x] Uniforms are loaded // program was not used before setting opacity
-[x] Check geometry // Assigning a constant to the geometry made all edges of the line overlap and the line was not visible

package/point-heat-map/plugin.js

@@ -1,132 +0,0 @@
-import { PointHeatmapFlow } from "./point-to-heat-map-flow";
-import { TimeTrackInterpolator } from "../util/interpolation/timetrack/timetrack-interpolator";
-import { createTexture, getColorRampModed } from "../util";
-// TODO: DEPRECATED
-class PointHeatmapPlugin {
-
-    constructor(id, { opacity = 1.0, pointSize = 5.0 } = {}) {
-        this.id = id;
-        this.globe = null;
-        this.gl = null;
-        this.densityToLegendProgram = null;
-        this._time = null;
-
-
-        this._opacity = opacity;
-        this._pointSize = pointSize;
-        this._legendTexture = null;
-        this.timeTrackInterpolator = new TimeTrackInterpolator();
-    }
-
-    // globe interaction
-
-    init(globe, gl) {
-        this.globe = globe;
-        this.gl = gl;
-        this.flow = new PointHeatmapFlow(globe);
-        this.setGeometry();
-        this.resize();
-    }
-
-
-    setPointSize(pointSize) {
-        if (typeof pointSize !== 'number' || pointSize <= 0) {
-            throw new Error('Invalid pointSize');
-        }
-        this._pointSize = pointSize;
-        this.globe.DrawRender();
-    }
-
-
-    /**
-     * @param {Array<string>} 
-     * @param {string} mode "interpolated" | "discrete"
-     */
-
-    setColorRamp(values, thresholds, mode = "interpolated") {
-        const gl = this.gl
-        if (this.gl === null) {
-            throw new Error('Plugin not initialized');
-        };
-        const rampData = getColorRampModed(values, thresholds, mode);
-        const texture = createTexture(gl, gl.LINEAR, rampData, 256, 1);
-        if (this._legendTexture) {
-            this.gl.deleteTexture(this._legendTexture);
-        }
-        this._legendTexture = texture;
-        this.globe.DrawRender();
-    }
-
-
-    setTime(time) {
-        this._time = time;
-        const data = this.timeTrackInterpolator.interpolate(time);
-        if (data === null) {
-            return;
-        }
-        this.flow.setData(data);
-    }
-
-
-    setTimetracks(timeTracks) {
-        this.timeTrackInterpolator.setTimetracks(timeTracks);
-        if (this._time !== null) {
-            this.setTime(this._time);
-        }
-        this.globe.DrawRender();
-    }
-
-
-    setOpacity(opacity) {
-        if (typeof opacity !== 'number' || opacity < 0 || opacity > 1) {
-            throw new Error('Invalid opacity');
-        }
-        this._opacity = opacity;
-        this.globe.DrawRender();
-    }
-
-
-
-    setGeometry() {
-        const geometry = this.globe.api_GetCurrentGeometry();
-        this.timeTrackInterpolator.setGeometry(geometry);
-        if (this._time !== null) {
-            this.setTime(this._time);
-        }
-    }
-
-
-    draw3D() {
-        if (this.isReady()) {
-            this.flow.draw(this._legendTexture, this._pointSize, this._opacity);
-        }
-    }
-
-
-    resize() {
-        this.timeTrackInterpolator.setGeometry(this.globe.api_GetCurrentGeometry());
-        this.flow.resize();
-        if (this._time !== null) {
-            this.setTime(this._time);
-        }
-    }
-
-
-    isReady() {
-        return (this.gl !== null && this._legendTexture !== null);
-    }
-
-    free() {
-        if (this._isFreed) return;
-        this.gl.deleteTexture(this._legendTexture);
-        this.flow.free();
-        this.flow = null;
-        this.gl = null;
-        this._isFreed = true;
-        this.timeTrackInterpolator = null;
-        this._legendTexture = null;
-    }
-}
-
-
-export { PointHeatmapPlugin };

package/programs/line-on-globe/naive-accurate.js

@@ -1,221 +0,0 @@
-import { CameraUniformBlockString, CameraUniformBlockTotem } from "../totems";
-import { pointsOnSphereBetween, POLE, R_3D, mercatorXYToGLPosition, cartesian3DToGLPosition } from "../../util/shaderfunctions/geometrytransformations";
-import { createProgram } from "../../util";
-import { noRegisterGlobeProgramCache, globeProgramCache } from "../programcache";
-import { programCache } from "../rings/distancering/circleflatprogram";
-
-const GLOBE_MIDPOINT_COUNT = 30;
-
-const vertexShader = `#version 300 es
-precision highp float;
-${R_3D}
-${CameraUniformBlockString}
-${pointsOnSphereBetween}
-${mercatorXYToGLPosition}
-${cartesian3DToGLPosition}
-
-in vec2 start_position;
-in vec3 start_position3d;
-in vec2 end_position;
-in vec3 end_position3d;
-in float dash_ratio;
-in vec4 color;
-in float dash_opacity;
-out vec4 v_color;
-out vec2 v_limp;
-out float interpolation;
-out float v_dash_ratio;
-out float v_dash_opacity;
-
-
-void main() {
-    vec2 longLat;
-    if (is3D) {
-        interpolation = float(gl_VertexID) / ${GLOBE_MIDPOINT_COUNT - 1}.0;
-        vec3 cartesian;
-        if ( length( start_position3d - end_position3d) < 4.4){
-            cartesian = mix( start_position3d, end_position3d, interpolation);
-        } else {
-            cartesian = pointsOnSphereBetween(start_position3d, end_position3d, interpolation) * length(end_position3d);
-        }
-        gl_Position = cartesian3DToGLPosition(cartesian);
-        v_limp = vec2(0.0, 0.0);
-    } else {
-        if ( distance( start_position, end_position) > 30000000.0) { return; }
-        interpolation = float(gl_VertexID);
-        if (gl_VertexID % 2 == 0) {
-            longLat = start_position;
-        } else {
-            longLat = end_position;
-        }
-        v_limp = longLat;
-        gl_Position = mercatorXYToGLPosition(longLat);
-    }
-    // if ( gl_VertexID % 2 == 0) {v_color = color;}
-    // else {v_color = vec4(0.0, 0.0, 0.0, 0.0);}
-    v_color = color;
-    v_dash_ratio = dash_ratio;
-    v_dash_opacity = dash_opacity;
-}
-`;
-
-const fragmentShader = `#version 300 es
-${POLE}
-precision highp float;
-uniform float opacity;
-in vec4 v_color;
-out vec4 color;
-in float interpolation;
-in float v_dash_ratio;
-in vec2 v_limp;
-in float v_dash_opacity;
-void main() {
-    if (v_limp.x < -POLE || v_limp.x > POLE || v_limp.y < -POLE || v_limp.y > POLE) { discard; }
-    color = v_color;
-    color.a *= opacity;
-    if ( v_dash_ratio >= 1.0 ) { return; }
-    if (interpolation > 0.95) { return; }
-    if (fract(interpolation / (2.0 * v_dash_ratio)) < 0.5) { color.a *= v_dash_opacity; }
-
-}
-`;
-
-
-class Logic {
-
-    constructor(globe) {
-        this.globe = globe;
-        this.gl = globe.gl;
-        this.program = createProgram(this.gl, vertexShader, fragmentShader);
-        this._lastOpacity = 1.0;
-        const { gl, program } = this;
-        {
-            // assign attribute locations
-            gl.bindAttribLocation(program, 0, "start_position");
-            gl.bindAttribLocation(program, 1, "start_position3d");
-            gl.bindAttribLocation(program, 2, "end_position");
-            gl.bindAttribLocation(program, 3, "end_position3d");
-            gl.bindAttribLocation(program, 4, "dash_ratio");
-            gl.bindAttribLocation(program, 5, "color");
-            gl.bindAttribLocation(program, 6, "dash_opacity");
-        }
-
-        {
-            this._opacityLocation = gl.getUniformLocation(program, "opacity");
-            const currentProgram = gl.getParameter(gl.CURRENT_PROGRAM);
-            gl.useProgram(program);
-            gl.uniform1f(this._opacityLocation, this._lastOpacity);
-            gl.useProgram(currentProgram);
-
-        }
-
-        this.cameraBlockBindingPoint = 0;
-        const cameraBlockIndex = this.gl.getUniformBlockIndex(this.program, "CameraUniformBlock");
-        this.cameraBlockTotem = globeProgramCache.getProgram(globe, CameraUniformBlockTotem);
-        gl.uniformBlockBinding(this.program, cameraBlockIndex, this.cameraBlockBindingPoint);
-
-
-    }
-
-
-    draw(vao, length, opacity) {
-        const { gl, program, globe, cameraBlockTotem, cameraBlockBindingPoint } = this;
-        gl.useProgram(program);
-        cameraBlockTotem.bind(cameraBlockBindingPoint);
-        gl.bindVertexArray(vao);
-        if (opacity !== this._lastOpacity) {
-            gl.uniform1f(this._opacityLocation, opacity);
-            this._lastOpacity = opacity;
-        }
-        const drawCount = globe.api_GetCurrentGeometry() === 0 ? GLOBE_MIDPOINT_COUNT : 2;
-        gl.drawArraysInstanced(gl.LINE_STRIP, 0, drawCount, length);
-        gl.bindVertexArray(null);
-        cameraBlockTotem.unbind(cameraBlockBindingPoint);
-    }
-
-    //
-    createVAO(
-        startPotisionBufferObj, startPotision3DBufferObj,
-        endPositionBufferObj, endPosition3DBufferObj,
-        dashRatioBufferObj,
-        dashOpacityBufferObj,
-        colorBufferObj) {
-        const { gl } = this;
-        const vao = gl.createVertexArray();
-        gl.bindVertexArray(vao);
-        {
-            const { buffer, stride = 0, offset = 0 } = startPotisionBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(0);
-            gl.vertexAttribPointer(0, 2, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(0, 1);
-        }
-        {
-            const { buffer, stride = 0, offset = 0 } = startPotision3DBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(1);
-            gl.vertexAttribPointer(1, 3, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(1, 1);
-        }
-        {
-
-            const { buffer, stride = 0, offset = 0 } = endPositionBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(2);
-            gl.vertexAttribPointer(2, 2, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(2, 1);
-        }
-        {
-
-            const { buffer, stride = 0, offset = 0 } = endPosition3DBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(3);
-            gl.vertexAttribPointer(3, 3, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(3, 1);
-        }
-        {
-            const { buffer, stride = 0, offset = 0 } = dashRatioBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(4);
-            gl.vertexAttribPointer(4, 1, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(4, 1);
-        }
-
-        {
-            const { buffer, stride = 0, offset = 0 } = colorBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(5);
-            gl.vertexAttribPointer(5, 4, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(5, 1);
-        }
-
-        {
-            const { buffer, stride = 0, offset = 0 } = dashOpacityBufferObj;
-            gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
-            gl.enableVertexAttribArray(6);
-            gl.vertexAttribPointer(6, 1, gl.FLOAT, false, stride, offset);
-            gl.vertexAttribDivisor(6, 1);
-        }
-
-        gl.bindVertexArray(null);
-        gl.bindBuffer(gl.ARRAY_BUFFER, null);
-        return vao;
-
-    }
-
-
-    free() {
-        if (this.isFreed) return;
-        programCache.releaseProgram(this.globe, CameraUniformBlockTotem);
-        this.gl.deleteProgram(this.program);
-        this.isFreed = true;
-    }
-}
-
-
-
-export const LineOnGlobeCache = Object.freeze({
-    get: (globe) => { return noRegisterGlobeProgramCache.getProgram(globe, Logic) },
-    release: (globe) => { return noRegisterGlobeProgramCache.releaseProgram(globe, Logic) }
-});
-