@pirireis/webglobeplugins 0.17.1 → 1.0.3

package/vectorfield/wind/plugin-persistant.js

@@ -0,0 +1,375 @@
+/**
+ * Author: Toprak Nihat Deniz Ozturk
+ */
+import { imageToFields } from "./adapters/image-to-fields";
+import ParticlePlugin from "../waveparticles/plugin";
+import { createImageFromBase64 } from "../../util/webglobjectbuilders";
+import { TexturePointSampler } from "../../heatwave/texture-point-sampler";
+import imageToMagnitude, { imageToRadianAngle } from "./imagetovectorfieldandmagnitude";
+import { isBoolean } from "../../util/check/typecheck";
+const windyLegendData = {
+    thresholds: [0, 3, 3, 5, 5, 7, 10, 10, 13, 15, 15, 17, 20, 20, 25, 25, 30],
+    values: [
+        "#6271B8",
+        "#6271B8",
+        "#6271B8",
+        "#6271B8",
+        "#3D6EA3",
+        "#4A94AA",
+        "#4A9294",
+        "#4D8E7C",
+        "#4CA44C",
+        "#67A436",
+        "#A28740",
+        "#A26D5C",
+        "#8D3F5C",
+        "#974B91",
+        "#5F64A0",
+        "#5B88A1",
+        "#5B88A1"
+    ]
+};
+export default class WindPlugin {
+    id;
+    globe;
+    gl = null;
+    particlePlugin;
+    windMetadata;
+    _legendData;
+    options;
+    windData;
+    _height;
+    _speedFactor;
+    _dropRate;
+    texturePointSampler;
+    texturePointSamplerAngle;
+    /**
+     * @param id - Plugin identifier
+     * @param windDataMeta - Wind data metadata
+     * @param windDataMeta.width - image width
+     * @param windDataMeta.height - image height
+     * @param windDataMeta.bbox - bounding box [minLon, minLat, maxLon, maxLat]
+     * @param options - Plugin options
+     * @param options.fadeOpacity - how fast the particle trails fade on each frame | between 0 - 1 | default 0.746
+     * @param options.speedFactor - how fast the particles move | between 0 - 1 | default 0.6
+     * @param options.dropRate - how often the particles move to a random place | between 0 - 1 | default 0.007
+     * @param options.dropRateBump - drop rate increase relative to individual particle speed
+     * @param options.baseOpacity - opacity of drawn particle trails | between 0 - 1 | default 1.0
+     * @param options.wingSize - wing size of particle arrow | positive number | default 7.0
+     * @param options.tailSize - tail size of particle arrow | positive number | default 1.0
+     * @param options.minSpeed - minimum speed threshold | positive number | default 0.0
+     * @param options.maxSpeed - maximum speed threshold | positive number | default 1000.0
+     * @param options.height - height of the particles | number | default 0.0
+     * @param options.numParticles - number of particles | positive integer | default 40000
+     * @param options.legendData - legend data for color mapping
+     */
+    constructor(id, windDataMeta, options = {}) {
+        this.id = id;
+        this.windMetadata = windDataMeta;
+        this._legendData = options.legendData || windyLegendData;
+        this.options = {
+            fadeOpacity: options.fadeOpacity ?? 0.746,
+            speedFactor: options.speedFactor ?? 0.6,
+            dropRate: options.dropRate ?? 0.007,
+            dropRateBump: options.dropRateBump ?? 0.001,
+            baseOpacity: options.baseOpacity ?? 1.0,
+            wingSize: options.wingSize ?? 7.0,
+            tailSize: options.tailSize ?? 1.0,
+            minSpeed: options.minSpeed ?? 0.0,
+            maxSpeed: options.maxSpeed ?? 1000.0,
+            height: options.height ?? 0.0,
+            numParticles: options.numParticles ?? 40000,
+            legendData: this._legendData
+        };
+        this.windData = null;
+        this._height = this.options.height;
+        this._speedFactor = this.options.speedFactor;
+        this._dropRate = this.options.dropRate;
+    }
+    // Globe plugin init method
+    init(globe, gl) {
+        this.globe = globe;
+        this.gl = gl;
+        // Initialize the particle plugin with appropriate options
+        const { bbox, width, height, flipY } = this.windMetadata;
+        this.particlePlugin = new ParticlePlugin(`${this.id}_particles`, {
+            dataWidth: width,
+            dataHeight: height,
+            fadeOpacity: this.options.fadeOpacity,
+            opacity: this.options.baseOpacity,
+            speed: this._speedFactor,
+            dropRate: this._dropRate,
+            height: this._height,
+            minLon: bbox[0],
+            minLat: bbox[1] < -85 ? -85 : bbox[1],
+            maxLon: bbox[2],
+            maxLat: bbox[3] > 85 ? 85 : bbox[3],
+            particleCount: this.options.numParticles,
+            flipY: flipY ?? true,
+            useColorTexture: false, // TODO: under test.. make it true later
+            useSpeedTexture: true,
+            minSpeedThreshold: this.options.minSpeed,
+            maxSpeedThreshold: this.options.maxSpeed,
+            tailSize: this.options.tailSize,
+            wingSize: this.options.wingSize
+        });
+        this.particlePlugin.init(globe, gl);
+        // apply initial speed thresholds from options
+        this.particlePlugin.setSpeedThresholds(this.options.minSpeed, this.options.maxSpeed);
+    }
+    draw3D() {
+        if (this.particlePlugin) {
+            this.particlePlugin.draw3D();
+        }
+    }
+    free() {
+        if (this.particlePlugin) {
+            this.particlePlugin.free();
+        }
+        if (this.texturePointSampler) {
+            this.texturePointSampler = undefined;
+        }
+        if (this.texturePointSamplerAngle) {
+            this.texturePointSamplerAngle = undefined;
+        }
+    }
+    // ===== Wind Data Management =====
+    /**
+     * Set wind data from base64 encoded image
+     * @param windData - Wind data object
+     * @param windData.image - base64 encoded image
+     * @param windData.width - image width
+     * @param windData.height - image height
+     * @param windData.uMin - minimum u value
+     * @param windData.vMin - minimum v value
+     * @param windData.uMax - maximum u value
+     * @param windData.vMax - maximum v value
+     * @param windData.bbox - bounding box [minLon, minLat, maxLon, maxLat]
+     */
+    setWindDataWithImageBase64(windData) {
+        const image = createImageFromBase64(windData.image);
+        image.onload = () => {
+            const fullWindData = {
+                image: image,
+                uMin: windData.uMin,
+                vMin: windData.vMin,
+                uMax: windData.uMax,
+                vMax: windData.vMax
+            };
+            this.setWind(fullWindData);
+        };
+    }
+    /**
+     * Set wind data from HTMLImageElement
+     */
+    setWind(windData) {
+        this.windData = windData;
+        if (!this.particlePlugin) {
+            return;
+        }
+        // Convert wind image to vector field, speed field, and color field
+        const { vectorFieldData, speedFieldData, colorFieldData } = imageToFields(windData, this._legendData);
+        // Update the particle plugin with the new data
+        this.particlePlugin.setVectorFieldData(vectorFieldData, {
+            dataWidth: windData.image.width,
+            dataHeight: windData.image.height,
+            flipY: this.windMetadata.flipY
+        });
+        this.particlePlugin.setSpeedField(speedFieldData);
+        this.particlePlugin.setColorField(colorFieldData);
+        // Update texture point samplers if they exist
+        this._setCoorcinatesDataCalculatorData();
+    }
+    // ===== Legend and Color Management =====
+    /**
+     * Set legend data for color mapping
+     * @param legendData - Legend data object
+     * @param legendData.thresholds - list of speed thresholds
+     * @param legendData.values - list of colors in hex format like #ff0000
+     */
+    setLegend(legendData) {
+        this._legendData = legendData;
+        // If wind data is already set, re-process to update colors
+        if (this.windData && this.particlePlugin) {
+            const { vectorFieldData, speedFieldData, colorFieldData } = imageToFields(this.windData, this._legendData);
+            this.particlePlugin.setColorField(colorFieldData);
+        }
+    }
+    setFlipY(flipY) {
+        isBoolean(flipY);
+        this.windMetadata.flipY = flipY;
+        if (this.particlePlugin && this.windData) {
+            this.setWind(this.windData);
+        }
+    }
+    setDrawTextureMaxPixelOnDimension(value) {
+        if (this.particlePlugin) {
+            this.particlePlugin.setDrawTextureMaxPixelOnDimension(value);
+        }
+    }
+    // ===== Property Setters =====
+    set height(value) {
+        this._height = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setHeight(value);
+        }
+    }
+    get height() {
+        return this._height;
+    }
+    set minSpeed(value) {
+        this.options.minSpeed = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setMinSpeedThreshold(value);
+        }
+    }
+    get minSpeed() {
+        return this.options.minSpeed;
+    }
+    set maxSpeed(value) {
+        this.options.maxSpeed = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setMaxSpeedThreshold(value);
+        }
+    }
+    get maxSpeed() {
+        return this.options.maxSpeed;
+    }
+    set fadeOpacity(value) {
+        this.options.fadeOpacity = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setFadeOpacity(value);
+        }
+    }
+    get fadeOpacity() {
+        return this.options.fadeOpacity;
+    }
+    set speedFactor(value) {
+        this._speedFactor = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setParticleSpeed(value);
+        }
+    }
+    get speedFactor() {
+        return this._speedFactor;
+    }
+    set dropRate(value) {
+        this._dropRate = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setDropRate(value);
+        }
+    }
+    get dropRate() {
+        return this._dropRate;
+    }
+    set dropRateBump(value) {
+        this.options.dropRateBump = value;
+        // Note: ParticlePlugin doesn't have dropRateBump parameter
+        // This would need to be added to ParticlePlugin if needed
+    }
+    get dropRateBump() {
+        return this.options.dropRateBump;
+    }
+    set baseOpacity(value) {
+        this.options.baseOpacity = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setOpacity(value);
+        }
+    }
+    get baseOpacity() {
+        return this.options.baseOpacity;
+    }
+    set numParticles(value) {
+        this.options.numParticles = value;
+        if (this.particlePlugin) {
+            this.particlePlugin.setParticleCount(value);
+        }
+    }
+    get numParticles() {
+        return this.options.numParticles;
+    }
+    /**
+     * Set wing and tail size for particle arrows
+     */
+    setParticleDimensions(tail, wing) {
+        this.options.tailSize = tail;
+        this.options.wingSize = wing;
+        if (this.particlePlugin) {
+            this.particlePlugin.setParticleDimensions(tail, wing);
+        }
+    }
+    /**
+     * Set particle color (used when not using color field)
+     */
+    setParticleColor(color) {
+        if (this.particlePlugin) {
+            this.particlePlugin.setParticleColor(color);
+        }
+    }
+    /**
+     * Set bounding box
+     */
+    setBBox(bbox) {
+        // rescale
+        if (this.particlePlugin) {
+            this.particlePlugin.setBBox({
+                minLon: bbox.minLon,
+                minLat: bbox.minLat < -85 ? -85 : bbox.minLat,
+                maxLon: bbox.maxLon,
+                maxLat: bbox.maxLat > 85 ? 85 : bbox.maxLat
+            });
+        }
+        // Update metadata
+        this.windMetadata.bbox = [bbox.minLon, bbox.minLat, bbox.maxLon, bbox.maxLat];
+    }
+    // ===== Texture Point Sampler (for backward compatibility) =====
+    /**
+     * Get texture point sampler for magnitude or angle
+     * @param type - 'magnitude' or 'angle'
+     */
+    getTexturePointSampler(type = 'magnitude') {
+        if (type === 'magnitude') {
+            if (!this.texturePointSampler) {
+                this._createTexturePointSampler();
+                this._setCoorcinatesDataCalculatorData();
+            }
+            return this.texturePointSampler;
+        }
+        else if (type === 'angle') {
+            if (!this.texturePointSamplerAngle) {
+                this._createTexturePointSamplerAngle();
+                this._setCoorcinatesDataCalculatorData();
+            }
+            return this.texturePointSamplerAngle;
+        }
+        else {
+            throw new Error(`WindPlugin.getTexturePointSampler: type must be either 'magnitude' or 'angle'.`);
+        }
+    }
+    _createTexturePointSamplerAngle() {
+        const { bbox, width, height } = this.windMetadata;
+        this.texturePointSamplerAngle = new TexturePointSampler(bbox, width, height);
+    }
+    _createTexturePointSampler() {
+        const { bbox, width, height } = this.windMetadata;
+        this.texturePointSampler = new TexturePointSampler(bbox, width, height);
+    }
+    _setCoorcinatesDataCalculatorData() {
+        if (!this.windData) {
+            return;
+        }
+        const windDataWithDimensions = {
+            ...this.windData,
+            width: this.windData.image.width,
+            height: this.windData.image.height
+        };
+        if (this.texturePointSamplerAngle) {
+            const angle = imageToRadianAngle(windDataWithDimensions);
+            this.texturePointSamplerAngle.updateTextureData(0, angle, angle);
+        }
+        if (this.texturePointSampler) {
+            const magnitude = imageToMagnitude(windDataWithDimensions);
+            this.texturePointSampler.updateTextureData(0, magnitude, magnitude);
+        }
+    }
+}

package/vectorfield/wind/plugin.js

@@ -2,7 +2,7 @@
  * Author: Toprak Nihat Deniz Ozturk
  */
 import { createImageFromBase64, createProgramWrapper, createTexture, createBuffer, bindAttribute, bindFramebuffer, bindTexture, getColorRamp } from "../../util/webglobjectbuilders";
-import { defaultblendfunction } from "../../util/webglobe/gldefaultstates";
+import { defaultblendfunction } from "../../util/globe-default-gl-states";
 import imageToMagnitude, { imageToRadianAngle } from "./imagetovectorfieldandmagnitude";
 import { TexturePointSampler } from "../../heatwave/texture-point-sampler";
 /**

package/Math/tessellation/earcut/adapters.js

@@ -1,37 +0,0 @@
-function geoJSONToEarcut(geojson) {
-    const vertices = [];
-    const holes = [];
-    const dimensions = 2; // Assuming 2D coordinates (longitude, latitude)
-    let holeIndex = 0;
-    if (geojson.type !== 'FeatureCollection') {
-        throw new Error('Invalid GeoJSON: Expected FeatureCollection');
-    }
-    const features = geojson.features;
-    function processPolygon(coordinates) {
-        for (let i = 0; i < coordinates.length; i++) {
-            if (i > 0) {
-                holeIndex += coordinates[i - 1].length;
-                holes.push(holeIndex);
-            }
-            for (const coord of coordinates[i]) {
-                vertices.push(coord[0], coord[1]);
-            }
-        }
-    }
-    function processMultiPolygon(coordinates) {
-        for (const polygon of coordinates) {
-            processPolygon(polygon);
-        }
-    }
-    for (const feature of features) {
-        const geometry = feature.geometry;
-        if (geometry.type === 'Polygon') {
-            processPolygon(geometry.coordinates);
-        }
-        else if (geometry.type === 'MultiPolygon') {
-            processMultiPolygon(geometry.coordinates);
-        }
-    }
-    return { vertices, holes, dimensions };
-}
-export { geoJSONToEarcut };

package/Math/tessellation/hybrid-triangle-tessellation-meta.js

@@ -1,123 +0,0 @@
-/**
- * @author Toprak Ozturk
- */
-import { equals, fromLongLatToUnitVector, fromUnitVectorToLongLat } from "../vec3";
-import { pointsOnArc } from "../juction/arc-plane";
-import { junctionVerticalOrHorizontalLines } from "../finite-line-2d";
-// TODO:get rid of embedded lists. always flat list
-const TILE_DEM_VERTEX_COUNT = 5; // 5x5 grid for DEM
-const TILE_DEM_STEPCOUNT = TILE_DEM_VERTEX_COUNT - 1; // 4 inner divisions in each dimension
-var EdgeType;
-(function (EdgeType) {
-    EdgeType[EdgeType["ARC"] = 0] = "ARC";
-    EdgeType[EdgeType["LINEAR"] = 1] = "LINEAR";
-})(EdgeType || (EdgeType = {}));
-const _tempVec2 = /*@__PURE__*/ [0, 0];
-const _plane = /*@__PURE__*/ { normal: [0, 0, 0], distance: 0 };
-const _resultPoints = /*@__PURE__*/ [[0, 0, 0], [0, 0, 0]];
-/**
- *
- * @param triangleMeta
- * @param zoom
- * @param angle
- * @param dimension false for longitude (meridian) true for latitude (parallel)
- */
-function getPoints(triangleMeta, angle, dimension) {
-    // console.log("getPoints called with angle:", angle * 180 / Math.PI, "dimension:", dimension ? 'latitude' : 'longitude');
-    // find which arcs are cut by plane
-    const radians = angle;
-    if (dimension) {
-        _plane.normal[0] = 0;
-        _plane.normal[1] = 0;
-        _plane.normal[2] = 1;
-        _plane.distance = Math.sin(radians);
-    }
-    else {
-        _plane.normal[0] = Math.sin(radians);
-        _plane.normal[1] = -Math.cos(radians);
-        _plane.normal[2] = 0;
-        _plane.distance = 0;
-    }
-    let result = [];
-    // Add debugging
-    let resultsFromDistinctEdges = 0;
-    for (let i = 0; i < 3; i++) {
-        const edgeType = triangleMeta.edgeTypes[i];
-        const edge = triangleMeta.edges[i];
-        const coordIndex = dimension ? 1 : 0;
-        const minCoord = edge.bbox.min[coordIndex];
-        const maxCoord = edge.bbox.max[coordIndex];
-        if (minCoord > angle || maxCoord < angle) {
-            continue; // edge is out of range
-        }
-        let count = 0;
-        if (edgeType === EdgeType.ARC) {
-            count = pointsOnArc(edge, _plane, _resultPoints);
-            if (count === 1) {
-                fromUnitVectorToLongLat(_tempVec2, _resultPoints[0]);
-                result.push([[..._resultPoints[0]], [..._tempVec2]]);
-            }
-            else if (count === 2) {
-                // throw new Error('Unexpected 2 cut points on arc, should be max 1'); // TODO DELETE this line later
-                fromUnitVectorToLongLat(_tempVec2, _resultPoints[0]);
-                result.push([[..._resultPoints[0]], [..._tempVec2]]);
-                fromUnitVectorToLongLat(_tempVec2, _resultPoints[1]);
-                result.push([[..._resultPoints[1]], [..._tempVec2]]); // TODO: this is a fix for a bug, need to investigate later
-            }
-        }
-        else {
-            // linear line
-            count = junctionVerticalOrHorizontalLines(_tempVec2, edge.line, angle, dimension);
-            if (count === 1) {
-                fromLongLatToUnitVector(_resultPoints[0], _tempVec2);
-                result.push([[..._resultPoints[0]], [..._tempVec2]]);
-            }
-        }
-        resultsFromDistinctEdges += 1;
-    }
-    if (resultsFromDistinctEdges === 3) {
-        result = filterDuplicate(result);
-    }
-    if (result.length !== 2 && result.length !== 4) {
-        // TODO: THERE is a case where 4 points are found.
-        // this happens when two arcs has limit and share space in Z dimension
-        console.log("ERROR");
-        const text = 'Angle:' + angle + ' dimension:' + (dimension ? 'latitude' : 'longitude') + "\n" +
-            'Result points count:' + result.length + "\n" +
-            "bbox:" + triangleMeta.bbox.min[0] * 180 / Math.PI + ", " + triangleMeta.bbox.min[1] * 180 / Math.PI + ", " + triangleMeta.bbox.max[0] * 180 / Math.PI + ", " + triangleMeta.bbox.max[1] * 180 / Math.PI + "\n";
-        for (let res of result) {
-            const ll = res[1];
-            console.log("Point: " + ll[0] * 180 / Math.PI + ", " + ll[1] * 180 / Math.PI + "\n");
-        }
-        throw new Error(`Unexpected cut count for tile cut, got: ${result.length}, angle: ${angle * 180 / Math.PI}, dimension: ${dimension ? 'latitude' : 'longitude'} \n` + text);
-    }
-    // TODO: i want to see it delete later
-    if (result.length === 4) {
-        console.warn("Warning: 4 cut points found on triangle for angle:", angle * 180 / Math.PI, "dimension:", dimension ? 'latitude' : 'longitude', "points:", result);
-    }
-    result.sort((a, b) => {
-        if (dimension) {
-            return a[1][0] - b[1][0]; // sort by y for longitude cuts
-        }
-        else {
-            return a[1][1] - b[1][1]; // sort by x for latitude cuts
-        }
-    });
-    return result;
-}
-function filterDuplicate(points) {
-    const result = [points[0]];
-    let dublicate = false;
-    for (let i = 1; i < points.length; i++) {
-        for (let j = 0; j < result.length; j++) {
-            if (equals(points[i][0], result[j][0])) {
-                dublicate = true;
-                break;
-            }
-        }
-        if (!dublicate) {
-            result.push(points[i]);
-        }
-    }
-    return result;
-}

package/Math/tessellation/shred-input.js

@@ -1,18 +0,0 @@
-import earcut from "earcut";
-import { createTriangleTessellationMeta } from "./triangle-tessellation-meta";
-function shredInput(vertices, holes, zoomLevel) {
-    const result = [];
-    const triangles = earcut(vertices, holes, 2);
-    for (let i = 0; i < triangles.length; i += 3) {
-        const idx1 = triangles[i] * 2;
-        const idx2 = triangles[i + 1] * 2;
-        const idx3 = triangles[i + 2] * 2;
-        const p1 = [vertices[idx1], vertices[idx1 + 1]];
-        const p2 = [vertices[idx2], vertices[idx2 + 1]];
-        const p3 = [vertices[idx3], vertices[idx3 + 1]];
-        const triangleMeta = createTriangleTessellationMeta(p1, p2, p3);
-        result.push(triangleMeta);
-    }
-    // cut triangles into smaller pieces based on zoom level...
-    return result;
-}

package/Math/tessellation/tiler.js

@@ -1,50 +0,0 @@
-"use strict";
-// /**
-//  * Find length in x and y for a tile in given zoom level (in wgs84)
-//  * Find tile cuts for given line represented by two points
-//  * Find inner position of point in tile
-//  * 
-//  */
-// import { LongLat } from "../../types";
-// export function tileLength(zoom: number): LongLat {
-//     const tileSize = 256; // in pixels
-//     const worldSize = tileSize * Math.pow(2, zoom);
-//     const latLength = 180 / worldSize;
-//     const lonLength = 360 / worldSize;
-//     return [lonLength, latLength];
-// }
-// // export function tileCuts(p1: LongLat, p2: LongLat, zoom: number): LongLat[] {
-// //     const cuts: LongLat[] = [];
-// //     const tileSize = 256;
-// //     const worldSize = tileSize * Math.pow(2, zoom);
-// //     const latLength = 180 / worldSize;
-// //     const lonLength = 360 / worldSize;
-// //     const x1 = (p1[0] + 180) / lonLength;
-// //     const y1 = (90 - p1[1]) / latLength;
-// //     const x2 = (p2[0] + 180) / lonLength;
-// //     const y2 = (90 - p2[1]) / latLength;
-// //     const dx = x2 - x1;
-// //     const dy = y2 - y1;
-// //     const steps = Math.max(Math.abs(dx), Math.abs(dy));
-// //     const xStep = dx / steps;
-// //     const yStep = dy / steps;
-// //     let x = x1;
-// //     let y = y1;
-// //     for (let i = 0; i <= steps; i++) {
-// //         const tileX = Math.floor(x);
-// //         const tileY = Math.floor(y);
-// //         const cutX = tileX * lonLength - 180;
-// //         const cutY = 90 - tileY * latLength;
-// //         const cut: LongLat = [cutX, cutY];
-// //         if (cuts.length === 0 || (cuts[cuts.length - 1][0] !== cut[0] || cuts[cuts.length - 1][1] !== cut[1])) {
-// //             cuts.push(cut);
-// //         }
-// //         x += xStep;
-// //         y += yStep;
-// //     } 
-// //     return cuts;
-// // }
-// // function fillTriangle(p1: LongLat, p2: LongLat, p3: LongLat, zoom: number): {positions:LongLat[], indices:number[]} {
-// //     // this function fills the triangle triangle iteratively
-// //     // 
-// // }