@pirireis/webglobeplugins 0.12.0-alpha → 0.14.0-alpha

package/Math/arc-cdf-points.js

@@ -1,3 +1,5 @@
+import { fromAxisAngle } from './quaternion';
+import { applyQuaternion, clone } from './vec3';
 // --- Utility Functions for 3D Vector Operations --- (Assumed to be the same as provided)
 /**
  * Normalizes a 3D vector to unit length.
@@ -204,6 +206,24 @@ export function generateArcPoints(p0, p1, axisA, attractionPoint, pointCount, at
     }
     return sampledPoints;
 }
+const _rotationQuaternion = /*@__PURE__*/ [0, 0, 0, 1];
+export function evenlySpacedArcPoints(p0, axisA, coverAngle, pointCount) {
+    if (pointCount < 1)
+        return [];
+    if (pointCount === 1)
+        return [vec3Normalize(p0)];
+    const point = vec3Normalize(p0);
+    const stepAngle = coverAngle / (pointCount - 1);
+    fromAxisAngle(_rotationQuaternion, axisA, stepAngle);
+    const sampledPoints = new Array(pointCount);
+    sampledPoints[0] = clone(point);
+    // Start from index 1 since we already have the first point
+    for (let i = 1; i < pointCount; i++) {
+        applyQuaternion(point, point, _rotationQuaternion);
+        sampledPoints[i] = clone(point);
+    }
+    return sampledPoints;
+}
 // // --- Example Usage (for demonstration and testing) ---
 // // Example 1: Basic arc, very strong attraction point in the middle
 // const p0_ex1: Vec3 = [1, 0, 0];

package/Math/arc-generate-points copy.js

@@ -1,3 +1,4 @@
+// TODO: Delete this file if it is not needed anymore.
 // import { normilze as vec3Normalize, dot as vec3Dot, cross as vec3Cross, scale as vec3Scale, add as vec3Add, sub as vec3Sub } from './vec3';
 // --- Utility Functions for 3D Vector Operations ---
 /**

package/Math/arc.js

@@ -13,17 +13,30 @@ const _longLat = /*@__PURE__*/ [0, 0];
 function create(p0, p1) {
     const normal = vec3create(0, 0, 0);
     cross(normal, p0, p1);
-    const coverPlaneNormal = [p0[0] + p1[0], p0[1] + p1[1], p0[2] + p1[2]];
-    normalize(coverPlaneNormal, coverPlaneNormal);
-    const dot_ = dot(coverPlaneNormal, p0);
+    normalize(normal, normal);
+    const coverPlaneNormal = vec3create(p0[0] + p1[0], p0[1] + p1[1], p0[2] + p1[2]);
+    let distance;
+    const ls = lengthSquared(coverPlaneNormal);
+    if (ls > EPSILON) {
+        normalize(coverPlaneNormal, coverPlaneNormal);
+        distance = dot(coverPlaneNormal, p0);
+    }
+    else {
+        // Handle opposite points case
+        const tempPlane = planeCreate(vec3create(), 0);
+        _oppositePointsHandle(p0, p1, normal, tempPlane);
+        vec3copy(coverPlaneNormal, tempPlane.normal);
+        distance = tempPlane.distance;
+    }
     return {
         p0: vec3clone(p0),
         p1: vec3clone(p1),
         normal: vec3clone(normal),
         coverPlane: {
             normal: coverPlaneNormal,
-            distance: dot_
-        }
+            distance: distance
+        },
+        coverAngle: Math.acos(dot(p0, p1))
     };
 }
 function set(out, p0, p1) {
@@ -46,6 +59,7 @@ function copy(out, a) {
     vec3copy(out.normal, a.normal);
     out.coverPlane.normal = vec3clone(a.coverPlane.normal);
     out.coverPlane.distance = a.coverPlane.distance;
+    out.coverAngle = a.coverAngle; // Copy coverAngle if it exists
 }
 function clone(a) {
     return {
@@ -55,7 +69,8 @@ function clone(a) {
         coverPlane: {
             normal: vec3clone(a.coverPlane.normal),
             distance: a.coverPlane.distance
-        }
+        },
+        coverAngle: a.coverAngle // Clone coverAngle if it exists
     };
 }
 function isPointOn(arc, point) {
@@ -118,8 +133,6 @@ function _populatePointsWithClosestPointInsideArc(out, arc, count, closestPoint)
     const angleStep2 = angleP1 / pop2;
     fromAxisAngle(_rotationQuaternion, arc.normal, angleStep1);
 }
-function _populatePointsWithoutClosestPoint(out, arc, count) {
-}
 /**
  * Samples points along an arc with density biased by the camera's distance,
  * reusing the rotation quaternion to improve performance.

package/Math/circle-cdf-points.js

@@ -206,7 +206,6 @@ function createCummulativeTemplate(numberOfPoints, strength, denseRatio = 0.5 //
         // Normalize the values to ensure they sum up to 1.
         distribution[i] = distribution[i] / totalWeight;
     }
-    console.log("distribution", distribution, "strength", strength, "numberOfPoints", numberOfPoints);
     return distribution;
 }
 function createCummulativeTemplateStash(levels, numberOfPoints, denseRatio = 0.5, strengthMultiplier = 2.4) {
@@ -239,7 +238,6 @@ function globeFindPointByPolarHalfCircle(out, globe, centerLong, centerLat, radi
         out[offset - 1] = point.lat;
         offset -= 2;
     }
-    console.log("1");
 }
 export { 
 // createTemplate,

package/Math/circle.js

@@ -1,5 +1,5 @@
 import { RADIANS } from './methods';
-import { subtract, normalize, dot, fromLongLatToUnitVector, copy, multiplyScalar } from './vec3';
+import { subtract, normalize, dot, fromLongLatToUnitVector, copy, multiplyScalar, clone } from './vec3';
 const _0vec3 = [0, 0, 0];
 function closestAzimuthAngle(circleProperties, point) {
     const distance = dot(circleProperties.normal, point);
@@ -10,30 +10,49 @@ function closestAzimuthAngle(circleProperties, point) {
     const N = circleProperties.northPointProjectedToOriginPlaneNormalized;
     const _dot = dot(_0vec3, N);
     let angle = Math.acos(_dot);
-    const z = _0vec3[0] * N[1] - _0vec3[1] * N[0];
+    const z = (_0vec3[0] * N[1] - _0vec3[1] * N[0]) * circleProperties.normal[2];
     return z < 0 ? -angle : angle;
 }
 function createCircleClosestAzimuthAngleProperties(circle) {
     const normal = Array(3);
     fromLongLatToUnitVector(normal, [circle.center[0] * RADIANS, circle.center[1] * RADIANS]);
-    const distance = normal[2]; //dot(normal, [0, 0, 1] as Vec3)
-    const N = [0, 0, 0];
-    if (Math.abs(distance) < 1e-6) {
-        N[0] = -1;
-        N[1] = 0;
-        N[2] = 0;
-    }
-    else {
-        copy(N, normal);
-        multiplyScalar(N, N, distance);
-        N[0] = -N[0];
-        N[1] = -N[1];
-        N[2] = 1 - N[2];
-    }
+    const N = clone(normal);
+    const distance = dot([0, 0, 1], normal);
+    multiplyScalar(N, N, distance);
+    // if (N[2] >= 0) {
+    subtract(N, [0, 0, 1], N);
+    // } else {
+    //     subtract(N, [0, 0, -1], N);
+    // }
     normalize(N, N);
     return {
         normal: normal,
         northPointProjectedToOriginPlaneNormalized: N,
     };
+    // const distance = normal[2]; //dot(normal, [0, 0, 1] as Vec3)
+    // const N: Vec3 = [0, 0, 0];
+    // if (Math.abs(distance) < 1e-6) {
+    //     N[0] = -1;
+    //     N[1] = 0;
+    //     N[2] = 0;
+    // } else {
+    //     // TODO: add cases for 8 parts of the sphere
+    //     copy(N, normal);
+    //     multiplyScalar(N, N, distance);
+    //     if (N[2] >= 0) {
+    //         N[0] = -N[0];
+    //         N[1] = -N[1];
+    //         N[2] = 1 - N[2];
+    //     } else {
+    //         N[2] = -N[2];
+    //         N[0] = -N[0];
+    //         N[1] = -N[1];
+    //     }
+    // }
+    // normalize(N, N);
+    // return {
+    //     normal: normal,
+    //     northPointProjectedToOriginPlaneNormalized: N,
+    // }
 }
 export { closestAzimuthAngle, createCircleClosestAzimuthAngleProperties };

package/Math/templete-shapes/grid-visually-equal.js

@@ -0,0 +1,66 @@
+/**
+ * Createa a grıd of longitude/latitude points visually equal on the mercator projectıon.
+ */
+function mercatorMeterToLongLat(mercatorX, mercatorY) {
+    const R = 6378137; // Earth radius in meters
+    const lng = (mercatorX / R) * (180 / Math.PI);
+    const lat = (2 * Math.atan(Math.exp(mercatorY / R)) - Math.PI / 2) * (180 / Math.PI);
+    return [lng, lat];
+}
+function createGrid(sizeX, sizeY) {
+    const grid = [];
+    for (let y = 0; y < sizeY; y++) {
+        const row = new Array(sizeX);
+        grid.push(row);
+    }
+    return grid;
+}
+function moveByAngle(origin, angle, distance) {
+    const long = origin[0] + distance * Math.cos(angle);
+    const lat = origin[1] + distance * Math.sin(angle);
+    return [long, lat];
+}
+export function createfillGrid(globe, origin, startX, startY, rowSize, columnSize, cellSizeX, cellSizeY, rotaionAngle = 0) {
+    const originMercator = globe.api_GetMercator2DPoint(origin[0], origin[1]);
+    const angleRadians = rotaionAngle * (Math.PI / 180);
+    const grid = createGrid(rowSize, columnSize);
+    // Set the origin point first
+    grid[startY][startX] = originMercator;
+    // fill single vertical row from origin - to the right
+    let lastPoint = originMercator;
+    for (let i = startX + 1; i < rowSize; i++) {
+        const [long, lat] = moveByAngle(lastPoint, angleRadians, cellSizeX);
+        lastPoint = [long, lat];
+        grid[startY][i] = [long, lat];
+    }
+    // fill single vertical row from origin - to the left
+    lastPoint = originMercator;
+    for (let i = startX - 1; i >= 0; i--) {
+        const [long, lat] = moveByAngle(lastPoint, Math.PI + angleRadians, cellSizeX);
+        lastPoint = [long, lat];
+        grid[startY][i] = [long, lat];
+    }
+    // fill single horizontal from origin from startY to 0
+    console.log("grid", grid);
+    for (let i = startY - 1; i >= 0; i--) {
+        for (let j = 0; j < rowSize; j++) {
+            const [long, lat] = moveByAngle(grid[i + 1][j], angleRadians - Math.PI / 2, cellSizeY);
+            grid[i][j] = [long, lat];
+        }
+    }
+    // fill single horizontal from origin from startY to last row
+    for (let i = startY + 1; i < columnSize; i++) {
+        for (let j = 0; j < rowSize; j++) {
+            const [long, lat] = moveByAngle(grid[i - 1][j], angleRadians + Math.PI / 2, cellSizeY);
+            grid[i][j] = [long, lat];
+        }
+    }
+    // Convert from mercator meters to longitude/latitude
+    for (let i = 0; i < columnSize; i++) {
+        for (let j = 0; j < rowSize; j++) {
+            const [long, lat] = mercatorMeterToLongLat(grid[i][j][0], grid[i][j][1]);
+            grid[i][j] = [long, lat];
+        }
+    }
+    return grid;
+}

package/altitude-locator/plugin.js

@@ -2,11 +2,12 @@ import './types.js';
 import { PickableRendererProgramCache } from '../programs/picking/pickable-renderer.js';
 import { ElementPointGlowProgramCache } from '../programs/point-on-globe/element-point-glow.js';
 import { ElementGlobeSufaceGlowCache } from '../programs/point-on-globe/element-globe-surface-glow.js';
-import { LineOnGlobeCache } from '../programs/line-on-globe/naive-accurate-flexible.js';
+import { LineOnGlobeCache } from '../programs/line-on-globe/naive-accurate-flexible';
 import { BufferOrchestrator, BufferManager } from "../util/account";
+// @ts-ignore
 import { PickerDisplayer } from '../util/picking/picker-displayer.js';
 import { wgs84ToCartesian3d, wgs84ToMercator } from '../Math/methods';
-import { constraintFloat, opacityCheck } from '../util/check/typecheck.js';
+import { constraintFloat, opacityCheck } from '../util/check/typecheck';
 import { createBufferAndReadInfo } from '../util/gl-util/buffer/attribute-loader';
 import { CameraUniformBlockTotemCache } from '../programs/totems/camerauniformblock';
 /**

package/bearing-line/plugin.js

@@ -3,10 +3,9 @@ import { LineOnGlobeCache } from '../programs/line-on-globe/naive-accurate-flexi
 import { CircleCache as Circle3DCache } from '../programs/line-on-globe/circle-accurate-3d';
 import { CircleCache, EDGE_COUNT as flatCircleEdgeCount, centerCoords2dflatDataCreator } from '../programs/line-on-globe/circle-accurate-flat';
 import { BufferOrchestrator, BufferManager } from '../util/account';
-import { mapGetOrThrow } from "../util/check/get";
 import { populateFloat32Array } from "../util/jshelpers/data-filler";
 import { ContextTextWriter3 } from '../write-text/context-text3';
-import { constraintFloat, isBoolean } from '../util/check/typecheck';
+import { constraintFloat, isBoolean, mapGetOrThrow } from '../util/check/typecheck';
 import { sphereCoord } from '../util/geometry';
 import { createBufferAndReadInfo } from '../util/gl-util/buffer/attribute-loader';
 export const RINGPARTIAL_DRAW_MODE = Object.freeze({

package/circle-line-chain/plugin.js

@@ -2,12 +2,11 @@ import { LineOnGlobeCache } from '../programs/line-on-globe/naive-accurate-flexi
 import { CircleCache, EDGE_COUNT as flatCircleEdgeCount, centerCoords2dflatDataCreator } from '../programs/line-on-globe/circle-accurate-flat';
 import { CircleCache as Circle3DCache } from '../programs/line-on-globe/circle-accurate-3d';
 import { BufferOrchestrator, BufferManager } from "../util/account";
-import { ChainListMap } from "./chain-list-map";
-import { mapGetOrThrow } from "../util/check/get";
+import { ChainListMap } from "../range-tools-on-terrain/circle-line-chain/chain-list-map";
 import { keyMethod } from "./util";
 import { populateFloat32Array } from "../util/jshelpers/data-filler";
 import { ContextTextWriter3 } from '../write-text/context-text3';
-import { isBoolean, constraintFloat, opacityCheck } from '../util/check/typecheck';
+import { opacityCheck, mapGetOrThrow } from '../util/check/typecheck';
 import { createBufferAndReadInfo } from '../util/gl-util/buffer/attribute-loader';
 import { sphereCoord } from '../util/geometry/index';
 /**
@@ -57,7 +56,7 @@ export class CircleLineChainPlugin {
     /**
      *
      * @param {*} id
-     * @param {Map<[key, ContextTextWriter3]} textWritersMap //import { ContextTextWriter3 } from "@pirireis/webglobeplugins/write-text/context-text3";
+     * @param {Map<key, ContextTextWriter3>} textWritersMap //import { ContextTextWriter3 } from "@pirireis/webglobeplugins/write-text/context-text3";
      */
     constructor(id, { drawCircleOn = true, textWritersMap = new Map(), textDataPreAdaptor = null, circleFlatEdgeCount = flatCircleEdgeCount - 2 } = {}) {
         this.id = id;
@@ -131,8 +130,6 @@ export class CircleLineChainPlugin {
     }
     /**
      *
-
-    /**
      * @param {Array<string>} textWriterIDs | textWritersMap keys to be used for writing text.
      * @param {Array<string>} chainKeys | if empty, all texts will be updated
      */
@@ -181,7 +178,7 @@ export class CircleLineChainPlugin {
         this.globe.DrawRender();
     }
     getChain(chainKey) {
-        this._chainListMap.getChain(chainKey);
+        this._chainListMap.getNodes(chainKey);
     }
     /**
      *

package/compass-rose/compass-rose-padding-flat.js

@@ -32,6 +32,7 @@ export class PixelPaddingCompassPlugin {
         this._font_hold = { font, northFont };
         this.compassMap = new CompassMap(this);
         this._opacity = opacity;
+        this.isFreed = false;
     }
     init(globe, gl) {
         this.globe = globe;
@@ -135,6 +136,11 @@ export class PixelPaddingCompassPlugin {
     }
     // Globe API interface methods
     draw2D() {
+        if (this.isFreed) {
+            console.warn("PixelPaddingCompassPlugin is freed, cannot draw.");
+            return;
+        }
+        ;
         const { gl, globe, paddingProgram, paddingVao, bufferOrchestrator, bufferManagersCompMap } = this;
         const is3D = globe.api_GetCurrentGeometry() === 0;
         if (is3D)
@@ -153,6 +159,12 @@ export class PixelPaddingCompassPlugin {
         this.writer?.draw();
     }
     free() {
+        if (this.isFreed) {
+            console.warn("PixelPaddingCompassPlugin is already freed.");
+            return;
+        }
+        ;
+        this.isFreed = true;
         this.compassMap.free();
         const { globe, gl, paddingVao } = this;
         gl.deleteVertexArray(paddingVao);

package/package.json

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

package/programs/line-on-globe/degree-padding-around-circle-3d.js

@@ -1,4 +1,4 @@
-import { createProgram } from "../../util/webglobjectbuilders";
+import { createProgram } from "../../util/index";
 import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/camerauniformblock";
 import { noRegisterGlobeProgramCache } from "../programcache";
 // import { vaoAttributeLoader } from "../../util/account/util";

package/programs/line-on-globe/linestrip/data.js

@@ -0,0 +1,4 @@
+export function createLineStripData(program, globe, gl, DrawStyleOptions) {
+    // @ts-ignore
+    return;
+}

package/programs/line-on-globe/{linestrip.js → linestrip/linestrip.js}

@@ -1,23 +1,21 @@
-import { createProgram } from "../../util/webglobjectbuilders";
-import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/index";
-import { cartesian3DToGLPosition, mercatorXYToGLPosition, } from "../../util/shaderfunctions/geometrytransformations";
-import { noRegisterGlobeProgramCache } from "../programcache";
-import { attributeLoader } from "../../util/gl-util/buffer/attribute-loader";
-import "../../util/gl-util/buffer/attribute-loader";
-import { UniformBlockManager } from "../../util/gl-util/uniform-block/manager";
-import "../../util/gl-util/uniform-block/types";
-import { drawArrays } from "../../util/gl-util/draw-options/methods";
-import "../../util/gl-util/draw-options/types";
+import { createProgram } from "../../../util/webglobjectbuilders";
+import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../../totems/index";
+import { cartesian3DToGLPosition, mercatorXYToGLPosition, } from "../../../util/shaderfunctions/geometrytransformations";
+import { noRegisterGlobeProgramCache } from "../../programcache";
+import { attributeLoader } from "../../../util/gl-util/buffer/attribute-loader";
+import "../../../util/gl-util/buffer/attribute-loader";
+import { UniformBlockManager } from "../../../util/gl-util/uniform-block/manager";
+import { drawArrays } from "../../../util/gl-util/draw-options/methods";
 const ESCAPE_VALUE = -1;
 const uniformBindingPoints = {
     camera: 0,
     flexible: 1,
 };
-const one = new Float32Array([1]);
+// const one = new Float32Array([1]);
 const flexibleBlockManager = new UniformBlockManager('FlexibleAttributes', [
     { name: "u_color", type: "vec4", value: new Float32Array([0.12, 1, 0.1, 1]) },
-    { name: "u_dash_opacity", type: "float", value: one },
-    { name: "u_dash_length", type: "float", value: one },
+    // { name: "u_dash_opacity", type: "float", value: one },
+    // { name: "u_dash_length", type: "float", value: one },
 ], uniformBindingPoints.flexible);
 const vertexShaderSource = `#version 300 es
 precision highp float;
@@ -28,14 +26,16 @@ ${mercatorXYToGLPosition}
 
 ${flexibleBlockManager.glslCode()}
 
+uniform float u_opacity;
+
 in vec3 position3d;
 in vec2 position2d;
 in vec4 color; 
-in float dash_length;
-in float dash_opacity;
+// in float dash_length;
+// in float dash_opacity;
 
-out float v_dash_length;
-out float v_dash_opacity;
+// out float v_dash_length;
+// out float v_dash_opacity;
 out vec4 v_color;
 
 flat out vec3 v_flat_position;
@@ -44,8 +44,10 @@ out vec3 v_position;
 void main() {
 
     v_color = ( color.r == -1.0 ) ? u_color : color;
-    v_dash_length = ( dash_length == -1.0 ) ? u_dash_length : dash_length;
-    v_dash_opacity = ( dash_opacity == -1.0 ) ? u_dash_opacity : dash_opacity;
+    v_color.a *= u_opacity;
+
+    // v_dash_length = ( dash_length == -1.0 ) ? u_dash_length : dash_length;
+    // v_dash_opacity = ( dash_opacity == -1.0 ) ? u_dash_opacity : dash_opacity;
 
     if ( is3D ) {
         gl_Position = cartesian3DToGLPosition( position3d );
@@ -70,22 +72,21 @@ in float v_dash_opacity;
 flat in vec3 v_flat_position;
 in vec3 v_position;
 
-
 out vec4 outColor;
 
 void main() {
     outColor = v_color;
     return;
-    float dash_length = v_dash_length;
-    float dash_opacity = v_dash_opacity;
+    // float dash_length = v_dash_length;
+    // float dash_opacity = v_dash_opacity;
 
-    if ( dash_length == 0.0 ) {
-        outColor = vec4( v_color.rgb, v_color.a * v_dash_opacity );
-    } else {
-        float dist = distance( v_flat_position, v_position );
-        // float alpha = mod( dist , v_dash_length * 2.0 ) / v_dash_length < 1.0 ? 1.0 : v_dash_opacity;
-        outColor = vec4( v_color.rgb,  v_color.a * opacity );
-    }
+    // if ( dash_length == 0.0 ) {
+        outColor = vec4( v_color.rgb, v_color.a );
+    // } else {
+    //     float dist = distance( v_flat_position, v_position );
+    //     // float alpha = mod( dist , v_dash_length * 2.0 ) / v_dash_length < 1.0 ? 1.0 : v_dash_opacity;
+    //     outColor = vec4( 1.0, 1.0, 1.0,  v_color.a * opacity *alpha);
+    // }
 }`;
 export class LineProgram {
     _vaosPublished = [];
@@ -105,14 +106,14 @@ export class LineProgram {
         this.program = createProgram(this.gl, vertexShaderSource, fragmentShaderSource);
         const currentProgram = this.gl.getParameter(this.gl.CURRENT_PROGRAM);
         this.gl.useProgram(this.program);
-        this._opacity.location = this.gl.getUniformLocation(this.program, "opacity");
+        this._opacity.location = this.gl.getUniformLocation(this.program, "u_opacity");
         this.gl.uniform1f(this._opacity.location, this._opacity.value);
         // bind attribute locations
         this.gl.bindAttribLocation(this.program, 0, "position3d");
         this.gl.bindAttribLocation(this.program, 1, "position2d");
         this.gl.bindAttribLocation(this.program, 2, "color");
-        this.gl.bindAttribLocation(this.program, 3, "dash_length");
-        this.gl.bindAttribLocation(this.program, 4, "dash_opacity");
+        // this.gl.bindAttribLocation(this.program, 3, "dash_length");
+        // this.gl.bindAttribLocation(this.program, 4, "dash_opacity");
         this.cameraBlockTotem = CameraUniformBlockTotemCache.get(globe);
         this.cameraBlockTotem.assignBindingPoint(this.program, uniformBindingPoints.camera);
         flexibleBlockManager.assignBindingPoint(this.gl, this.program);
@@ -124,15 +125,16 @@ export class LineProgram {
         this._ubosPublished.push(ubo);
         return ubo;
     }
-    createVAO(position3D, position2D, color, dashLength, dashOpacity) {
+    createVAO(position3D, position2D, color //, dashLength: BufferAndReadInfo, dashOpacity: BufferAndReadInfo,
+    ) {
         const { gl } = this;
         const vao = gl.createVertexArray();
         gl.bindVertexArray(vao);
         attributeLoader(gl, position3D, 0, 3);
         attributeLoader(gl, position2D, 1, 2);
         attributeLoader(gl, color, 2, 4, { escapeValues: [ESCAPE_VALUE, ESCAPE_VALUE, ESCAPE_VALUE, ESCAPE_VALUE] });
-        attributeLoader(gl, dashLength, 3, 1, { escapeValues: [ESCAPE_VALUE] });
-        attributeLoader(gl, dashOpacity, 4, 1, { escapeValues: [ESCAPE_VALUE] });
+        // attributeLoader(gl, dashLength, 3, 1, { escapeValues: [ESCAPE_VALUE] });
+        // attributeLoader(gl, dashOpacity, 4, 1, { escapeValues: [ESCAPE_VALUE] });
         gl.bindVertexArray(null);
         return vao;
     }

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

@@ -1,10 +1,9 @@
-import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems";
+import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/camerauniformblock";
 import { slerp, POLE, R_3D, mercatorXYToGLPosition, cartesian3DToGLPosition } from "../../util/shaderfunctions/geometrytransformations";
-import { createProgram } from "../../util";
+import { createProgram } from "../../util/webglobjectbuilders";
 import { noRegisterGlobeProgramCache } from "../programcache";
 import { attributeLoader } from "../../util/gl-util/buffer/attribute-loader";
 import { UniformBlockManager } from "../../util/gl-util/uniform-block/manager";
-import "../../util/gl-util/draw-options/types";
 import { drawInstanced } from "../../util/gl-util/draw-options/methods";
 const GLOBE_MIDPOINT_COUNT = 30;
 const escapeValue = -1.0;
@@ -13,9 +12,9 @@ const uniformBindingPoints = {
     flexible: 1
 };
 const uniformBlockManager = new UniformBlockManager('FlexibleAttibutes', [
-    { name: 'u_color', type: 'vec4' },
-    { name: 'u_dash_ratio', type: 'float' },
-    { name: 'u_dash_opacity', type: 'float' }
+    { name: 'u_color', type: 'vec4', value: null },
+    { name: 'u_dash_ratio', type: 'float', value: null },
+    { name: 'u_dash_opacity', type: 'float', value: null }
 ], uniformBindingPoints.flexible);
 const vertexShader = `#version 300 es
 precision highp float;
@@ -96,6 +95,14 @@ void main() {
 class Logic {
     vaosPublished = [];
     isFreed = false;
+    globe;
+    gl;
+    program;
+    _lastOpacity;
+    _opacityLocation;
+    cameraBlockTotem;
+    _ubosPublished;
+    _defaultFlexibleUBO;
     constructor(globe) {
         this.globe = globe;
         this.gl = globe.gl;
@@ -122,14 +129,11 @@ class Logic {
         this._defaultFlexibleUBO = this.createUBO();
     }
     /**
-     *
-     * @param {*} vao
-     * @param {DrawRangeIndexParams} drawOptions
-     * @param {number} opacity
-     * @param {Object} flexibleOptions
-     * @param {Array<number, number, number, number>} flexibleOptions.color // 0-1
-     * @param {number} flexibleOptions.dash_opacity
-     * @param {number} flexibleOptions.dash_ratio
+     * Draw method for rendering lines on globe
+     * @param vao - WebGL Vertex Array Object
+     * @param drawOptions - Draw range index parameters
+     * @param opacity - Opacity value (0-1)
+     * @param flexibleUBO - Optional flexible uniform buffer object
      */
     draw(vao, drawOptions, opacity, flexibleUBO = null) {
         const { gl, program, globe, cameraBlockTotem, _defaultFlexibleUBO } = this;
@@ -162,6 +166,9 @@ class Logic {
     createVAO(startPotision2DBufferObj, startPotision3DBufferObj, endPosition2DBufferObj, endPosition3DBufferObj, dashRatioBufferObj, dashOpacityBufferObj, colorBufferObj) {
         const { gl } = this;
         const vao = gl.createVertexArray();
+        if (!vao) {
+            throw new Error("Failed to create vertex array object");
+        }
         gl.bindVertexArray(vao);
         const divisor = 1;
         attributeLoader(gl, startPotision2DBufferObj, 0, 2, { divisor });
@@ -181,8 +188,8 @@ class Logic {
             return;
         CameraUniformBlockTotemCache.release(this.globe);
         this.gl.deleteProgram(this.program);
-        this.vaosPublished.forEach(vao => this.gl.deleteVertexArray(vao));
-        this._ubosPublished.forEach(ubo => ubo.free());
+        this.vaosPublished.forEach((vao) => this.gl.deleteVertexArray(vao));
+        this._ubosPublished.forEach((ubo) => ubo.free());
         this.isFreed = true;
     }
 }

package/programs/picking/pickable-renderer.js

@@ -2,8 +2,7 @@ import { createProgram } from "../../util";
 import { CameraUniformBlockTotemCache, CameraUniformBlockString } from "../totems";
 import { mercatorXYToGLPosition, cartesian3DToGLPosition, R_3D, R } from "../../util/shaderfunctions/geometrytransformations";
 import { noRegisterGlobeProgramCache } from "../programcache";
-import "../../util/gl-util/draw-options/types";
-import { drawArrays } from "../../util/gl-util/draw-options/methods";
+import { drawArrays, DrawRangeIndexParams } from "../../util/gl-util/draw-options/methods";
 import { attributeLoader } from "../../util/gl-util/buffer/attribute-loader";
 import { UniformBlockManager } from "../../util/gl-util/uniform-block/manager";
 const uniformBindingPoints = {