@pirireis/webglobeplugins 0.17.1 → 1.0.2

package/range-tools-on-terrain/range-ring/{plugin.js → plugin.ts}

@@ -1,377 +1,444 @@
-import { CircleOnTerrainPlugin } from "../../semiplugins/shape-on-terrain/circle-plugin";
-import { ArcOnTerrainPlugin } from "../../semiplugins/shape-on-terrain/arc-plugin";
-import { Padding1DegreePlugin } from '../../semiplugins/shape-on-terrain/padding-1-degree';
-import { padding1DegreeInputAdapter, rangeRingToArcInputAdapter, rangeRingToCircleInputAdapter, allCircleKeysAdapter, allArcKeysAdapter, createColorRatios, } from "./adapters";
-import RangeRingAngleText from "./rangeringangletext";
-import { opacityCheck } from "../../util/check/typecheck";
-export var ENUM_HIDE;
-(function (ENUM_HIDE) {
-    ENUM_HIDE[ENUM_HIDE["SHOW"] = 0] = "SHOW";
-    ENUM_HIDE[ENUM_HIDE["HIDE"] = 1] = "HIDE";
-    ENUM_HIDE[ENUM_HIDE["HIDE_1_DEGREE_PADDINGS"] = 2] = "HIDE_1_DEGREE_PADDINGS";
-})(ENUM_HIDE || (ENUM_HIDE = {}));
-export var ENUM_TEXT_HIDE;
-(function (ENUM_TEXT_HIDE) {
-    ENUM_TEXT_HIDE[ENUM_TEXT_HIDE["SHOW"] = 0] = "SHOW";
-    ENUM_TEXT_HIDE[ENUM_TEXT_HIDE["HIDE"] = 1] = "HIDE";
-})(ENUM_TEXT_HIDE || (ENUM_TEXT_HIDE = {}));
-// @ts-ignore
-export class RangeRingPlugin {
-    id;
-    globe = null;
-    gl = null;
-    circlePlugin;
-    arcPlugin;
-    paddingPlugin = null; // TODO: implement padding plugin
-    _memory = new Map();
-    _freed = false;
-    textWritersMap = new Map();
-    rangeRingAngleText = null;
-    _opacity = 1;
-    _numbersStyle = null;
-    draw1degrePadding = true;
-    _semiPluginOptions = {
-        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, { textWritersMap = new Map(), }) {
-        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) {
-        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) {
-        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) {
-        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) {
-        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, data.stepAngle, 0.5);
-                for (const { key } of circleColors) {
-                    this.paddingPlugin?.updateColorRatios(key, colorRatios, false);
-                }
-            }
-            this.updateText([item.centerID]);
-        }
-        this.globe.DrawRender();
-    }
-    updateCentersHide(items) {
-        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) {
-        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) {
-        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, gl) {
-        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 [, writer] of this.textWritersMap) {
-            writer.draw();
-        }
-    }
-    setZAlphaOnDegreePadding(zAlphaOnDegreePadding) {
-        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 = 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 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 [, writer] of textWritersMap) {
-                writer.insertText(rangeRingData);
-            }
-        }
-    }
-    deleteText(centerIDs) {
-        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 textWritersMap = this.textWritersMap;
-        for (const centerID of centerIDs) {
-            const rangeRingData = this._memory.get(centerID);
-            if (!rangeRingData)
-                continue;
-            for (const [, writer] of textWritersMap) {
-                writer.deleteText(rangeRingData);
-            }
-        }
-    }
-}
+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,
+} 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 [, 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 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 [, 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 textWritersMap = this.textWritersMap;
+
+        for (const centerID of centerIDs) {
+            const rangeRingData = this._memory.get(centerID)!;
+            if (!rangeRingData) continue;
+            for (const [, writer] of textWritersMap) {
+                writer.deleteText(rangeRingData);
+            }
+        }
+    }
+
+
+}