astro-viewer 3.0.0 → 3.2.0

package/lib-esm/model/footprints/Footprint.d.ts

@@ -3,6 +3,7 @@
  */
 import { SelectionObj } from '../../utils/GeomUtils.js';
 import { Point } from '../Point.js';
+import { CoordsType } from '../../utils/CoordsType.js';
 export interface FootprintDetail {
     key: string;
     value: string | number;
@@ -19,6 +20,7 @@ export declare class Footprint {
     private _totConvexPoints;
     private _npix256?;
     private _footprintsPointsOrder?;
+    private _coordsType;
     private _selectionObj;
     private _identifier?;
     private _center?;
@@ -27,7 +29,8 @@ export declare class Footprint {
      * @param in_details optional metadata
      * @param footprintsPointsOrder 1-> clockwise, -1 counter clockwise
      */
-    constructor(in_stcs?: string, in_details?: FootprintDetail[], footprintsPointsOrder?: 1 | -1);
+    constructor(in_stcs?: string, in_details?: FootprintDetail[], footprintsPointsOrder?: 1 | -1, coordsType?: CoordsType.ASTRO | CoordsType.GEOGRAPHIC);
+    static fromPolygons(polygons: Point[][], details?: FootprintDetail[], coordsType?: CoordsType.ASTRO | CoordsType.GEOGRAPHIC): Footprint;
     private computeSelectionObject;
     private computePoints;
     get valid(): boolean;

package/lib-esm/model/footprints/Footprint.js

@@ -1,3 +1,15 @@
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
+ */
 'use strict';
 /**
  * @author Fabrizio Giordano (Fab)
@@ -7,6 +19,7 @@
 import GeomUtils from '../../utils/GeomUtils.js';
 // import global from '../../Global.js';
 import STCSParser from '../../utils/STCSParser.js';
+import { CoordsType } from '../../utils/CoordsType.js';
 // export interface ParsedSTCS {
 //   polygons: Point[][]; // array of polygons (each polygon is array of Point objects)
 //   totpoints: number;
@@ -21,6 +34,7 @@ export class Footprint {
     _totConvexPoints = 0;
     _npix256;
     _footprintsPointsOrder;
+    _coordsType;
     _selectionObj;
     _identifier;
     _center; // could be typed if you have a Point type
@@ -29,7 +43,8 @@ export class Footprint {
      * @param in_details optional metadata
      * @param footprintsPointsOrder 1-> clockwise, -1 counter clockwise
      */
-    constructor(in_stcs, in_details = [], footprintsPointsOrder) {
+    constructor(in_stcs, in_details = [], footprintsPointsOrder, coordsType = CoordsType.ASTRO) {
+        this._coordsType = coordsType;
         if (in_stcs) {
             this._stcs = in_stcs.toUpperCase();
             this._details = in_details;
@@ -44,6 +59,17 @@ export class Footprint {
             this._details = [];
         }
     }
+    static fromPolygons(polygons, details = [], coordsType = CoordsType.ASTRO) {
+        const footprint = new Footprint(undefined, [], undefined, coordsType);
+        footprint._polygons = polygons;
+        footprint._details = details;
+        footprint._totPoints = polygons.reduce((total, polygon) => total + polygon.length, 0);
+        footprint._totConvexPoints = 0;
+        footprint._coordsType = coordsType;
+        footprint._selectionObj = footprint.computeSelectionObject();
+        footprint._valid = footprint._totPoints > 0;
+        return footprint;
+    }
     computeSelectionObject() {
         return GeomUtils.computeSelectionObject(this._polygons);
     }
@@ -66,7 +92,9 @@ export class Footprint {
     //   return Array.from(rangeSet.r);
     // }
     computePoints() {
-        const res = STCSParser.parseSTCS(this._stcs);
+        const res = STCSParser.parseSTCS(this._stcs, {
+            coordsType: this._coordsType,
+        });
         this._polygons = res.polygons;
         this._totPoints = res.totpoints;
     }

package/lib-esm/model/footprints/FootprintProps.js

@@ -1,6 +1,18 @@
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
+ */
+export {};
 // import {Metadata} from '../tap/TapMetadata.js';
 // import {TapMetadataList} from '../tap/TapMetadataList.js';
-export {};
 // export default class FootprintProps {
 //   // resolved columns
 //   pgSphereColumn?: Metadata;

package/lib-esm/model/footprints/FootprintSetGL.d.ts

@@ -1,5 +1,6 @@
 import { Footprint } from "./Footprint.js";
 import MouseHelper from "../../utils/MouseHelper.js";
+import { CoordsType } from "../../utils/CoordsType.js";
 import { MetadataManager } from "../MetadataManager.js";
 import { MetadataColumn } from "../MetadataColumn.js";
 import { VisibleTilesManager } from "../hips/VisibleTilesManager.js";
@@ -58,10 +59,11 @@ export declare class FootprintSetGL {
     totSelectedPoints: number;
     nSlectedPrimitiveFlags: number;
     _shapeColor: string;
-    private _bufferInitialised;
+    protected _coordsType: CoordsType.ASTRO | CoordsType.GEOGRAPHIC;
+    protected _bufferInitialised: boolean;
     private _webgl;
     _isVisible: boolean;
-    private _metadataManager;
+    protected _metadataManager: MetadataManager;
     _providerUrl: string;
     private _footprintShaderProgram;
     private _visibleTilesManager;

package/lib-esm/model/footprints/FootprintSetGL.js

@@ -1,3 +1,15 @@
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
+ */
 import { Footprint } from "./Footprint.js";
 import { colorHex2RGB } from "../../utils/Utils.js";
 import { FootprintShaderProgram } from "../../shader/FootprintShaderProgram.js";
@@ -46,6 +58,7 @@ export class FootprintSetGL {
     totSelectedPoints;
     nSlectedPrimitiveFlags = 0;
     _shapeColor = "#00fff2ff";
+    _coordsType = CoordsType.ASTRO;
     _bufferInitialised = false;
     _webgl;
     _isVisible = true;
@@ -127,7 +140,7 @@ export class FootprintSetGL {
         }
         for (let j = 0; j < in_data.length; j++) {
             if (in_data[j][geomDataIndex] !== null) {
-                const footprint = new Footprint(in_data[j][geomDataIndex], in_data[j]);
+                const footprint = new Footprint(in_data[j][geomDataIndex], in_data[j], undefined, this._coordsType);
                 if (footprint._valid) {
                     this.addFootprint(footprint);
                     this.totPoints += footprint.totPoints;
@@ -181,6 +194,11 @@ export class FootprintSetGL {
             }
         }
         this.indexes[this.indexes.length - 1] = MAX_UNSIGNED_INT;
+        this._webgl.bindBuffer(this._webgl.ARRAY_BUFFER, this.vertexCataloguePositionBuffer);
+        this._webgl.bufferData(this._webgl.ARRAY_BUFFER, this.vertexCataloguePosition, this._webgl.STATIC_DRAW);
+        this._webgl.bindBuffer(this._webgl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
+        this._webgl.bufferData(this._webgl.ELEMENT_ARRAY_BUFFER, this.indexes, this._webgl.STATIC_DRAW);
+        this._bufferInitialised = true;
         console.log("Buffer initialized");
     }
     checkSelection(mouseHelper) {
@@ -200,9 +218,8 @@ export class FootprintSetGL {
                 const details = [...footprint.details];
                 // const geomDataIndex = this.footprintsetProps.geomColumn?.index
                 const geomDataIndex = this._metadataManager.selectedOutlineColumn?.index ?? -1;
-                if (geomDataIndex < 0)
-                    continue;
-                details.splice(geomDataIndex, 1);
+                if (geomDataIndex >= 0)
+                    details.splice(geomDataIndex, 1);
                 this._hoveredFootprints.push(footprint);
                 this.totHoveredPoints += footprint.totPoints;
             }
@@ -574,11 +591,9 @@ export class FootprintSetGL {
             this._webgl.drawElements(this._webgl.LINE_LOOP, this.selectedVertexPosition.length / 3 + this.nSlectedPrimitiveFlags, this._webgl.UNSIGNED_INT, 0);
         }
         this._webgl.bindBuffer(this._webgl.ARRAY_BUFFER, this.vertexCataloguePositionBuffer);
-        this._webgl.bufferData(this._webgl.ARRAY_BUFFER, this.vertexCataloguePosition, this._webgl.STATIC_DRAW);
         this._webgl.vertexAttribPointer(this._footprintShaderProgram.locations.position, FootprintSetGL.ELEM_SIZE, this._webgl.FLOAT, false, FootprintSetGL.BYTES_X_ELEM * FootprintSetGL.ELEM_SIZE, 0);
         this._webgl.enableVertexAttribArray(this._footprintShaderProgram.locations.position);
         this._webgl.bindBuffer(this._webgl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
-        this._webgl.bufferData(this._webgl.ELEMENT_ARRAY_BUFFER, this.indexes, this._webgl.STATIC_DRAW);
         // const shapeColor = [...colorHex2RGB(this.footprintsetProps.shapeColor), 1.0] as [number, number, number, number]
         const shapeColor = [...colorHex2RGB(this._shapeColor), 1.0];
         this._webgl.uniform4f(this._footprintShaderProgram.locations.color, ...shapeColor);

package/lib-esm/model/grid/EquatorialGrid.d.ts

@@ -20,6 +20,7 @@ export declare class EquatorialGrid extends AbstractSkyEntity {
     private _thetaStepRad;
     private _phiArray;
     private _thetaArray;
+    private _bufferKey;
     private _dec4Labels;
     private _ra4Labels;
     private _healpixGrid;
@@ -34,7 +35,7 @@ export declare class EquatorialGrid extends AbstractSkyEntity {
     /** Build RA/Dec line vertex arrays based on FoV step helper */
     private initBuffers;
     /** Update buffers when FoV (in degrees) changes */
-    refresh(fovDeg: number): void;
+    refresh(fovDeg: number, coarse?: boolean): void;
     private vectorDistance;
     private enableShader;
     isVisible(): boolean;

package/lib-esm/model/grid/EquatorialGrid.js

@@ -1,3 +1,15 @@
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
+ */
 /* eslint-disable @typescript-eslint/no-non-null-assertion */
 import { vec4, mat4 } from 'gl-matrix';
 import { fovHelper } from '../hips/FoVHelper.js';
@@ -19,7 +31,7 @@ export class EquatorialGrid extends AbstractSkyEntity {
     _vertexShader;
     _fragmentShader;
     defaultColor = '#41d421';
-    gridText = new GridTextHelper();
+    gridText = new GridTextHelper('equatorial');
     _attribLocations = {
         position: 0,
         selected: 1,
@@ -36,6 +48,7 @@ export class EquatorialGrid extends AbstractSkyEntity {
     _thetaStepRad = 0;
     _phiArray = [];
     _thetaArray = [];
+    _bufferKey = '';
     // For placing text labels near current view center:
     //  - _dec4Labels: key = RA(deg), value = points along that RA ring (for Dec labels)
     //  - _ra4Labels : key = Dec(deg), value = points along that Dec ring (for RA labels)
@@ -96,9 +109,9 @@ export class EquatorialGrid extends AbstractSkyEntity {
         super.webgl.useProgram(this._shaderProgram);
     }
     /** Build RA/Dec line vertex arrays based on FoV step helper */
-    initBuffers(fovDeg) {
+    initBuffers(fovDeg, coarse = false) {
         const R = 1.0;
-        const steps = fovHelper.getRADegSteps(fovDeg);
+        const steps = fovHelper.getRADegSteps(fovDeg, coarse);
         const phiStep = steps.raStep; // RA step (deg)
         const thetaStep = steps.decStep; // Dec step (deg)
         this._phiStep = phiStep;
@@ -150,11 +163,14 @@ export class EquatorialGrid extends AbstractSkyEntity {
         }
     }
     /** Update buffers when FoV (in degrees) changes */
-    refresh(fovDeg) {
+    refresh(fovDeg, coarse = false) {
         // const fovDeg = healpixGridSingleton.getMinFoV()
-        if (this._fov !== fovDeg) {
+        const steps = fovHelper.getRADegSteps(fovDeg, coarse);
+        const bufferKey = `${coarse ? 'coarse' : 'settled'}:${steps.raStep}:${steps.decStep}`;
+        if (this._bufferKey !== bufferKey) {
             this._fov = fovDeg;
-            this.initBuffers(this._fov);
+            this._bufferKey = bufferKey;
+            this.initBuffers(this._fov, coarse);
         }
     }
     vectorDistance(p1, p2) {
@@ -214,7 +230,7 @@ export class EquatorialGrid extends AbstractSkyEntity {
             return;
         if (this._thetaArray.length === 0)
             return;
-        this.refresh(fovDeg);
+        this.refresh(fovDeg, !!input.cameraMoving);
         if (!this.showGrid) {
             // gridTextHelper.resetDivSets();
             this.gridText.resetDivSets();
@@ -260,9 +276,10 @@ export class EquatorialGrid extends AbstractSkyEntity {
                         // perspective divide
                         clipspace[0] /= clipspace[3];
                         clipspace[1] /= clipspace[3];
-                        // clip->pixel
-                        const pixelX = (clipspace[0] * 0.5 + 0.5) * super.webgl.canvas.width;
-                        const pixelY = (clipspace[1] * -0.5 + 0.5) * super.webgl.canvas.height;
+                        // clip -> CSS pixels
+                        const canvasRect = super.webgl.canvas.getBoundingClientRect();
+                        const pixelX = canvasRect.left + (clipspace[0] * 0.5 + 0.5) * canvasRect.width;
+                        const pixelY = canvasRect.top + (clipspace[1] * -0.5 + 0.5) * canvasRect.height;
                         this.gridText.addEqDivSet(decDeg.toFixed(2), pixelX, pixelY, 'dec');
                         // gridTextHelper.addEqDivSet(decDeg.toFixed(2), pixelX, pixelY, 'dec');
                     }
@@ -283,8 +300,9 @@ export class EquatorialGrid extends AbstractSkyEntity {
                         vec4.transformMat4(clipspace, phiPoint, mvpMatrix);
                         clipspace[0] /= clipspace[3];
                         clipspace[1] /= clipspace[3];
-                        const pixelX = (clipspace[0] * 0.5 + 0.5) * super.webgl.canvas.width;
-                        const pixelY = (clipspace[1] * -0.5 + 0.5) * super.webgl.canvas.height;
+                        const canvasRect = super.webgl.canvas.getBoundingClientRect();
+                        const pixelX = canvasRect.left + (clipspace[0] * 0.5 + 0.5) * canvasRect.width;
+                        const pixelY = canvasRect.top + (clipspace[1] * -0.5 + 0.5) * canvasRect.height;
                         // gridTextHelper.addEqDivSet(raDeg.toFixed(2), pixelX, pixelY, 'ra');
                         this.gridText.addEqDivSet(raDeg.toFixed(2), pixelX, pixelY, 'ra');
                     }

package/lib-esm/model/grid/GridTextHelper.d.ts

@@ -1,25 +1,16 @@
-/**
- * @author Fabrizio Giordano (Fab)
- * @param in_radius - number
- * @param in_gl - GL context
- * @param in_position - array of double e.g. [0.0, 0.0, 0.0]
- */
+type GridLabelLayer = 'healpix' | 'equatorial' | 'lonlat';
 declare class GridTextHelper {
-    private _divEqContainerElement;
-    private _divHPXContainerElement;
-    private _divSets;
-    private _divSetNdx;
-    constructor();
+    private static layers;
+    private layer;
+    constructor(layer?: GridLabelLayer);
     initHtml(): void;
-    resetDivSets(): void;
-    /**
-     * Add / reuse a floating label for HPX coordinates
-     */
+    resetDivSets(layer?: GridLabelLayer): void;
     addHPXDivSet(msg: string, x: number, y: number): void;
-    /**
-     * Add / reuse a floating label for Equatorial coords
-     * @param type 'ra' or 'dec'
-     */
     addEqDivSet(msg: string, x: number, y: number, type: 'ra' | 'dec'): void;
+    addLonLatDivSet(msg: string, x: number, y: number, type: 'lon' | 'lat'): void;
+    private addLabel;
+    private classNameForKind;
+    private static getLayerState;
+    private static resolveContainer;
 }
 export default GridTextHelper;

package/lib-esm/model/grid/GridTextHelper.js

@@ -1,91 +1,94 @@
-/**
- * @author Fabrizio Giordano (Fab)
- * @param in_radius - number
- * @param in_gl - GL context
- * @param in_position - array of double e.g. [0.0, 0.0, 0.0]
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
  */
 class GridTextHelper {
-    _divEqContainerElement;
-    _divHPXContainerElement;
-    _divSets;
-    _divSetNdx;
-    constructor() {
-        this._divEqContainerElement = document.querySelector('#gridcoords');
-        this._divHPXContainerElement = document.querySelector('#gridhpx');
-        this._divSetNdx = 0;
-        this._divSets = [];
+    static layers = new Map();
+    layer;
+    constructor(layer = 'equatorial') {
+        this.layer = layer;
+        GridTextHelper.getLayerState(layer);
     }
     initHtml() {
-        // Kept for API parity; nothing required here with current logic.
+        GridTextHelper.getLayerState(this.layer);
     }
-    resetDivSets() {
-        // Hide remaining divs and reset index
-        for (; this._divSetNdx < this._divSets.length; ++this._divSetNdx) {
-            this._divSets[this._divSetNdx].style.display = 'none';
+    resetDivSets(layer = this.layer) {
+        const state = GridTextHelper.getLayerState(layer);
+        for (; state.divSetNdx < state.divSets.length; ++state.divSetNdx) {
+            state.divSets[state.divSetNdx].style.display = 'none';
         }
-        this._divSetNdx = 0;
+        state.divSetNdx = 0;
     }
-    /**
-     * Add / reuse a floating label for HPX coordinates
-     */
     addHPXDivSet(msg, x, y) {
-        let divSet = this._divSets[this._divSetNdx++];
-        // Create on demand
+        this.addLabel('healpix', msg, x + 25, y, 'hpx');
+    }
+    addEqDivSet(msg, x, y, type) {
+        this.addLabel('equatorial', msg, type === 'ra' ? x + 25 : x, type === 'ra' ? y : y + 25, type);
+    }
+    addLonLatDivSet(msg, x, y, type) {
+        this.addLabel('lonlat', msg, type === 'lon' ? x + 25 : x, type === 'lon' ? y : y + 25, type);
+    }
+    addLabel(layer, msg, x, y, kind) {
+        const state = GridTextHelper.getLayerState(layer);
+        if (!state.container)
+            return;
+        let divSet = state.divSets[state.divSetNdx++];
         if (!divSet) {
             const div = document.createElement('div');
             const textNode = document.createTextNode('');
-            div.className = 'floating-div-ra'; // style like RA tags
             div.appendChild(textNode);
-            if (!this._divHPXContainerElement) {
-                this._divHPXContainerElement = document.querySelector('#gridhpx');
-            }
-            if (!this._divHPXContainerElement) {
-                // If container is still missing, abort gracefully
-                return;
-            }
-            this._divHPXContainerElement.appendChild(div);
+            state.container.appendChild(div);
             divSet = { div, textNode, style: div.style };
-            this._divSets.push(divSet);
+            state.divSets.push(divSet);
         }
-        // Show & position
+        divSet.div.className = this.classNameForKind(kind);
         divSet.style.display = 'block';
-        divSet.style.left = `${Math.floor(x + 25)}px`;
+        divSet.style.left = `${Math.floor(x)}px`;
         divSet.style.top = `${Math.floor(y)}px`;
         divSet.textNode.nodeValue = msg;
     }
-    /**
-     * Add / reuse a floating label for Equatorial coords
-     * @param type 'ra' or 'dec'
-     */
-    addEqDivSet(msg, x, y, type) {
-        let divSet = this._divSets[this._divSetNdx++];
-        if (!divSet) {
-            const div = document.createElement('div');
-            const textNode = document.createTextNode('');
-            div.className = type === 'ra' ? 'floating-div-ra' : 'floating-div-dec';
-            div.appendChild(textNode);
-            if (!this._divEqContainerElement) {
-                this._divEqContainerElement = document.querySelector('#gridcoords');
-            }
-            if (!this._divEqContainerElement) {
-                // If container is still missing, abort gracefully
-                return;
-            }
-            this._divEqContainerElement.appendChild(div);
-            divSet = { div, textNode, style: div.style };
-            this._divSets.push(divSet);
+    classNameForKind(kind) {
+        switch (kind) {
+            case 'dec':
+                return 'floating-div-dec';
+            case 'lat':
+                return 'floating-div-lat';
+            case 'lon':
+                return 'floating-div-lon';
+            case 'hpx':
+            case 'ra':
+            default:
+                return 'floating-div-ra';
         }
-        divSet.style.display = 'block';
-        if (type === 'ra') {
-            divSet.style.left = `${Math.floor(x + 25)}px`;
-            divSet.style.top = `${Math.floor(y)}px`;
+    }
+    static getLayerState(layer) {
+        const current = GridTextHelper.layers.get(layer);
+        if (current) {
+            if (!current.container)
+                current.container = GridTextHelper.resolveContainer(layer);
+            return current;
         }
-        else {
-            divSet.style.left = `${Math.floor(x)}px`;
-            divSet.style.top = `${Math.floor(y + 25)}px`;
+        const state = {
+            container: GridTextHelper.resolveContainer(layer),
+            divSets: [],
+            divSetNdx: 0,
+        };
+        GridTextHelper.layers.set(layer, state);
+        return state;
+    }
+    static resolveContainer(layer) {
+        if (layer === 'healpix') {
+            return document.querySelector('#gridhpx');
         }
-        divSet.textNode.nodeValue = msg;
+        return document.querySelector('#gridcoords');
     }
 }
-// export const gridTextHelper = new GridTextHelper();
 export default GridTextHelper;

package/lib-esm/model/grid/HealpixGrid.d.ts

@@ -1,6 +1,6 @@
 import { AbstractSkyEntity, SkyEntityDrawInput } from '../AbstractSkyEntity.js';
 import { ReadonlyMat4 } from 'gl-matrix';
-import { FoV } from '../FoV.js';
+import { SphereFoV } from '../SphereFoV.js';
 import { VisibleTilesManager } from '../hips/VisibleTilesManager.js';
 import Camera from '../../Camera.js';
 export declare class HealpixGrid extends AbstractSkyEntity {
@@ -28,13 +28,13 @@ export declare class HealpixGrid extends AbstractSkyEntity {
     private _visibleTilesManager;
     constructor(webgl: WebGL2RenderingContext);
     init(): void;
-    get fovObj(): FoV;
+    get fovObj(): SphereFoV;
     get RADIUS(): number;
     get INITIAL_POSITION(): [number, number, number];
     get INITIAL_PhiRad(): number;
     get INITIAL_ThetaRad(): number;
-    refreshFoV(camera: Camera, pMatrix: ReadonlyMat4): FoV;
-    getFoV(): FoV;
+    refreshFoV(camera: Camera, pMatrix: ReadonlyMat4): SphereFoV;
+    getFoV(): SphereFoV;
     getMinFoV(): number;
     private initShaders;
     initBuffers(pixels: number[], order: number): void;

package/lib-esm/model/grid/HealpixGrid.js

@@ -1,10 +1,22 @@
+/*
+ * AstroViewer
+ * Copyright (C) Fabrizio Giordano
+ * SPDX-License-Identifier: LicenseRef-AstroViewer-Dual-License
+ *
+ * This file is part of AstroViewer.
+ * AstroViewer is distributed under a dual-license model.
+ * Commercial use requires a separate commercial license.
+ * Non-commercial use is governed by LICENSE-NONCOMMERCIAL.md.
+ *
+ * See LICENSE.md, LICENSE-COMMERCIAL.md, and LICENSE-NONCOMMERCIAL.md for details.
+ */
 'use strict';
 import { AbstractSkyEntity } from '../AbstractSkyEntity.js';
 import global from '../../Global.js';
 import { mat4, vec4 } from 'gl-matrix';
 import { fovHelper } from '../hips/FoVHelper.js';
 import { FoVUtils } from '../../utils/FoVUtils.js';
-import { FoV } from '../FoV.js';
+import { SphereFoV } from '../SphereFoV.js';
 import { CoordsType } from '../../utils/CoordsType.js';
 import { Point } from '../Point.js';
 import GridShaderManager from '../../shader/GridShaderManager.js';
@@ -22,7 +34,7 @@ export class HealpixGrid extends AbstractSkyEntity {
     fragmentShader;
     vertexShader;
     defaultColor = '#ec0acaff';
-    gridText = new GridTextHelper();
+    gridText = new GridTextHelper('healpix');
     // private _hipsShaderProgram: HiPSShaderProgram
     _attribLocations = {
         position: 0,
@@ -59,7 +71,7 @@ export class HealpixGrid extends AbstractSkyEntity {
         this._vertexCataloguePositionBuffer = super.webgl.createBuffer();
         this._indexBuffer = super.webgl.createBuffer();
         this._vertexCataloguePosition = new Float32Array(0);
-        this._fovObj = new FoV(super.webgl);
+        this._fovObj = new SphereFoV(super.webgl);
     }
     get fovObj() {
         return this._fovObj;
@@ -199,7 +211,7 @@ export class HealpixGrid extends AbstractSkyEntity {
         // (global as any).hipsFoV = fov;
         // global.order = fovHelper.getHiPSNorder(fov);
         // this._visibleorder = global.order;
-        this._visibleorder = fovHelper.getHiPSNorder(fov);
+        this._visibleorder = fovHelper.getHiPSNorder(fov, this._visibleorder);
     }
     enableShader(in_mMatrix, pMatrix, vMatrix) {
         const gl = super.webgl;
@@ -243,7 +255,10 @@ export class HealpixGrid extends AbstractSkyEntity {
         const pMatrix = input.pMatrix;
         if (!pMatrix)
             return;
-        this.refresh(camera, pMatrix);
+        // this.refresh(camera, pMatrix);
+        const rawFov = input.fovDeg ?? this.getMinFoV();
+        const fov = Number.isFinite(rawFov) && rawFov > 0 ? rawFov : 1e-6;
+        this._visibleorder = fovHelper.getHiPSNorder(fov, this._visibleorder);
         if (!this.showGrid) {
             // gridTextHelper.resetDivSets();
             this.gridText.resetDivSets();
@@ -288,9 +303,10 @@ export class HealpixGrid extends AbstractSkyEntity {
                 // NDC divide
                 clipspace[0] /= clipspace[3];
                 clipspace[1] /= clipspace[3];
-                // clip → pixels
-                const pixelX = (clipspace[0] * 0.5 + 0.5) * gl.canvas.width;
-                const pixelY = (clipspace[1] * -0.5 + 0.5) * gl.canvas.height;
+                // clip -> CSS pixels
+                const canvasRect = gl.canvas.getBoundingClientRect();
+                const pixelX = canvasRect.left + (clipspace[0] * 0.5 + 0.5) * canvasRect.width;
+                const pixelY = canvasRect.top + (clipspace[1] * -0.5 + 0.5) * canvasRect.height;
                 this.gridText.addHPXDivSet(this._visibleorder + '/' + pixels[p], pixelX, pixelY);
                 // gridTextHelper.addHPXDivSet(this._visibleorder + '/' + pixels[p], pixelX, pixelY);
             }

package/lib-esm/model/grid/LonLatGrid.d.ts

@@ -0,0 +1,43 @@
+import { AbstractSkyEntity, SkyEntityDrawInput } from '../AbstractSkyEntity.js';
+import { SphereFoV } from '../SphereFoV.js';
+export declare class LatLonGrid extends AbstractSkyEntity {
+    static ELEM_SIZE: number;
+    static BYTES_X_ELEM: number;
+    private _shaderProgram;
+    private _vertexShader;
+    private _fragmentShader;
+    private _attribLocations;
+    private _lonVertexPositionBuffer;
+    private _latVertexPositionBuffer;
+    private _lonStep;
+    private _latStep;
+    private _segmentStep;
+    private _fovObj;
+    private _fovDeg;
+    private _showGrid;
+    private _lonArray;
+    private _latArray;
+    private _bufferKey;
+    private defaultColor;
+    private gridText;
+    constructor(radius: number, position: [number, number, number], xrad: number, yrad: number, name: string, webgl: WebGL2RenderingContext);
+    init(): void;
+    private initShaders;
+    private initBuffers;
+    private buildLonRange;
+    private buildLatRange;
+    private lonLatToCartesian;
+    private refresh;
+    refreshFoV(input: SkyEntityDrawInput): number;
+    getMinFoVDeg(): number;
+    getFoV(): SphereFoV;
+    isVisible(): boolean;
+    toggleShowGrid(): boolean;
+    setShowGrid(showGrid: boolean): void;
+    private enableShader;
+    draw(input: SkyEntityDrawInput): void;
+    private drawLabels;
+    private projectPointToScreen;
+    private roundToStep;
+    private normalizeLon;
+}