@pirireis/webglobeplugins 0.15.35 → 0.16.0

package/rangerings/ring-account.js

@@ -1,112 +1,129 @@
-/**
- * This account interacts with buffer orchestrations and buffers.
- * For rings, coordinates and paddings
- */
-const ringKeyMethod = (centerID, ringID) => `${centerID}_${ringID}`;
-const ringBigPaddingKeyMethod = (centerID, ringID, angle) => `${centerID}_${ringID}_${angle}`;
-/**
- * @typedef { Array < { ringID, radius, paddingRange } >} rings
- * @param { Array < centerID: string, x: number, y: number, stepAngle: number, rgba: [4 numbers], rings: rings } items
- */
-class RingAccount {
-    constructor() {
-        this._centralMap = new Map(); // key, new MAP(x,y, rings:[])
-    }
-    /**
-     * @typedef {centerID, long,lat, rings} centralItem
-     *
-     */
-    insertCenter(centralItem) {
-        centralItem.rings.forEach((ring) => {
-            ring.__identity__ = ringKeyMethod(centralItem.centerID, ring.ringID);
-        });
-        this._centralMap.set(centralItem.centerID, {
-            ...centralItem,
-            rgba: new Float32Array(centralItem.rgba),
-        });
-    }
-    getCenter(centerID) {
-        return this._centralMap.get(centerID);
-    }
-    updateCentersCoordinate(items) {
-        for (const { centerID, long, lat } of items) {
-            const center = this.getCenter(centerID);
-            if (center) {
-                center.long = long;
-                center.lat = lat;
-            }
-        }
-    }
-    updateCentersHide(items) {
-        for (const { centerID, hide = null, textHide = null } of items) {
-            const center = this.getCenter(centerID);
-            if (center) {
-                if (hide !== null)
-                    center.hide = hide;
-                if (textHide !== null)
-                    center.textHide = textHide;
-            }
-        }
-    }
-    /**
-     *
-     * @param {Array<{centerID, rgba}>} centersColor
-     */
-    updateCentersColor(centersColor) {
-        for (const { centerID, rgba } of centersColor) {
-            const center = this.getCenter(centerID);
-            if (center) {
-                center.rgba = new Float32Array(rgba);
-            }
-        }
-    }
-    // to delete rings and one degree paddings from buffer  
-    ringKeys(centerID) {
-        const result = [];
-        const center = this.getCenter(centerID);
-        if (center) {
-            const rings = center.rings;
-            for (const { __identity__ } of rings) {
-                result.push(__identity__);
-            }
-        }
-        return result;
-    }
-    // To delete big paddings from buffer
-    ringBigPaddingKeys(centerID) {
-        const result = [];
-        const center = this.getCenter(centerID);
-        if (!center)
-            return [];
-        const { rings, stepAngle } = center;
-        for (const { ringID } of rings) {
-            let angle = 0;
-            while (angle < 360) {
-                result.push(ringBigPaddingKeyMethod(centerID, ringID, angle));
-                angle += stepAngle;
-            }
-        }
-        return result;
-    }
-    removeCenters(centerIDs) {
-        const centralMap = this._centralMap;
-        centerIDs.forEach((centerID) => {
-            centralMap.delete(centerID);
-        });
-    }
-    textUpdate(centerID, textWriterObjs, dataPreAdaptor = null) {
-        const center = this.getCenter(centerID);
-        if (!center)
-            return;
-        const data = (dataPreAdaptor) ? dataPreAdaptor(center) : center;
-        textWriterObjs.forEach((writer) => {
-            writer.insertTextBulk(data.rings, data);
-        });
-    }
-    updateAllText(textWriterObjs, dataPreAdaptor = null) {
-        this._centralMap.forEach((center) => {
-            this.textUpdate(center.centerID, textWriterObjs, dataPreAdaptor);
-        });
-    }
-}
-export { RingAccount, ringKeyMethod, ringBigPaddingKeyMethod };
+/**
+ * This account interacts with buffer orchestrations and buffers.
+ * For rings, coordinates and paddings
+ */
+
+
+const ringKeyMethod = (centerID, ringID) => `${centerID}_${ringID}`;
+const ringBigPaddingKeyMethod = (centerID, ringID, angle) => `${centerID}_${ringID}_${angle}`;
+
+/**
+ * @typedef { Array < { ringID, radius, paddingRange } >} rings
+ * @param { Array < centerID: string, x: number, y: number, stepAngle: number, rgba: [4 numbers], rings: rings } items
+ */
+class RingAccount {
+    constructor() {
+        this._centralMap = new Map(); // key, new MAP(x,y, rings:[])
+
+    }
+
+    /**
+     * @typedef {centerID, long,lat, rings} centralItem
+     * 
+     */
+    insertCenter(centralItem) {
+        centralItem.rings.forEach((ring) => {
+            ring.__identity__ = ringKeyMethod(centralItem.centerID, ring.ringID);
+        });
+        this._centralMap.set(centralItem.centerID, {
+            ...centralItem,
+            rgba: new Float32Array(centralItem.rgba),
+
+        });
+    }
+
+
+    getCenter(centerID) {
+        return this._centralMap.get(centerID);
+    }
+
+    updateCentersCoordinate(items) {
+        for (const { centerID, long, lat } of items) {
+            const center = this.getCenter(centerID);
+            if (center) {
+                center.long = long;
+                center.lat = lat;
+            }
+        }
+    }
+
+    updateCentersHide(items) {
+        for (const { centerID, hide = null, textHide = null } of items) {
+            const center = this.getCenter(centerID);
+            if (center) {
+                if (hide !== null) center.hide = hide;
+                if (textHide !== null) center.textHide = textHide;
+            }
+        }
+    }
+
+
+    /**
+     * 
+     * @param {Array<{centerID, rgba}>} centersColor 
+     */
+    updateCentersColor(centersColor) {
+        for (const { centerID, rgba } of centersColor) {
+            const center = this.getCenter(centerID);
+            if (center) {
+                center.rgba = new Float32Array(rgba);
+            }
+        }
+    }
+
+    // to delete rings and one degree paddings from buffer  
+    ringKeys(centerID) {
+        const result = [];
+        const center = this.getCenter(centerID);
+        if (center) {
+            const rings = center.rings;
+            for (const { __identity__ } of rings) {
+                result.push(__identity__);
+            }
+        }
+        return result;
+    }
+
+    // To delete big paddings from buffer
+    ringBigPaddingKeys(centerID) {
+        const result = [];
+        const center = this.getCenter(centerID);
+        if (!center) return [];
+        const { rings, stepAngle } = center;
+        for (const { ringID } of rings) {
+            let angle = 0;
+            while (angle < 360) {
+                result.push(ringBigPaddingKeyMethod(centerID, ringID, angle));
+                angle += stepAngle;
+            }
+        }
+        return result;
+    }
+
+
+    removeCenters(centerIDs) {
+        const centralMap = this._centralMap;
+        centerIDs.forEach((centerID) => {
+            centralMap.delete(centerID);
+        });
+    }
+
+    textUpdate(centerID, textWriterObjs, dataPreAdaptor = null) {
+        const center = this.getCenter(centerID);
+        if (!center) return;
+        const data = (dataPreAdaptor) ? dataPreAdaptor(center) : center;
+        textWriterObjs.forEach((writer) => {
+            writer.insertTextBulk(data.rings, data);
+        });
+
+    }
+
+    updateAllText(textWriterObjs, dataPreAdaptor = null) {
+        this._centralMap.forEach((center) => {
+            this.textUpdate(center.centerID, textWriterObjs, dataPreAdaptor);
+        });
+    }
+}
+
+
+export { RingAccount, ringKeyMethod, ringBigPaddingKeyMethod };

package/semiplugins/interface.ts

@@ -0,0 +1,14 @@
+import { Globe, Color } from "../types";
+
+export interface SemiPluginInterface {
+    id: string;
+    init(globe: Globe, gl: WebGL2RenderingContext): void;
+    setPluginOpacity(opacity: number, drawRender: boolean): void;
+    insertBulk(data: any[]): void;
+    deleteBulk(keys: string[]): void;
+    setDefaultColor(color: Color, drawRender: boolean): void;
+    increaseSpace(amount: number): void;
+    updateCoordinates(items: any[]): void;
+}
+
+

package/semiplugins/lightweight/line-plugin.ts

@@ -0,0 +1,343 @@
+import { SemiPluginInterface } from "../interface";
+import { LineOnGlobeCache } from "../../programs/line-on-globe/naive-accurate-flexible";
+import { PluginStyleOptions } from "../type";
+import { Globe, ProgramInterface, PluginInterface, Color, BUFFER_TYPE } from "../../types";
+
+
+
+import { BufferOrchestrator } from "../../util/account/single-attribute-buffer-management/buffer-orchestrator";
+import { BufferManager } from "../../util/account/single-attribute-buffer-management/buffer-manager";
+import { BufferManagersMap } from "../../util/account/single-attribute-buffer-management/types";
+
+import { LongLat, UBOHandler } from "../../types";
+
+import { sphereCoord } from "../../util/geometry/index";
+import { constraintFloat } from "../../util/check/typecheck";
+import { BufferAndReadInfo } from "../../types";
+
+/**
+ * This plugin is lightweight. Processes and memories minimal data. Sacrifices details.
+ * Only two points to draw a line in 2D and an Arc in 3D.
+ * The 3D arc does not fit the terrain!
+ * The 2D line is straight, not great circle projection
+ */
+
+export type LineInput = {
+    key: string; // Unique key for the line
+    start: LongLat; // Start position
+    start_altitude?: number; // Start altitude, default is 0
+    end: LongLat; // End position
+    end_altitude?: number; // End altitude, default is 0
+    color?: Color; // Color of the line
+    dashed_line_opacity?: number; // Proportion of the opacity of the dashed line
+    dashed_line_ratio?: number; // Ratio of the dashed line
+}
+
+export type LinePluginOptions = PluginStyleOptions & {
+
+    flatViewOn: boolean; // If true, the line will be drawn in flat view.
+    globeViewOn: boolean; // If true, the line will be drawn in globe view.
+    variativeColorsOn: boolean; // If true, the color will be variative based on the circle's radius.
+    defaultColor: Color; // Default color of the line.
+    dashedLineOpacityVariativeOn: boolean; // If true, the line will be dashed.
+    dashedLineRatioVariativeOn: boolean; // If true, the dashed line ratio will be variative based on the circle's radius.
+    bufferType: BUFFER_TYPE; // Buffer draw type, default is DYNAMIC_DRAW
+    opacity: number; // Opacity of the line, default is 1.0
+    initialCapacity: number;
+
+}
+
+export class LinePlugin implements PluginInterface, SemiPluginInterface {
+    id: string;
+    private globe: Globe | null = null;
+    private gl: WebGL2RenderingContext | null = null;
+    private program: ProgramInterface | null = null;
+    private vao: WebGLVertexArrayObject | null = null;
+    private _options: LinePluginOptions;
+    private _uboHandler: UBOHandler | null = null;
+    private bufferOrchestrator: BufferOrchestrator;
+    private bufferManagersMap: BufferManagersMap = new Map();
+    private _freed: boolean = false;
+
+    constructor(id: string, {
+        flatViewOn = true,
+        globeViewOn = true,
+        variativeColorsOn = false,
+        defaultColor = [1, 1, 1, 1],
+        dashedLineOpacityVariativeOn = false,
+        dashedLineRatioVariativeOn = false,
+        bufferType = "DYNAMIC_DRAW",
+        opacity = 1.0,
+        initialCapacity = 10
+    }: Partial<LinePluginOptions> = {}) {
+        this.id = id;
+        this._options = {
+            flatViewOn: flatViewOn ?? true,
+            globeViewOn: globeViewOn ?? true,
+            variativeColorsOn: variativeColorsOn ?? false,
+            defaultColor: defaultColor ?? [1, 1, 1, 1],
+            dashedLineOpacityVariativeOn: dashedLineOpacityVariativeOn ?? false,
+            dashedLineRatioVariativeOn: dashedLineRatioVariativeOn ?? false,
+            bufferType: bufferType ?? "DYNAMIC_DRAW",
+            opacity: opacity ?? 1.0,
+            initialCapacity: initialCapacity ?? 10
+        };
+        this.bufferOrchestrator = new BufferOrchestrator({ capacity: initialCapacity ?? 10 });
+    }
+
+
+    init(globe: Globe, gl: WebGL2RenderingContext): void {
+        this.globe = globe;
+        this.gl = gl;
+
+        this.program = LineOnGlobeCache.get(globe) as ProgramInterface;
+
+        this._uboHandler = this.program.createUBO() as UBOHandler;
+        this.setDefaultColor(this._options.defaultColor);
+
+
+        this._fillManagerMap();
+
+
+        this.vao = this.program.createVAO(
+            ...this._createSelectBufferNames().map((key) => {
+                if (key === null) {
+                    return null;
+                }
+                const bufferManagerComp = this.bufferManagersMap.get(key);
+                if (bufferManagerComp === undefined) {
+                    throw new Error(`Buffer key ${key} does not exist in bufferManagersMap`);
+                }
+                const { bufferManager } = bufferManagerComp;
+                return {
+                    stride: 0,
+                    offset: 0,
+                    buffer: bufferManager.buffer as WebGLBuffer
+                } as BufferAndReadInfo;
+            })
+        );
+
+    }
+
+    // PLUGIN INTERFACE METHODS
+
+
+
+    increaseSpace(amount: number): void {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot increase space");
+            return;
+        }
+        if (this.globe === null) {
+            console.warn("Globe is not initialized.");
+            return;
+        }
+        if (typeof amount !== "number" || amount <= 0) {
+            console.warn("Invalid amount, must be a positive number");
+            return;
+        }
+        this.bufferOrchestrator.ensureSpace(amount, this.bufferManagersMap!);
+    }
+
+
+    insertBulk(items: Array<LineInput>): void {
+        const { bufferOrchestrator, bufferManagersMap, globe } = this;
+        if (!bufferOrchestrator || !globe) {
+            throw new Error("Buffer orchestrator or globe is not initialized.");
+        }
+        bufferOrchestrator.insertBulk(items, bufferManagersMap);
+        this.globe?.DrawRender();
+    }
+
+    deleteBulk(keys: Array<string>): void {
+        const { bufferOrchestrator, bufferManagersMap, globe } = this;
+        if (!bufferOrchestrator || !globe) {
+            throw new Error("Buffer orchestrator or globe is not initialized.");
+        }
+        bufferOrchestrator.deleteBulk(keys, bufferManagersMap);
+        this.globe?.DrawRender();
+    }
+
+
+    setPluginOpacity(opacity: number, drawRender: boolean = false): void {
+        constraintFloat(opacity, 0, 1);
+        this._options.opacity = opacity;
+        if (drawRender) {
+            this.globe?.DrawRender();
+        }
+    }
+
+    setPluginDashedLineRatio(ratio: number): void {
+        constraintFloat(ratio, 0, 1);
+        this._uboHandler?.updateSingle("dashed_line_ratio", new Float32Array([ratio]));
+        this.globe?.DrawRender();
+    }
+
+    setPluginDashLineOpacity(opacity: number): void {
+        constraintFloat(opacity, 0, 1);
+        this._options.dashedLineOpacityVariativeOn = true;
+        this._options.defaultColor[3] = opacity; // Update the default color's alpha channel
+        this.globe?.DrawRender();
+    }
+
+
+
+    setDefaultColor(color: Color, drawRender: boolean = false): void {
+        if (!this.globe || !this.gl) {
+            console.warn("Globe or WebGL context is not initialized.");
+            return;
+        }
+        this._options.defaultColor = color;
+        this._uboHandler?.updateSingle("u_color", new Float32Array(color));
+        if (drawRender) {
+            this.globe.DrawRender();
+        }
+    }
+
+
+
+    updateCoordinates(items: Pick<LineInput, "key" | "start" | "end">[]): void {
+        throw new Error("Method not implemented.");
+    }
+    // GLOBE INTERACTION METHODS
+
+    draw3D(): void {
+        if (this._freed) {
+            console.warn("Plugin has been freed, cannot draw.");
+        };
+
+        if (!this.globe || !this.gl || !this.program || !this.vao) {
+            throw new Error("Globe, GL context or program is not initialized.");
+        }
+
+        const { bufferOrchestrator, _options, _uboHandler, vao } = this;
+        if (!bufferOrchestrator || !bufferOrchestrator || !_uboHandler) {
+            throw new Error("Buffer orchestrator is not initialized.");
+        }
+
+        const { flatViewOn, globeViewOn, opacity } = _options;
+
+        const drawOptions = {
+            drawRange: {
+                first: 0,
+                count: bufferOrchestrator.length
+            }
+        }
+        this.gl.disable(this.gl.DEPTH_TEST); // Disable depth test for lines
+        const currentGeometry = this.globe.api_GetCurrentGeometry();
+        if (currentGeometry === 0 && globeViewOn) {
+            // @ts-ignore
+            this.program.draw(vao, drawOptions, opacity, _uboHandler)
+        } else if (currentGeometry === 1 && flatViewOn) {
+            // @ts-ignore
+            this.program.draw(vao, drawOptions, opacity, _uboHandler);
+        }
+        this.gl.enable(this.gl.DEPTH_TEST); // Re-enable depth test after drawing
+    }
+
+
+    free(): void {
+        if (this._freed) return;
+        // TODO: FILL
+
+        this.bufferManagersMap.forEach((manager) => {
+            manager.bufferManager.free();
+        });
+        this._uboHandler?.free();
+        LineOnGlobeCache.release(this.globe as Globe);
+        this._freed = true;
+    }
+
+
+
+    // IMPLICIT INTERFACE METHODS
+
+    _fillManagerMap(): void {
+        const globe = this.globe as Globe;
+
+        const {
+            flatViewOn,
+            globeViewOn,
+            variativeColorsOn,
+            dashedLineOpacityVariativeOn,
+            dashedLineRatioVariativeOn,
+            bufferType = "DYNAMIC_DRAW"
+        } = this._options;
+
+        const m = this.bufferManagersMap;
+        const initialCapacity = this._options.initialCapacity;
+
+        if (flatViewOn) {
+            m.set("start_position",
+                {
+                    bufferManager: new BufferManager(globe.gl, 2, { bufferType, initialCapacity: this._options.initialCapacity }),
+                    adaptor: (item: LineInput) => {
+                        const result = new Float32Array(globe.api_GetMercator2DPoint(item.start[0], item.start[1]))
+                        return result;
+                    }
+                });
+            m.set("end_position", {
+                bufferManager: new BufferManager(globe.gl, 2, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => new Float32Array(globe.api_GetMercator2DPoint(item.end[0], item.end[1]))
+            });
+        }
+
+        if (globeViewOn) {
+            m.set("start_position_3d", {
+                bufferManager: new BufferManager(globe.gl, 3, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => sphereCoord(item.start[0], item.start[1], globe, item.start_altitude || 0)
+            });
+
+            m.set("end_position_3d", {
+                bufferManager: new BufferManager(globe.gl, 3, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => sphereCoord(item.end[0], item.end[1], globe, item.end_altitude || 0)
+
+            });
+        }
+
+        if (variativeColorsOn) {
+            m.set("color", {
+                bufferManager: new BufferManager(globe.gl, 4, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => new Float32Array(item.color !== undefined ? item.color : [-1, -1, -1, -1])
+            });
+        }
+
+        if (dashedLineOpacityVariativeOn) {
+            m.set("dashed_line_opacity", {
+                bufferManager: new BufferManager(globe.gl, 1, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => new Float32Array(item.dashed_line_opacity !== undefined ? [item.dashed_line_opacity] : [-1])
+            });
+        }
+
+        if (dashedLineRatioVariativeOn) {
+            m.set("dashed_line_ratio", {
+                bufferManager: new BufferManager(globe.gl, 1, { bufferType, initialCapacity: this._options.initialCapacity }),
+                adaptor: (item: LineInput) => new Float32Array(item.dashed_line_ratio !== undefined ? [item.dashed_line_ratio] : [-1])
+            });
+        }
+
+    }
+
+
+    _createSelectBufferNames(): Array<string | null> {
+        const {
+            flatViewOn,
+            globeViewOn,
+            variativeColorsOn,
+            dashedLineOpacityVariativeOn,
+            dashedLineRatioVariativeOn
+        } = this._options;
+
+        return [
+            flatViewOn ? "start_position" : null,
+            globeViewOn ? "start_position_3d" : null,
+            flatViewOn ? "end_position" : null,
+            globeViewOn ? "end_position_3d" : null,
+            dashedLineOpacityVariativeOn ? "dashed_line_opacity" : null,
+            dashedLineRatioVariativeOn ? "dashed_line_ratio" : null,
+            variativeColorsOn ? "color" : null
+        ]
+    }
+
+}
+