@pirireis/webglobeplugins 0.15.34 → 0.16.0

package/range-tools-on-terrain/range-ring/adapters.ts

@@ -0,0 +1,114 @@
+import { Globe, Color, CentigradeDegree, LongLat } from '../../types';
+import { CircleInput } from "../../semiplugins/shape-on-terrain/circle-plugin";
+import { ArcInput } from "../../semiplugins/shape-on-terrain/arc-plugin";
+import { Padding1DegreeInput } from '../../semiplugins/shape-on-terrain/padding-1-degree';
+import { RangeRingInput, RangeRing } from './types';
+
+
+// export const rangeRingToPaddingInputAdapter = () => (rangeRing: RangeRingInput): PaddingInput => {
+//     return {
+//         key: rangeRing.key,
+//         center: [rangeRing.long, rangeRing.lat],
+//         radius: rangeRing.radius,
+//         color: rangeRing.rgba as Color,
+//         altitude: rangeRing.altitude,
+//     };
+// }
+
+
+export const keyAdapter = (centerID: string, rangeID: string): string => {
+    return `${centerID}-${rangeID}`;
+}
+
+
+export const allCircleKeysAdapter = (rangeRing: RangeRingInput): string[] => {
+    const result = new Array<string>(rangeRing.rings.length);
+    for (let i = 0; i < rangeRing.rings.length; i++) {
+        result[i] = keyAdapter(rangeRing.centerID, rangeRing.rings[i].ringID);
+    }
+    return result;
+}
+
+
+export const rangeRingToCircleInputAdapter = (rangeRing: RangeRingInput): CircleInput[] => {
+    const centerID = rangeRing.centerID;
+    return rangeRing.rings.map(ring => ({
+        key: keyAdapter(centerID, ring.ringID),
+        center: [rangeRing.long, rangeRing.lat],
+        radius: ring.radius,
+        color: rangeRing.rgba as Color,
+        altitude: rangeRing.altitude,
+    }));
+};
+
+
+export const allArcKeysAdapter = (rangeRing: RangeRingInput): string[] => {
+    const arcEachRing = Math.ceil(360 / rangeRing.stepAngle);
+    const result = new Array<string>(arcEachRing * rangeRing.rings.length);
+    for (let i = 0; i < rangeRing.rings.length; i++)
+        for (let j = 0; j < arcEachRing; j++)
+            result[i * arcEachRing + j] = keyAdapter(rangeRing.centerID, rangeRing.rings[i].ringID) + `-${j}`;
+    return result;
+}
+
+
+export const rangeRingToArcInputAdapter = (globe: Globe, rangeRingInput: RangeRingInput): ArcInput[] => {
+    const { long, lat, stepAngle, altitude = 0, rgba, rings } = rangeRingInput;
+    const arcEachRing = Math.ceil(360 / stepAngle);
+    const result = new Array<ArcInput>(rings.length * arcEachRing);
+    for (let i = 0; i < rings.length; i++) {
+        const ring = rings[i];
+        for (let j = 0; j < arcEachRing; j++) {
+            const angle = Math.min(stepAngle * j, 360);
+            const startLongLat = globe.Math.FindPointByPolar(long, lat, ring.radius, angle)
+            const endLongLat = globe.Math.FindPointByPolar(long, lat, ring.radius - ring.padding, angle);
+            result[i * arcEachRing + j] = {
+                key: keyAdapter(rangeRingInput.centerID, ring.ringID) + `-${j}`,
+                start: [startLongLat.long, startLongLat.lat] as LongLat,
+                end: [endLongLat.long, endLongLat.lat] as LongLat,
+                color: rgba as Color,
+                height: altitude,
+            };
+        }
+    }
+    return result
+}
+
+
+export function createColorRatios(color: Color, stepAngle: number, colorFade: number = 0.4): { color: Color; ratio: number }[] {
+    const angleCount = Math.ceil(360 / stepAngle) * 2;
+    let angleLeft = 360;
+    const result = new Array<{ color: Color; ratio: number }>(angleCount);
+    for (let i = 0; i < angleCount; i++) {
+        const currentAngle = Math.min(stepAngle, angleLeft);
+        angleLeft -= currentAngle;
+        result[i * 2] = {
+            color: [0, 0, 0, 0] as Color,
+            ratio: 1,
+        }
+        const colorRatio = {
+            // color: i % 2 === 0 ? color : [color[0] * colorFade, color[1] * colorFade, color[2] * colorFade, color[3]] as Color,
+            color: i % 2 === 0 ? color : [1 - color[0] * colorFade, 1 - color[1] * colorFade, 1 - color[2] * colorFade, color[3]] as Color,
+            ratio: currentAngle - 1
+        };
+        result[i * 2 + 1] = colorRatio;
+    }
+    return result;
+}
+
+
+export const padding1DegreeInputAdapter = (bearingLine: RangeRingInput): Padding1DegreeInput[] => {
+    const { long, lat, rgba, altitude = 0, rings, stepAngle } = bearingLine;
+    const result = new Array<Padding1DegreeInput>(rings.length);
+    for (let i = 0; i < rings.length; i++) {
+        const ring = rings[i];
+        result[i] = {
+            key: keyAdapter(bearingLine.centerID, ring.ringID),
+            center: [long, lat],
+            radius: ring.radius,
+            colorsRatios: createColorRatios(rgba as Color, stepAngle, 0.5),
+            heightFromGroundIn3D: altitude,
+        };
+    }
+    return result;
+}

package/range-tools-on-terrain/range-ring/enum.ts

@@ -0,0 +1,2 @@
+export const ENUM_HIDE = Object.freeze({ SHOW: 0, HIDE: 1, HIDE_1_DEGREE_PADDINGS: 2 } as const);
+export const ENUM_TEXT_HIDE = Object.freeze({ SHOW: 0, HIDE: 1 } as const);

package/range-tools-on-terrain/range-ring/plugin.ts

@@ -0,0 +1,447 @@
+import { CircleOnTerrainPlugin, CircleOnTerrainPluginOptions } from "../../semiplugins/shape-on-terrain/circle-plugin";
+import { ArcOnTerrainPlugin, ArcOnTerrainPluginOptions } from "../../semiplugins/shape-on-terrain/arc-plugin";
+import { Padding1DegreePlugin, Padding1DegreePluginOptions } from '../../semiplugins/shape-on-terrain/padding-1-degree';
+
+import {
+    padding1DegreeInputAdapter,
+    rangeRingToArcInputAdapter,
+    rangeRingToCircleInputAdapter,
+    allCircleKeysAdapter,
+    allArcKeysAdapter,
+    createColorRatios,
+    keyAdapter
+} from "./adapters";
+
+import { Color, PluginInterface, Globe, } from "../../types";
+import { RangeRingInput } from "./types";
+import { ContextTextWriter4 } from "../../write-text/context-text4";
+import RangeRingAngleText from "./rangeringangletext";
+import { opacityCheck } from "../../util/check/typecheck";
+
+
+export enum ENUM_HIDE {
+    SHOW = 0,
+    HIDE = 1,
+    HIDE_1_DEGREE_PADDINGS = 2
+}
+
+export enum ENUM_TEXT_HIDE {
+    SHOW = 0,
+    HIDE = 1
+}
+
+// @ts-ignore
+export class RangeRingPlugin implements PluginInterface {
+
+    id: string
+    private globe: Globe | null = null;
+    private gl: WebGLRenderingContext | null = null;
+    private circlePlugin: CircleOnTerrainPlugin;
+    private arcPlugin: ArcOnTerrainPlugin;
+    private paddingPlugin: Padding1DegreePlugin | null = null; // TODO: implement padding plugin
+    private _memory: Map<string, RangeRingInput> = new Map();
+    private _freed: boolean = false;
+    private textWritersMap: Map<string, ContextTextWriter4> = new Map();
+    private rangeRingAngleText: RangeRingAngleText | null = null;
+    private _opacity: number = 1;
+    private _numbersStyle: any = null;
+    private draw1degrePadding = true;
+    
+    private _semiPluginOptions: {
+        circleOnTerrainOptions: Partial<CircleOnTerrainPluginOptions>;
+        arcOnTerrainOptions: Partial<ArcOnTerrainPluginOptions>;
+        paddingOptions: Partial<Padding1DegreePluginOptions>;
+    } = {
+            circleOnTerrainOptions: {
+                variativeColorsOn: true,
+                defaultColor: [1, 1, 1, 1],
+                defaultHeightFromGroundIn3D: 30,
+            },
+            arcOnTerrainOptions: {
+                flatViewOn: true,
+                globeViewOn: true,
+                variativeColorsOn: true,
+                defaultColor: [1, 1, 1, 1],
+                defaultHeightFromGroundIn3D: 0,
+                vertexCount: 32,
+                cameraAttractionIsOn: true // If true, camera attraction is enabled else evenly distributed arc points are used
+            },
+            paddingOptions: {
+                variativeColorsOn: true,
+                defaultColor: [1, 1, 1, 1],
+                defaultHeightFromGroundIn3D: 0,
+                adativePaddingSize: true,
+
+            },
+        };
+
+
+    constructor(id: string, {
+        textWritersMap = new Map<string, ContextTextWriter4>(),
+    }) {
+        this.id = id;
+        this.circlePlugin = new CircleOnTerrainPlugin(this.id + "-circle", {
+            variativeColorsOn: true,
+            ...this._semiPluginOptions.circleOnTerrainOptions
+        });
+        this.arcPlugin = new ArcOnTerrainPlugin(this.id + "-arc", {
+            variativeColorsOn: true,
+            ...this._semiPluginOptions.arcOnTerrainOptions
+        });
+        this.paddingPlugin = new Padding1DegreePlugin(this.id + "-padding", {
+            variativeColorsOn: true,
+            defaultColor: [1, 1, 1, 1],
+            defaultHeightFromGroundIn3D: 0,
+            ...this._semiPluginOptions.paddingOptions
+        });
+
+
+        if (textWritersMap) {
+            this.textWritersMap = textWritersMap;
+        }
+    }
+
+
+    insertBulk(items: RangeRingInput[]) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot insert items");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot insert items");
+            return;
+        }
+
+        items.forEach(item => {
+            if ( item.hide == null) item.hide = ENUM_HIDE.SHOW;
+            if ( item.textHide == null) item.textHide = ENUM_HIDE.SHOW;
+        });
+
+        const visableItems = items.filter(item => item.hide !== ENUM_HIDE.HIDE)
+
+        if (this.paddingPlugin) {
+            const paddingInputs = visableItems.map(item => padding1DegreeInputAdapter(item)).flat();
+            this.paddingPlugin.insertBulk(paddingInputs);
+        }
+
+        const circleInputs = visableItems.filter(item => item.hide === ENUM_HIDE.SHOW).map(rangeRingToCircleInputAdapter).flat();
+        this.circlePlugin.insertBulk(circleInputs);
+
+        const arcInputs = visableItems.map((item) => rangeRingToArcInputAdapter(this.globe!, item)).flat();
+        this.arcPlugin.insertBulk(arcInputs);
+        for (const item of items) {
+
+            this._memory.set(item.centerID, item);
+            if (item.hide !== ENUM_HIDE.HIDE && item.textHide === ENUM_HIDE.SHOW) {
+                this.updateText([item.centerID]);
+            }
+        }
+        this.rangeRingAngleText?.insertBulk(items);
+    }
+
+
+    removeCenters(centers: string[]) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot remove centers");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot remove centers");
+            return;
+        }
+
+        for (let i = 0; i < centers.length; i++) {
+            const rangeRingInput = this._memory.get(centers[i]);
+            if (!rangeRingInput) {
+                console.warn(`No data found for centerID: ${centers[i]}`);
+                continue;
+            }
+            this._memory.delete(centers[i]);
+            if ( rangeRingInput.hide === ENUM_HIDE.HIDE ) {
+                continue;
+            }
+            const circleKeys = allCircleKeysAdapter(rangeRingInput);
+            this.circlePlugin.deleteBulk(circleKeys);
+            const allArcKeys = allArcKeysAdapter(rangeRingInput);
+            this.arcPlugin.deleteBulk(allArcKeys);
+            if ( rangeRingInput.hide !== ENUM_HIDE.HIDE_1_DEGREE_PADDINGS ) {
+                this.paddingPlugin?.deleteBulk(circleKeys);
+            }
+        }
+        this.globe!.DrawRender();
+        this.rangeRingAngleText?.removeCenters(centers);
+    }
+
+
+    updateCentersCoordinate(items: Pick<RangeRingInput, "centerID" | "long" | "lat">[]) {
+
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update centers coordinates");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot update centers coordinates");
+            return;
+        }
+
+        const globe = this.globe!;
+
+        for (const item of items) {
+            const { centerID, long, lat } = item;
+            const rangeRingInput = this._memory.get(centerID);
+            if (rangeRingInput) {
+                rangeRingInput.long = long;
+                rangeRingInput.lat = lat;
+                if (rangeRingInput.hide === ENUM_HIDE.HIDE) {
+                    continue;
+                }
+                const arcData = rangeRingToArcInputAdapter(globe, rangeRingInput);
+                this.arcPlugin.updateCoordinates(arcData);
+                const circleData = rangeRingToCircleInputAdapter(rangeRingInput);
+                this.circlePlugin.updateCoordinates(circleData);
+                if (rangeRingInput.hide !== ENUM_HIDE.HIDE_1_DEGREE_PADDINGS) {
+                    this.paddingPlugin?.updateCoordinates(circleData);
+                }
+                this.updateText([centerID]);
+            }
+        }
+        this.rangeRingAngleText?.updateCentersXY(items);
+    }
+
+
+    updateCentersColor(items: Pick<RangeRingInput, "centerID" | "rgba">[]) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update centers color");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot update centers color");
+            return;
+        }
+
+        // update Colors from memory map
+        for (let item of items) {
+            const data = this._memory.get(item.centerID);
+            if (!data) {
+                console.warn(`No data found for centerID: ${item.centerID}`);
+                continue;
+            }
+            data.rgba = item.rgba;
+
+            if ( data.hide === ENUM_HIDE.HIDE ) {
+                continue;
+            }
+            // update arc Colors 
+            const arcColors = allArcKeysAdapter(data).map(key => ({ key, color: data.rgba }));
+            this.arcPlugin.updateColors(arcColors, false);
+            const circleColors = allCircleKeysAdapter(data).map(key => ({ key, color: data.rgba }));
+            this.circlePlugin.updateColors(circleColors);
+            if (this.paddingPlugin && data.hide !== ENUM_HIDE.HIDE_1_DEGREE_PADDINGS) {
+                const colorRatios = createColorRatios(data.rgba as Color, data.stepAngle, 0.5);
+                for (const { key } of circleColors) {
+                    this.paddingPlugin?.updateColorRatios(key, colorRatios, false);
+                }
+            }
+            this.updateText([item.centerID]);
+        }
+        this.globe!.DrawRender();
+    }
+
+
+    updateCentersHide(items: Pick<RangeRingInput, "centerID" | "hide" | "textHide">[]) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update centers hide");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot update centers hide");
+            return;
+        }
+
+        const globe = this.globe!;
+        for (const item of items) {
+            const { centerID, hide, textHide } = item;
+            const rangeRingInput = this._memory.get(centerID);
+            if (!rangeRingInput) {
+                console.warn(`No data found for centerID: ${centerID}`);
+                continue;
+            }
+            if ( textHide !== undefined) {
+                rangeRingInput.textHide = textHide;
+            }
+            if (hide !== undefined) {
+                if (rangeRingInput.hide !== hide) {
+                    if (hide === ENUM_HIDE.HIDE) {
+                        const circleKeys = allCircleKeysAdapter(rangeRingInput);
+                        this.circlePlugin.deleteBulk(circleKeys);
+                        if (rangeRingInput.hide !== ENUM_HIDE.HIDE_1_DEGREE_PADDINGS) {
+                            this.paddingPlugin?.deleteBulk(circleKeys);
+                        }
+                        const allArcKeys = allArcKeysAdapter(rangeRingInput);
+                        this.arcPlugin.deleteBulk(allArcKeys);
+                    } else {
+                        if ( rangeRingInput.hide === ENUM_HIDE.SHOW && hide === ENUM_HIDE.HIDE_1_DEGREE_PADDINGS ) {
+                            const paddingKeys = allCircleKeysAdapter(rangeRingInput);
+                            this.paddingPlugin?.deleteBulk(paddingKeys);
+                        } else if ( rangeRingInput.hide !== ENUM_HIDE.SHOW && hide === ENUM_HIDE.SHOW ) {
+                            const paddingData = padding1DegreeInputAdapter(rangeRingInput);
+                            this.paddingPlugin?.insertBulk(paddingData);
+                        }
+                        if ( rangeRingInput.hide === ENUM_HIDE.HIDE ) {
+                            const circleInputs = rangeRingToCircleInputAdapter(rangeRingInput);
+                            this.circlePlugin?.insertBulk(circleInputs);
+                            const arcInputs = rangeRingToArcInputAdapter(globe, rangeRingInput);
+                            this.arcPlugin?.insertBulk(arcInputs);  
+                            
+                        }
+                    }
+                    rangeRingInput.hide = hide;
+                }
+            }
+
+            if (rangeRingInput.textHide === ENUM_TEXT_HIDE.HIDE || rangeRingInput.hide === ENUM_HIDE.HIDE) {
+                this.textWritersMap.forEach((writer) => writer.deleteText(rangeRingInput));
+            } else if (rangeRingInput.textHide === ENUM_TEXT_HIDE.SHOW) {
+                this.textWritersMap.forEach((writer) => writer.insertText(rangeRingInput));
+            }
+        }
+
+        this.rangeRingAngleText?.updateCentersHide(items);
+        this.globe!.DrawRender();
+    }
+
+
+    setOpacity(opacity: number): void {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot set opacity");
+            return;
+        }
+        opacityCheck(opacity);
+        if (this._opacity === opacity) {
+            return;
+        }
+        this._opacity = opacity;
+        this.arcPlugin?.setPluginOpacity(opacity);
+        this.circlePlugin?.setPluginOpacity(opacity);
+        this.paddingPlugin?.setPluginOpacity(opacity);
+        this.textWritersMap.forEach((writer) => writer.setOpacity(opacity));
+        this.rangeRingAngleText?.setOpacity(opacity);
+        this.globe?.DrawRender();
+    }
+
+
+    setOneDegreePaddingOn(state: boolean): void {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot set padding on");
+            return;
+        }
+        if ( this.paddingPlugin === null ) {
+            console.warn("Padding plugin is not initialized");
+            return;
+        }
+        if( typeof state !== "boolean" ) {
+            console.warn("Invalid state type, expected boolean");
+            return;
+        }
+        this.draw1degrePadding = state;
+        this.globe?.DrawRender();
+    }
+
+    init(globe: Globe, gl: WebGL2RenderingContext) {
+        this.globe = globe;
+        this.gl = gl;
+        this.circlePlugin!.init(globe, gl);
+        this.arcPlugin!.init(globe, gl);
+        this.paddingPlugin?.init(globe, gl);
+
+        
+        this.rangeRingAngleText = new RangeRingAngleText(globe, this.id + "text", { style: this._numbersStyle, opacity: this._opacity });
+
+    }
+
+    draw3D() {
+        if (this._freed) {
+            console.warn("RangeRing Plugin is freed, cannot draw");
+            return;
+        }
+        this.arcPlugin.draw3D();
+        this.circlePlugin.draw3D();
+        if (this.draw1degrePadding) {
+            this.paddingPlugin?.draw3D();
+        }
+        for (const [key, writer] of this.textWritersMap) {
+            writer.draw();
+        }
+    }
+
+
+    setZAlphaOnDegreePadding(zAlphaOnDegreePadding: any) {
+        throw new Error("setZAlphaOnDegreePadding is deprecated");
+    }
+
+    free() {
+        if (this._freed) {
+            console.warn("RangeRing Plugin is already freed");
+            return;
+        }
+        this._freed = true;
+        this.circlePlugin.free();
+        this.arcPlugin.free();
+        this.paddingPlugin?.free();
+        this.rangeRingAngleText?.free();
+    }
+
+    updateText(centerIDs: string[] | null = null) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot update text");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot update text");
+            return;
+        }
+
+        const globe = this.globe!;
+        const textWritersMap = this.textWritersMap;
+
+        let keys = centerIDs ?? this._memory.keys();
+
+        for (const centerID of keys) {
+            const rangeRingData = this._memory.get(centerID)!;
+            if (!rangeRingData) continue;
+            if ( rangeRingData.hide === ENUM_HIDE.HIDE ) {
+                continue;
+            }
+            if (rangeRingData.textHide === ENUM_TEXT_HIDE.HIDE) {
+                continue;
+            }
+            for (const [key, writer] of textWritersMap) {
+                writer.insertText(rangeRingData);
+            }
+        }
+    }
+
+    deleteText(centerIDs: string[]) {
+        if (this._freed) {
+            console.warn("Plugin is freed, cannot delete text");
+            return;
+        }
+        if (this.globe === null || this.gl === null) {
+            console.warn("Globe or WebGL context is not initialized, cannot delete text");
+            return;
+        }
+
+        const globe = this.globe!;
+        const textWritersMap = this.textWritersMap;
+
+        for (const centerID of centerIDs) {
+            const rangeRingData = this._memory.get(centerID)!;
+            if (!rangeRingData) continue;
+            for (const [key, writer] of textWritersMap) {
+                writer.deleteText(rangeRingData);
+            }
+        }
+    }
+
+
+}