@pirireis/webglobeplugins 0.8.11 → 0.8.13

package/bearing-line/plugin.js

@@ -7,7 +7,7 @@ import { mapGetOrThrow } from "../util/check/get";
 import { populateFloat32Array } from "../util/jshelpers/data-filler";
 import { ContextTextWriter3 } from '../write-text/context-text3'
 import { constraintFloat, isBoolean } from '../util/check/typecheck';
-import { normalize } from '../util/geometry';
+import { sphereCoord } from '../util/geometry';
 import { createBufferAndReadInfo } from '../util/gl-util/buffer/integrate-buffer';
 
 export const RINGPARTIAL_DRAW_MODE = Object.freeze({
@@ -16,6 +16,23 @@ export const RINGPARTIAL_DRAW_MODE = Object.freeze({
 });
 
 
+/**
+     * @typedef {{key, long, lat, endLong, endLat, bearingAngle, radius,  rgba:[4numbers], rgbaMode, bigRadius, dashRatio, dashOpacity, circleDashAngle}} BearingLineItem
+     * @property {string} key   
+     * @property {number} long
+     * @property {number} lat
+     * @property {number} endLong
+     * @property {number} endLat 
+     * @property {number} bearingAngle 0-360
+     * @property {number} radius angle ring radius
+     * @property {number} altitude in meters effects all parts of the item
+     * @property {Array<numbers>} rgba [r,g,b,a] 0-1
+     * @property {number} rgbaMode 0 constant, 1 fading, 2 hides angle ring
+     * @property {number} bigRadius undefined means it will be calculated from long, lat, endLong, endLat
+     * @property {number} dashRatio 0-1
+     * @property {number} dashOpacity 0-1
+     * @property {number} circleDashAngle 0-360
+ */
 
 const textWriterGetOrThrow = mapGetOrThrow("BearingLine textContextInjection id does not exist in map")
 
@@ -110,21 +127,8 @@ export default class BearingLinePlugin {
 
 
     /**
-     * @typedef {{key, long, lat, endLong, endLat, bearingAngle, radius,  rgba:[4numbers], rgbaMode, bigRadius, dashRatio, dashOpacity, circleDashAngle}} item
-     * @property {string} key   
-     * @property {number} long
-     * @property {number} lat
-     * @property {number} endLong
-     * @property {number} endLat 
-     * @property {number} bearingAngle 0-360
-     * @property {number} radius angle ring radius
-     * @property {Array<4numbers>} rgba [r,g,b,a]
-     * @property {number} rgbaMode 0 constant, 1 fading, 2 hides angle ring
-     * @property {number} bigRadius undefined means it will be calculated from long, lat, endLong, endLat
-     * @property {number} dashRatio 0-1
-     * @property {number} dashOpacity 0-1
-     * @property {number} circleDashAngle 0-360
-     * @param {Array<item>} items 
+
+     * @param {Array<BearingLineItem>} items 
      * @param {Array<string>} textWriterIDs | textWritersMap keys to be used for writing text.
      */
     insertBulk(items, { textWriterIDs = [] } = {}) {
@@ -198,7 +202,7 @@ export default class BearingLinePlugin {
 
     /**
      * 
-     * @param {*} items some colums EXCEPT positional ones
+     * @param {Array<BearingLineItem>} items some colums EXCEPT positional ones
      * @param {string} propertyIDs 
      * @param {string} textWriterIDs 
      * Do NOT send empty data if property ID of this data is entered or NaN is loaded to the buffer, resulting in an unwanted behaviour.
@@ -261,7 +265,8 @@ export default class BearingLinePlugin {
         const long = radian(item.long)
         const endLat = radian(item.endLat)
         const endLong = radian(item.endLong)
-        const bigRadius = item.bigRadius !== undefined ? item.bigRadius : globe.Math.GetDist3D(item.long, item.lat, item.endLong, item.endLat);
+        const altitude = (item.altitude ?? 0) / 1000;
+        const bigRadius = item.bigRadius ?? globe.Math.GetDist3D(item.long, item.lat, item.endLong, item.endLat);
         const radius = item.radius !== undefined ? item.radius : bigRadius * 0.2;
         const { long: bearingLong, lat: bearingLat } = globe.Math.FindPointByPolar(item.long, item.lat, bigRadius, item.bearingAngle)
         const startAngle2d = calculateStartAngle(long, lat, endLong, endLat);
@@ -285,6 +290,7 @@ export default class BearingLinePlugin {
             long: item.long,
             endLat: item.endLat,
             endLong: item.endLong,
+            altitude,
             bearingAngle,
             radius,
             bigRadius,
@@ -322,9 +328,7 @@ export default class BearingLinePlugin {
         this.circle3DProgram = Circle3DCache.get(globe);
         const circleFlatEdgeCount = this.circleFlatEdgeCount
         {
-            const sphereCoord = (long, lat) => {
-                return normalize(globe.api_GetCartesian3DPoint(long, lat, 0, 0), 6378.137);
-            }
+
             // createBuffers
             const bufferType = "DYNAMIC_DRAW";
             const initialCapacity = this.bufferOrchestrator.capacity;
@@ -340,7 +344,7 @@ export default class BearingLinePlugin {
                     }],
                     ["centerCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => sphereCoord(item.long, item.lat, 0, 0),
+                        'adaptor': (item) => sphereCoord(item.long, item.lat, globe, item.altitude),
                     }],
                     ["targetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
@@ -348,8 +352,7 @@ export default class BearingLinePlugin {
                     }],
                     ["targetCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(
-                            globe.api_GetCartesian3DPoint(item.endLong, item.endLat, 0, 0))
+                        'adaptor': (item) => sphereCoord(item.endLong, item.endLat, globe, item.altitude)
                     }],
                     ["bearingTargetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
@@ -357,7 +360,7 @@ export default class BearingLinePlugin {
                     }],
                     ["bearingTargetCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.bearingLong, item.bearingLat, 0, 0))
+                        'adaptor': (item) => sphereCoord(item.bearingLong, item.bearingLat, globe, item.altitude)
                     }],
                     ["startAngle2d", {
                         'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),

package/circle-line-chain/plugin.js

@@ -37,6 +37,7 @@ import { sphereCoord } from '../util/geometry/index';
  * @property {string} key
  * @property {number} long
  * @property {number} lat  
+ * @property {number} altitude
  * @property {StyleProperties} circleProperties
  * 
  * @typedef {Object} Node
@@ -49,7 +50,9 @@ import { sphereCoord } from '../util/geometry/index';
  * @property { number} dashOpacity 0-1
  * @property { number} dashRatio 0-1
  * @property { number } circleDashAngle 0-360
- * @property {Array<Node>} nodes
+ * @property { number} altitude
+ * 
+ * //property {Array<Node>} nodes
  */
 
 
@@ -276,7 +279,7 @@ export class CircleLineChainPlugin {
                     }],
                     ["centerCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => sphereCoord(item.long, item.lat, globe),
+                        'adaptor': (item) => sphereCoord(item.long, item.lat, globe, item.altitude),
                     }],
                     ["targetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
@@ -284,7 +287,7 @@ export class CircleLineChainPlugin {
                     }],
                     ["targetCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => sphereCoord(item.targetLong, item.targetLat, globe),
+                        'adaptor': (item) => sphereCoord(item.targetLong, item.targetLat, globe, item.altitude),
                     }],
                     ["rgba", {
                         'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),
@@ -382,12 +385,13 @@ export class CircleLineChainPlugin {
             if (i === array.length - 1) return null;
 
             const centerCoords2dflat = centerCoords2dflatDataCreator(globe, v.long, v.lat, array[i + 1].long, array[i + 1].lat, { edgeCount: this._circleFlatEdgeCount });
-
+            const altitude = (v.altitude ?? chainProperties.altitude ?? 0) / 1000;
             return {
                 chainProperties: chainProperties,
                 // bigRadius: radiusM(v, i, array),
                 targetLong: array[i + 1].long,
                 targetLat: array[i + 1].lat,
+                altitude: altitude,
                 long: v.long,
                 lat: v.lat,
                 lineProperties: v.lineProperties,

package/package.json

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

package/rangerings/plugin.js

@@ -1,22 +1,3 @@
-/**
- * Re implementation of rangering plugin.
- */
-
-
-/**
- * Circlelari cizen programlar
- * Circlelari cizen bufferlarin muhasevesi. 
- * 
- * 1 derecelikler çok masraflı.
- * bir dereceklikler için ayrı buffer orchastrator oluşturulmalı.
- * 
- * 
- * A Range Ring {
- *  rings: [ ring, ]
- * }
- */
-
-
 /**
  * @typedef RangeRingData
  * @property {number} centerX
@@ -61,11 +42,36 @@ import { normalize } from "../util/geometry"
 const CIRCLE_FLAT_EDGE_COUNT = 362; // 360 + 2 for closing the circle and a cutting point
 
 
-const coordOnSphere = (long, lat, globe) => {
+const coordOnSphere = (long, lat, globe, altitude = 0) => {
     const coord = globe.api_GetCartesian3DPoint(long, lat, 0, 0);
-    return normalize(coord, 6378.137);
+    return normalize(coord, 6378.137 + altitude);
 }
 
+
+/**
+ * 
+ * 
+ * @typedef {string} centerID
+ * 
+ * @typedef {Object} RangeRing
+ * @property {string} ringID
+ * @property {number} radius in range meters
+ * @property {number} padding badding range in meter
+ * 
+ * 
+ *  Array < centerID: string, long: number, lat: number, stepAngle: number, rgba: [4 numbers], rings: rings, hide, textHide
+ * @typedef {Object} RangeRingsItem
+ * @property {centerID} centerID
+ * @property {number} long
+ * @property {number} lat
+ * @property {number} stepAngle
+ * @property {number} altitude
+ * @property {number} hide
+ * @property {number} textHide
+ * @property {number} rgba
+ * @property {Array<RangeRing>} rings
+ */
+
 class RangeRings {
     constructor(id,
         {
@@ -121,8 +127,7 @@ class RangeRings {
 
     /**
      * @method insertBulk
-     * @typedef { Array < { ringID, radius, padding } >} rings
-     * @param { Array < centerID: string, long: number, lat: number, stepAngle: number, rgba: [4 numbers], rings: rings, hide, textHide } items
+     * @param { Array < RangeRingsItem> } items
     */
     insertBulk(items, { textWriterIDs = [] } = {}) {
         // Algorithm
@@ -460,10 +465,10 @@ class RangeRings {
         const { globe } = this;
         const centerItem = this._ringAccount.getCenter(centerID);
         if (centerItem === undefined) throw new Error("Center not found");
-        const { long, lat, stepAngle, rgba, rings, hide = 0, textHide = 0 } = centerItem;
+        const { long, lat, stepAngle, rgba, rings, hide = 0, textHide = 0, altitude: centerAltitude = 0 } = centerItem;
         const result = [];
         const color = hide === 1 ? new Float32Array([0, 0, 0, 0]) : new Float32Array(rgba)
-        for (const { ringID, radius, padding } of rings) {
+        for (const { ringID, radius, padding, altitude = centerAltitude } of rings) {
             let azimuthAngle = 0;
             while (azimuthAngle < 360) {
                 const circlePoint = globe.Math.FindPointByPolar(long, lat, radius, azimuthAngle); // long lat
@@ -472,8 +477,8 @@ class RangeRings {
                     key: ringBigPaddingKeyMethod(centerID, ringID, azimuthAngle),
                     circlePoint2d: new Float32Array(globe.api_GetMercator2DPoint(circlePoint.long, circlePoint.lat)),
                     paddingPoint2d: new Float32Array(globe.api_GetMercator2DPoint(paddingPoint.long, paddingPoint.lat)),
-                    circlePoint3d: coordOnSphere(circlePoint.long, circlePoint.lat, globe),
-                    paddingPoint3d: coordOnSphere(paddingPoint.long, paddingPoint.lat, globe),
+                    circlePoint3d: coordOnSphere(circlePoint.long, circlePoint.lat, globe, altitude / 1000),
+                    paddingPoint3d: coordOnSphere(paddingPoint.long, paddingPoint.lat, globe, altitude / 1000),
                     rgba: color,
                     hide,
                     textHide
@@ -491,17 +496,18 @@ class RangeRings {
         const centerItem = this._ringAccount.getCenter(centerID);
         if (centerItem === undefined) throw new Error("Center not found");
 
-        const { long, lat, rgba, rings, hide = 0, textHide = 0 } = centerItem;
-        const centerCoords3d = coordOnSphere(long, lat, globe);
+        const { long, lat, rgba, rings, hide = 0, textHide = 0, altitude: centralAltitude = 0 } = centerItem;
+        const centerCoords3d = coordOnSphere(long, lat, globe, centralAltitude / 1000);
 
         const result = [];
 
-        for (const { ringID, radius, padding, __identity__ } of rings) {
+        for (const { ringID, radius, padding, __identity__, altitude = centralAltitude } of rings) {
             const key = __identity__;
+
             const centerCoords2dflat = centerCoords2dflatDataCreatorWithRadius(globe, long, lat, radius, { edgeCount: CIRCLE_FLAT_EDGE_COUNT });
             const radiusPadding = hide === ENUM_HIDE.HIDE_1_DEGREE_PADDINGS ? radius : radius - padding / 3;
             const targetPoint = globe.Math.FindPointByPolar(long, lat, radius, 0); // long lat
-            const targetCoords3d = coordOnSphere(targetPoint.long, targetPoint.lat, globe);
+            const targetCoords3d = coordOnSphere(targetPoint.long, targetPoint.lat, globe, altitude / 1000);
             const centerCoords2dflatForPadding = centerCoords2dflatDataCreatorWithRadius(globe, long, lat, radiusPadding, { edgeCount: CIRCLE_FLAT_EDGE_COUNT });
             result.push({
                 key,

package/util/geometry/index.js

@@ -45,6 +45,6 @@ export function normalize(array, newLength = 1) {
 }
 
 
-export function sphereCoord(long, lat, globe) {
-    return normalize(globe.api_GetCartesian3DPoint(long, lat, 0, 0), 6378.137);
+export function sphereCoord(long, lat, globe, height = 0) {
+    return normalize(globe.api_GetCartesian3DPoint(long, lat, 0, 0), 6378.137 + height);
 }

package/write-text/context-text3.js

@@ -6,6 +6,8 @@ import { isTextFont, opacityCheck } from "../util/check/typecheck";
  * 1) update all if initials change (propably need a context and a callback to iterate over zPayload)
  * 2) expose a mechanic to update text on zoom change
  * 3) extend the mechanic on 2 to other events
+ * 
+ * TODO: key check and raise error if doesnt exist
  */
 export class ContextTextWriter3 {
     constructor(globe, {