@pirireis/webglobeplugins 0.8.9 → 0.8.11

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 { createBufferAndReadInfo } from '../util/gl-util/buffer/integrate-buffer';
 
 export const RINGPARTIAL_DRAW_MODE = Object.freeze({
@@ -322,6 +322,9 @@ 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;
@@ -337,7 +340,7 @@ export default class BearingLinePlugin {
                     }],
                     ["centerCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
+                        'adaptor': (item) => sphereCoord(item.long, item.lat, 0, 0),
                     }],
                     ["targetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
@@ -345,7 +348,8 @@ 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) => new Float32Array(
+                            globe.api_GetCartesian3DPoint(item.endLong, item.endLat, 0, 0))
                     }],
                     ["bearingTargetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),

package/circle-line-chain/plugin.js

@@ -9,7 +9,7 @@ import { populateFloat32Array } from "../util/jshelpers/data-filler";
 import { ContextTextWriter3 } from '../write-text/context-text3';
 import { isBoolean, constraintFloat, opacityCheck } from '../util/check/typecheck';
 import { createBufferAndReadInfo } from '../util/gl-util/buffer/integrate-buffer';
-
+import { sphereCoord } from '../util/geometry/index';
 /**
  * Insert info to chain list map (nodes and properties)
  * 
@@ -264,6 +264,7 @@ export class CircleLineChainPlugin {
 
         const _circleFlatEdgeCount = this._circleFlatEdgeCount;
         {
+
             // createBuffers
             const bufferType = "DYNAMIC_DRAW";
             const initialCapacity = this.bufferOrchestrator.capacity;
@@ -275,7 +276,7 @@ export class CircleLineChainPlugin {
                     }],
                     ["centerCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.long, item.lat, 0, 0)),
+                        'adaptor': (item) => sphereCoord(item.long, item.lat, globe),
                     }],
                     ["targetCoords2d", {
                         'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
@@ -283,7 +284,7 @@ export class CircleLineChainPlugin {
                     }],
                     ["targetCoords3d", {
                         'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
-                        'adaptor': (item) => new Float32Array(globe.api_GetCartesian3DPoint(item.targetLong, item.targetLat, 0, 0)),
+                        'adaptor': (item) => sphereCoord(item.targetLong, item.targetLat, globe),
                     }],
                     ["rgba", {
                         'bufferManager': new BufferManager(gl, 4, { bufferType, initialCapacity }),

package/package.json

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

package/point-heat-map/point-to-heat-map-flow.js

@@ -67,7 +67,7 @@ class PointHeatmapFlow {
 
     /**
      * @param {Float32Array} data 
-     * @format [x, y, z, height] x,y,z is normalized 3d cartesian coordinates. Height in kilometers. Set 6371.137 for ground level.
+     * @format [x, y, z, height] x,y,z is normalized 3d cartesian coordinates. Height in kilometers. Set 6378.137 for ground level.
      */
     setData(data) {
         const { gl, buffer } = this;

package/programs/line-on-globe/circle-accurate-3d.js

@@ -128,7 +128,6 @@ class Logic {
         attributeLoader(gl, dashRatioObj, 3, 1, { divisor });
         attributeLoader(gl, dashOpacityObj, 4, 1, { divisor });
 
-
         gl.bindVertexArray(null);
         gl.bindVertexArray(null);
         return vao;

package/programs/line-on-globe/degree-padding-around-circle-3d.js

@@ -1,7 +1,8 @@
 import { createProgram } from "../../util/webglobjectbuilders";
 import { CameraUniformBlockString, CameraUniformBlockTotemCache } from "../totems/camerauniformblock";
 import { noRegisterGlobeProgramCache } from "../programcache";
-import { vaoAttributeLoader } from "../../util/account/util";
+// import { vaoAttributeLoader } from "../../util/account/util";
+import { attributeLoader } from "../../util/gl-util/buffer/integrate-buffer";
 import { Z_ALPHA_MODE } from "./util";
 import {
     cartesian3DToGLPosition,
@@ -127,24 +128,16 @@ class Logic {
         const vao = gl.createVertexArray();
         const divisor = 1;
         gl.bindVertexArray(vao);
-        {  // make this a function end import from account module. 
-            const { buffer, stride = 0, offset = 0 } = center3dObj;
-            vaoAttributeLoader(gl, buffer, 0, 3, stride, offset, divisor);
-        }
-        {
-            const { buffer, stride = 0, offset = 0 } = bigRadiusObj;
-            vaoAttributeLoader(gl, buffer, 1, 1, stride, offset, divisor);
-        }
-        {
-            const { buffer, stride = 0, offset = 0 } = smallRadiusObj;
-            vaoAttributeLoader(gl, buffer, 2, 1, stride, offset, divisor);
-        }
-        {
-            const { buffer, stride = 0, offset = 0 } = colorObj;
-            vaoAttributeLoader(gl, buffer, 3, 4, stride, offset, divisor);
-        }
 
-        gl.bindVertexArray(null);
+
+        attributeLoader(gl, center3dObj, 0, 3, { divisor });
+
+        attributeLoader(gl, bigRadiusObj, 1, 1, { divisor });
+
+        attributeLoader(gl, smallRadiusObj, 2, 1, { divisor });
+
+        attributeLoader(gl, colorObj, 3, 4, { divisor });
+
         gl.bindVertexArray(null);
         return vao;
     }

package/programs/line-on-globe/naive-accurate-flexible.js

@@ -193,8 +193,8 @@ class Logic {
 
 
     createVAO(
-        startPotisionBufferObj, startPotision3DBufferObj,
-        endPositionBufferObj, endPosition3DBufferObj,
+        startPotision2DBufferObj, startPotision3DBufferObj,
+        endPosition2DBufferObj, endPosition3DBufferObj,
         dashRatioBufferObj,
         dashOpacityBufferObj,
         colorBufferObj) {
@@ -205,9 +205,9 @@ class Logic {
 
         const divisor = 1;
 
-        attributeLoader(gl, startPotisionBufferObj, 0, 2, { divisor });
+        attributeLoader(gl, startPotision2DBufferObj, 0, 2, { divisor });
         attributeLoader(gl, startPotision3DBufferObj, 1, 3, { divisor });
-        attributeLoader(gl, endPositionBufferObj, 2, 2, { divisor });
+        attributeLoader(gl, endPosition2DBufferObj, 2, 2, { divisor });
         attributeLoader(gl, endPosition3DBufferObj, 3, 3, { divisor });
         attributeLoader(gl, dashRatioBufferObj, 4, 1, { divisor, escapeValues: [escapeValue] });
         attributeLoader(gl, dashOpacityBufferObj, 5, 1, { divisor, escapeValues: [escapeValue] });

package/rangerings/plugin.js

@@ -57,11 +57,14 @@ import RangeRingAngleText from "./rangeringangletext";
 import { Z_ALPHA_MODE } from "../programs/line-on-globe/util";
 import { ENUM_HIDE } from "./enum";
 import { opacityCheck, constraintFloat } from "../util/check/typecheck";
+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 coord = globe.api_GetCartesian3DPoint(long, lat, 0, 0);
+    return normalize(coord, 6378.137);
+}
 
 class RangeRings {
     constructor(id,
@@ -108,7 +111,7 @@ class RangeRings {
             const datas = this.__reconstructCentralRings(centerID);
             bufferOrchestrator.updateBulk(datas, bufferManagersCompMap, ["centerCoords3d", "centerCoords2dflat", "targetCoords3d", "centerCoords2dflatForPadding"]);
             const paddingDatas = this.__reconstructCentralRingsBigPaddings(centerID);
-            paddingBufferOrchestrator.updateBulk(paddingDatas, bufferManagersCompMapPadding, ["circlePoint", "paddingPoint", "circlePoint3d", "paddingPoint3d"]);
+            paddingBufferOrchestrator.updateBulk(paddingDatas, bufferManagersCompMapPadding, ["circlePoint2d", "paddingPoint2d", "circlePoint3d", "paddingPoint3d"]);
         }
         this.paddingTextPlugin?.updateCentersXY(items);
 
@@ -144,7 +147,7 @@ class RangeRings {
         for (const item of items) {
             _ringAccount.insertCenter(item);
             const datas = this.__reconstructCentralRings(item.centerID);
-            bufferOrchestrator.insertBulk(datas, bufferManagersCompMap,);
+            bufferOrchestrator.insertBulk(datas, bufferManagersCompMap);
             const paddingDatas = this.__reconstructCentralRingsBigPaddings(item.centerID);
             paddingBufferOrchestrator.insertBulk(paddingDatas, bufferManagersCompMapPadding);
         }
@@ -309,7 +312,7 @@ class RangeRings {
         this._circleProgram3D = CircleCache3D.get(globe);
         this._padding2dProgram = LinesColorInstancedFlatCache.get(globe);
         this._padding3dProgram = CirclePadding3DCache.get(globe);
-        this._bigPadding3dFlatProgram = LineOnGlobeCache.get(globe);
+        this._lineOnGlobe_bigPadding = LineOnGlobeCache.get(globe);
 
     }
 
@@ -406,13 +409,13 @@ class RangeRings {
         this.paddingBufferOrchestrator = new BufferOrchestrator({ capacity: initialCapacity });
         this.bufferManagersCompMapPadding = new Map(
             [
-                ["circlePoint", {
+                ["circlePoint2d", {
                     'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
-                    'adaptor': (item) => item.circlePoint,
+                    'adaptor': (item) => item.circlePoint2d,
                 }],
-                ["paddingPoint", {
+                ["paddingPoint2d", {
                     'bufferManager': new BufferManager(gl, 2, { bufferType, initialCapacity }),
-                    'adaptor': (item) => item.paddingPoint,
+                    'adaptor': (item) => item.paddingPoint2d,
                 }],
                 ["circlePoint3d", {
                     'bufferManager': new BufferManager(gl, 3, { bufferType, initialCapacity }),
@@ -427,19 +430,19 @@ class RangeRings {
                     'adaptor': (item) => new Float32Array(item.rgba)
                 }],
 
-                ["dashOpacity", {
-                    'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                    'adaptor': (item) => new Float32Array([1]),
-                }],
-                ["dashRatio", {
-                    'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
-                    'adaptor': (item) => new Float32Array([1]),
-                }],
+                // ["dashOpacity", {
+                //     'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                //     'adaptor': (item) => new Float32Array([1]),
+                // }],
+                // ["dashRatio", {
+                //     'bufferManager': new BufferManager(gl, 1, { bufferType, initialCapacity }),
+                //     'adaptor': (item) => new Float32Array([1]),
+                // }],
             ]
         );
 
-        this._bigPadding3dFlatVAO = this._bigPadding3dFlatProgram.createVAO(//"dashRatio", "dashOpacity"
-            ...["circlePoint", "circlePoint3d", "paddingPoint", "paddingPoint3d", null, null, "rgba",].map(key =>
+        this._bigPadding3dFlatVAO = this._lineOnGlobe_bigPadding.createVAO(//"dashRatio", "dashOpacity"
+            ...["circlePoint2d", "circlePoint3d", "paddingPoint2d", "paddingPoint3d", null, null, "rgba",].map(key =>
                 (key === null) ? null : obj(this.bufferManagersCompMapPadding.get(key)))
         );
 
@@ -451,6 +454,7 @@ class RangeRings {
 
     }
 
+    // IMPLICIT METHODS
 
     __reconstructCentralRingsBigPaddings(centerID) {
         const { globe } = this;
@@ -466,10 +470,10 @@ class RangeRings {
                 const paddingPoint = globe.Math.FindPointByPolar(long, lat, radius - padding, azimuthAngle); // long lat
                 result.push({
                     key: ringBigPaddingKeyMethod(centerID, ringID, azimuthAngle),
-                    circlePoint: new Float32Array(globe.api_GetMercator2DPoint(circlePoint.long, circlePoint.lat)),
-                    paddingPoint: new Float32Array(globe.api_GetMercator2DPoint(paddingPoint.long, paddingPoint.lat)),
-                    circlePoint3d: new Float32Array(globe.api_GetCartesian3DPoint(circlePoint.long, circlePoint.lat, 0, 0)),
-                    paddingPoint3d: new Float32Array(globe.api_GetCartesian3DPoint(paddingPoint.long, paddingPoint.lat, 0, 0)),
+                    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),
                     rgba: color,
                     hide,
                     textHide
@@ -481,7 +485,6 @@ class RangeRings {
         return result;
     }
 
-    // IMPLICIT METHODS
 
     __reconstructCentralRings(centerID) {
         const { globe } = this;
@@ -489,7 +492,7 @@ class RangeRings {
         if (centerItem === undefined) throw new Error("Center not found");
 
         const { long, lat, rgba, rings, hide = 0, textHide = 0 } = centerItem;
-        const centerCoords3d = globe.api_GetCartesian3DPoint(long, lat, 0, 0);
+        const centerCoords3d = coordOnSphere(long, lat, globe);
 
         const result = [];
 
@@ -498,7 +501,7 @@ class RangeRings {
             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 = new Float32Array(globe.api_GetCartesian3DPoint(targetPoint.long, targetPoint.lat, 0, 0));
+            const targetCoords3d = coordOnSphere(targetPoint.long, targetPoint.lat, globe);
             const centerCoords2dflatForPadding = centerCoords2dflatDataCreatorWithRadius(globe, long, lat, radiusPadding, { edgeCount: CIRCLE_FLAT_EDGE_COUNT });
             result.push({
                 key,
@@ -573,7 +576,7 @@ class RangeRings {
     draw3D() {
         const {
             globe, gl,
-            _circleProgram2D, _circleProgram3D, _padding2dProgram, _padding3dProgram, _bigPadding3dFlatProgram,
+            _circleProgram2D, _circleProgram3D, _padding2dProgram, _padding3dProgram, _lineOnGlobe_bigPadding,
             _circle2DVao, _circle3DVao, _oneDegree2DPaddingVao, _padding3dOneDegreeVao, _bigPadding3dFlatVAO,
             bufferOrchestrator, paddingBufferOrchestrator,
             _opacity, _oneDegreePadding, _zAlphaOnDegreePadding } = this;
@@ -588,8 +591,8 @@ class RangeRings {
             // _padding2dProgram.draw(bigPaddingVAO, paddingBufferOrchestrator.length, _opacity);
             if (_oneDegreePadding) _padding2dProgram.draw(_oneDegree2DPaddingVao, bufferOrchestrator.length * CIRCLE_FLAT_EDGE_COUNT, _opacity, _zAlphaOnDegreePadding);
         }
-        const drawOptions = { drawRange: { first: 0, count: bufferOrchestrator.length } };
-        _bigPadding3dFlatProgram.draw(_bigPadding3dFlatVAO, drawOptions, _opacity);
+        const drawOptions = { drawRange: { first: 0, count: paddingBufferOrchestrator.length } };
+        _lineOnGlobe_bigPadding.draw(_bigPadding3dFlatVAO, drawOptions, _opacity);
         this._textWritersMap.forEach((textWriter) => textWriter.draw());
         gl.enable(gl.DEPTH_TEST);
     }
@@ -615,7 +618,7 @@ class RangeRings {
         this._circleProgram3D = null;
         this._padding2dProgram = null;
         this._padding3dProgram = null;
-        this._bigPadding3dFlatProgram = null;
+        this._lineOnGlobe_bigPadding = null;
         this.paddingTextPlugin?.free();
         this._isFreed = true;
     }

package/util/geometry/index.js

@@ -26,4 +26,25 @@ export function latLongBboxtoPixelXYBbox(minX, minY, maxX, maxY) {
 }
 
 
-// export { GeoDataFromTexture } from './geodatafromtexture';
+/**
+ * 
+ * @param {Float32List} array 
+ * @returns {Float32Array}
+ */
+export function normalize(array, newLength = 1) {
+    let total = 0;
+    for (let i = 0; i < array.length; i++) {
+        total += array[i] * array[i];
+    }
+    const len = newLength / Math.sqrt(total);
+    const result = new Float32Array(array.length);
+    for (let i = 0; i < array.length; i++) {
+        result[i] = array[i] * len;
+    }
+    return result;
+}
+
+
+export function sphereCoord(long, lat, globe) {
+    return normalize(globe.api_GetCartesian3DPoint(long, lat, 0, 0), 6378.137);
+}