@pirireis/webglobeplugins 0.15.35 → 0.16.0

package/dist/heatwave/isobar/plugin.js

@@ -0,0 +1,302 @@
+import { ShapesOnGlobeProgram, latLongToPixelXY } from "../../util";
+import ContourMipmap, { scaleParameters } from "./quadtreecontours";
+import ObjectArrayLabels from "./objectarraylabels";
+import { isBoolean, opacityCheck } from "../../util/check/typecheck";
+export class IsobarRasterToVector {
+    /**
+     * @typedef {Object} IsobarData
+     * @property {number} threshold
+     * @property {[number, number, number]} color | rgb color
+     * @property {string} label
+     *
+     * @param {*} id
+     * @param {Array<IsobarData>} isabors
+     * @param {number} width
+     * @param {number} height
+     * @param {Object} options
+     * @param {boolean} options.xFlip
+     * @param {boolean} options.yFlip
+     * @param {boolean} options.isOn
+     * @param {boolean} options.isLabelsOn
+     * @param {Object} options.labelStyle
+     */
+    constructor(id, dataManager, isobars, width, height, [minLon, minLat, maxLon, maxLat] = [-180, -90, 180, 90], { xFlip = false, yFlip = true, isOn = true, isLabelsOn = true, labelStyle = null, maxMipmapLevel = null } = {}) {
+        this.id = id;
+        this._isobarsCheckAndComplete(isobars);
+        this.isobars = isobars;
+        this.contourMipmap = null;
+        this.width = width;
+        this.height = height;
+        this.xFlip = xFlip;
+        this.yFlip = yFlip;
+        this.bbox = [minLon, minLat, maxLon, maxLat];
+        this.dataManager = dataManager;
+        this._transformationMethod = getTransformationMethod(xFlip, yFlip, width, height, minLon, minLat, maxLon, maxLat);
+        this._isOn = isOn;
+        this._isLabelsOn = isLabelsOn;
+        this._labelsLayer = null;
+        this._labelsLayerId = id + '_isobar-labels';
+        this._lineStrignRanges = [];
+        this._transpos = new Float32Array(3);
+        this._maxMipmapLevel = maxMipmapLevel;
+        this._labelStyle = labelStyle;
+        // this._transformationMethod = null;
+    }
+    // API
+    setData(data, on = false) {
+        if (!data)
+            return;
+        this._data = data;
+        if (on)
+            this._isOn = true;
+        if (this._isOn)
+            this._calculateAll(data);
+    }
+    on() {
+        this._isOn = true;
+        if (this._data)
+            this._calculateAll(this._data);
+    }
+    off() {
+        this._isOn = false;
+        this.clean();
+    }
+    clean() {
+        this.flush();
+        this.globe.DrawRender();
+    }
+    setFlip(xFlip, yFlip) {
+        isBoolean(xFlip);
+        isBoolean(yFlip);
+        if (this.xFlip === xFlip && this.yFlip === yFlip)
+            return;
+        this.xFlip = xFlip;
+        this.yFlip = yFlip;
+        const [minLon, minLat, maxLon, maxLat] = this.bbox;
+        const { width, height } = this;
+        this._transformationMethod = getTransformationMethod(xFlip, yFlip, width, height, minLon, minLat, maxLon, maxLat);
+        this._calculateLines();
+        this.globe.DrawRender();
+    }
+    setBoundingBox([minLon, minLat, maxLon, maxLat]) {
+        this.bbox = [minLon, minLat, maxLon, maxLat];
+        const { width, height, xFlip, yFlip } = this;
+        this._transformationMethod = getTransformationMethod(xFlip, yFlip, width, height, minLon, minLat, maxLon, maxLat);
+        this._calculateLines();
+        this.globe.DrawRender();
+    }
+    setIsLabelsOn(isLabelsOn) {
+        isBoolean(isLabelsOn);
+        if (this._isLabelsOn === isLabelsOn)
+            return;
+        this._isLabelsOn = isLabelsOn;
+        if (!isLabelsOn) {
+            this._labelsLayer.removeFromMap();
+        }
+        else {
+            if (this._labelsLayer === null)
+                this._createLabelsLayer();
+            this._labelsLayer.addToMap();
+            this._createBufferData();
+        }
+    }
+    getIsobars() {
+        return this.isobars;
+    }
+    setIsobars(isobars) {
+        this._isobarsCheckAndComplete(isobars);
+        this.isobars = isobars;
+        this._calculateLines();
+        this.globe.DrawRender();
+    }
+    setWidthHeight(width, height) {
+        this.width = width;
+        this.height = height;
+        const { xFlip, yFlip } = this;
+        const [minLon, minLat, maxLon, maxLat] = this.bbox;
+        this._transformationMethod = getTransformationMethod(xFlip, yFlip, width, height, minLon, minLat, maxLon, maxLat);
+        this._calculateLines();
+        this.globe.DrawRender();
+    }
+    getLabelStyle() {
+        return this._labelsLayer.getLabelStyle();
+    }
+    setOpacity(opacity) {
+        opacityCheck(opacity);
+        this.program.setOpacity(opacity);
+    }
+    setLabelStyle(style) {
+        this._labelStyle = style;
+        if (this._labelsLayer)
+            this._labelsLayer.setLabelStyle(style);
+        const lastState = this._isLabelsOn;
+        this.setIsLabelsOn(false);
+        this.setIsLabelsOn(lastState);
+        if (lastState)
+            this._createBufferData();
+    }
+    setMaxMipmapLevel(maxMipmapLevel = null) {
+        this._maxMipmapLevel = maxMipmapLevel;
+        this._calculateLines();
+        this.globe.DrawRender();
+    }
+    flush() {
+        this.program.setBufferData(new Float32Array(0));
+        this._lineStrignRanges = [];
+        if (this._isLabelsOn)
+            this._labelsLayer.flush();
+    }
+    // 
+    // implicit methods
+    init(globe, gl) {
+        this.gl = gl;
+        this.globe = globe;
+        this.program = new ShapesOnGlobeProgram(gl, globe, 'line_strip');
+        if (this._isLabelsOn) {
+            this._createLabelsLayer();
+            this._labelsLayer.addToMap();
+        }
+        this.dataManager.register(this.id, (ratio, t1, t2) => {
+            if (!t1 || !t2) {
+                this.clean();
+                return;
+            }
+            const data = dataMixer(t1, t2, ratio);
+            if (this._isOn)
+                this.setData(data);
+        });
+    }
+    resize(width, height) {
+        this.program.resize(width, height);
+    }
+    draw3D(projMatrix, modelviewMatrix, transPos) {
+        if (!this._ready)
+            return;
+        this._drawContour(projMatrix, modelviewMatrix, transPos);
+    }
+    _calculateLines() {
+        this._calculateContours();
+        this._bufferData = this._createBufferData();
+        this.program.setBufferData(this._bufferData);
+    }
+    _drawContour(projMatrix, modelviewMatrix, transPos) {
+        this.program.draw(projMatrix, modelviewMatrix, transPos, this._lineStrignRanges);
+    }
+    _calculateIntersections(threshold) {
+        const { _transformationMethod } = this;
+        const lines = this.contourMipmap.contour([threshold], { maxMipmapLevel: this._maxMipmapLevel }).map(coords => {
+            return coords.map(([x, y]) => _transformationMethod(x, y));
+        });
+        return lines;
+    }
+    _calculateAll(data) {
+        this.contourMipmap = new ContourMipmap(data, this.width, this.height);
+        this._calculateContours();
+        this._bufferData = this._createBufferData();
+        this.program.setBufferData(this._bufferData);
+        this.globe.DrawRender();
+        this._ready = true;
+    }
+    _calculateContours() {
+        const { isobars } = this;
+        for (const isobar of isobars) {
+            const { threshold } = isobar;
+            const lines = this._calculateIntersections(threshold);
+            isobar.lines = lines;
+        }
+    }
+    _isobarsCheckAndComplete(isobars) {
+        if (!Array.isArray(isobars))
+            throw new Error("isobars must be an array");
+        if (isobars.length === 0)
+            throw new Error("isobars must contain at least one element");
+        for (const isobar of isobars) {
+            if (!isobar || typeof isobar !== 'object')
+                throw new Error("isobar must be an object");
+            if (typeof isobar.threshold !== 'number')
+                throw new Error("isobar.threshold must be a number");
+            if (isobar.color) {
+                if (!Array.isArray(isobar.color) || isobar.color.length !== 3)
+                    throw new Error("isobar.color must be an array with 3 elements");
+                for (const color of isobar.color) {
+                    if (color < 0 || color > 1)
+                        throw new Error("isobar.color elements must be between 0 and 1");
+                }
+            }
+            if (!isobar.color)
+                isobar.color = [1, 1, 1];
+        }
+    }
+    _createBufferData() {
+        const { isobars } = this;
+        const pointCount = isobars.reduce((acc, { lines }) => acc + lines.reduce((acc, line) => acc + line.length, 0), 0);
+        const bufferData = new Float32Array(pointCount * 6);
+        let index = 0;
+        let pointCounter = 0;
+        this._lineStrignRanges = [];
+        // gather label data label
+        const labelPoints = {
+            coords: [],
+            coordsZ: [],
+            attribs: []
+        };
+        const { coords, coordsZ, attribs } = labelPoints;
+        let fidCounter = 0;
+        for (const { lines, color, threshold } of isobars) {
+            for (const line of lines) {
+                let startIndex = pointCounter;
+                for (const [x, y] of line) {
+                    const pixXY = latLongToPixelXY(y, x);
+                    bufferData[index++] = pixXY.x;
+                    bufferData[index++] = pixXY.y;
+                    bufferData[index++] = color[0];
+                    bufferData[index++] = color[1];
+                    bufferData[index++] = color[2];
+                    bufferData[index++] = 1.0;
+                    pointCounter++;
+                }
+                coords.push(line[0][0], line[0][1]);
+                coordsZ.push(0);
+                attribs.push({ value: threshold, fid: fidCounter++ });
+                this._lineStrignRanges.push([startIndex, pointCounter - startIndex]);
+            }
+        }
+        if (this._isLabelsOn)
+            this._labelsLayer.setData(labelPoints);
+        return bufferData;
+    }
+    _createLabelsLayer() {
+        this._labelsLayer = new ObjectArrayLabels(this._labelsLayerId, this.globe, this._labelStyle);
+    }
+    setGeometry() {
+        this.program.setGeometry();
+    }
+    free() {
+        this.flush();
+        this.program.free();
+        if (this._isLabelsOn)
+            this._labelsLayer.removeFromMap();
+        this.dataManager.unregister(this.id);
+    }
+}
+const getTransformationMethod = (xFlip, yFlip, width, height, minX, minY, maxX, maxY) => {
+    const { scaleX, scaleY } = scaleParameters(minX, minY, maxX, maxY, width, height);
+    if (xFlip && yFlip)
+        return (x, y) => [maxX - x * scaleX, maxY - y * scaleY];
+    if (xFlip && !yFlip)
+        return (x, y) => [maxX - x * scaleX, minY + y * scaleY];
+    if (!xFlip && yFlip)
+        return (x, y) => [minX + x * scaleX, maxY - y * scaleY];
+    return (x, y) => [minX + x * scaleX, minY + y * scaleY];
+};
+function dataMixer(data1, data2, ratio) {
+    if (!data1 || !data2)
+        return null;
+    if (data1.length !== data2.length)
+        throw new Error("Data length mismatch");
+    const data = new Float32Array(data1.length);
+    for (let i = 0; i < data1.length; i++) {
+        data[i] = data1[i] * (1 - ratio) + data2[i] * ratio;
+    }
+    return data;
+}

package/dist/heatwave/isobar/quadtreecontours.js

@@ -0,0 +1,298 @@
+// © 2019 3D Robotics. License: Apache-2.0
+/* eslint no-plusplus: "off", prefer-rest-params: "off" */
+const OUTSIDE = 0;
+const ABOVE = 1;
+const BELOW = 2;
+const WITHIN = 3;
+// Build mipmap layer N from layer N+1
+function mipmapReduce({ min, max, width, height, scale }) {
+    const outWidth = Math.ceil(width / 2);
+    const outHeight = Math.ceil(height / 2);
+    function reduceWith(data, reduce) {
+        const out = new Float32Array(outWidth * outHeight);
+        let x;
+        let y;
+        for (y = 0; y < Math.floor(height / 2); y++) {
+            for (x = 0; x < Math.floor(width / 2); x++) {
+                out[y * outWidth + x] = reduce(data[(y * 2 + 0) * width + (x * 2 + 0)], data[(y * 2 + 0) * width + (x * 2 + 1)], data[(y * 2 + 1) * width + (x * 2 + 0)], data[(y * 2 + 1) * width + (x * 2 + 1)]);
+            }
+            if (x < outWidth) {
+                out[y * outWidth + x] = reduce(data[(y * 2 + 0) * width + (x * 2 + 0)], data[(y * 2 + 1) * width + (x * 2 + 0)]);
+            }
+        }
+        if (y < outHeight) {
+            for (x = 0; x < Math.floor(width / 2); x++) {
+                out[y * outWidth + x] = reduce(data[(y * 2 + 0) * width + (x * 2 + 0)], data[(y * 2 + 0) * width + (x * 2 + 1)]);
+            }
+        }
+        if (x < outWidth && y < outHeight) {
+            out[y * outWidth + x] = reduce(data[(y * 2 + 0) * width + (x * 2 + 0)]);
+        }
+        return out;
+    }
+    function minFinite() {
+        let r = Infinity;
+        for (let i = 0; i < arguments.length; i++) { // significantly faster than the code Babel generates for ...args
+            const v = arguments[i];
+            if (v < r)
+                r = v;
+        }
+        return r;
+    }
+    function maxFinite() {
+        let r = -Infinity;
+        for (let i = 0; i < arguments.length; i++) {
+            const v = arguments[i];
+            if (v > r)
+                r = v;
+        }
+        return r;
+    }
+    return {
+        min: reduceWith(min, minFinite),
+        max: reduceWith(max, maxFinite),
+        width: outWidth,
+        height: outHeight,
+        scale: scale * 2,
+    };
+}
+class ContourMipmap {
+    constructor(raster, width, height) {
+        // Bottom mipmap layer is just the raster: at each pixel the minimum and maximum are the same
+        this.levels = [{ min: raster, max: raster, width, height, scale: 1 }];
+        while (this.levels[0].width > 1 || this.levels[0].height > 1) {
+            this.levels.unshift(mipmapReduce(this.levels[0]));
+        }
+    }
+    // Get the minimum elevation in the mipmap
+    min() { return this.levels[0].min[0]; }
+    // Get the maximum elevation in the mipmap
+    max() { return this.levels[0].max[0]; }
+    // Get an array of contour levels for a specified contour interval
+    intervals(interval) {
+        if (interval <= 0)
+            throw new Error('Contour interval must be positive');
+        const min = this.min();
+        const max = this.max();
+        const levels = [];
+        let level = Math.ceil(min / interval) * interval;
+        while (level < max) {
+            levels.push(level);
+            level += interval;
+        }
+        return levels;
+    }
+    // Walk the quadtree for a specified contour level, and pass quadtree nodes
+    // and contour line segments to the callbacks. This is used for visualizing
+    // the quadtree; in most cases you should use .contour() instead, which
+    // assembles the line segments into lines and rings.
+    evaluateContour(contourLevel, { maxMipmapLevel }, addLine, addNode) {
+        maxMipmapLevel = maxMipmapLevel || this.levels.length - 1;
+        // Test the mipmap at the given coordinate and level, returning whether the contour line is ABOVE, BELOW, or WITHIN this mipmap cell
+        // If the mipmap is out of bounds or NaN at that point, OUTSIDE is returned.
+        const evaluate = (l, x, y) => {
+            const ml = this.levels[l];
+            const i = ml.width * y + x;
+            if (x >= ml.width || y >= ml.height || !Number.isFinite(ml.min[i]) || !Number.isFinite(ml.max[i]))
+                return OUTSIDE;
+            if (ml.min[i] >= contourLevel)
+                return ABOVE;
+            if (ml.max[i] < contourLevel)
+                return BELOW;
+            // If we've reached the maximum mipmap level, arbitrarily decide that cells that contain
+            // the contour elevation go inside the contour line.
+            if (l >= maxMipmapLevel)
+                return ABOVE;
+            return WITHIN;
+        };
+        // Add any vertical contour lines that exist between passed mipmap cell and
+        // its horizontal neighbor to the right. If the line exists at this mipmap
+        // level, it is added directly, otherwise split the edge and recurse at a
+        // more detailed mipmap level.
+        function edgeH(l, x, y) {
+            const e1 = evaluate(l, x, y);
+            const e2 = evaluate(l, x + 1, y);
+            if (e1 === ABOVE && e2 === BELOW) {
+                addLine(l, x + 1, y + 1, x + 1, y);
+            }
+            else if (e2 === ABOVE && e1 === BELOW) {
+                // reverse order of coordinates compared to case above so that lines
+                // go counterclockwise around the region above the contour value
+                addLine(l, x + 1, y, x + 1, y + 1);
+            }
+            else if (e1 === WITHIN || e2 === WITHIN) {
+                edgeH(l + 1, x * 2 + 1, y * 2 + 0);
+                edgeH(l + 1, x * 2 + 1, y * 2 + 1);
+            }
+        }
+        // Like edgeH, but for horizontal contour lines between the passed cell
+        // and its vertical neighbor below.
+        function edgeV(l, x, y) {
+            const e1 = evaluate(l, x, y);
+            const e2 = evaluate(l, x, y + 1);
+            if (e1 === ABOVE && e2 === BELOW) {
+                addLine(l, x, y + 1, x + 1, y + 1);
+            }
+            else if (e2 === ABOVE && e1 === BELOW) {
+                addLine(l, x + 1, y + 1, x, y + 1);
+            }
+            else if (e1 === WITHIN || e2 === WITHIN) {
+                edgeV(l + 1, x * 2 + 0, y * 2 + 1);
+                edgeV(l + 1, x * 2 + 1, y * 2 + 1);
+            }
+        }
+        // Add all contour lines within a mipmap cell.
+        // It recurses into the four quadrants of the cell, and also uses edgeH and
+        // edgeV to add the contour lines that exist between quadrants.
+        function node(l, x, y) {
+            let e = evaluate(l, x, y);
+            if (e === WITHIN) {
+                node(l + 1, x * 2 + 0, y * 2 + 0);
+                node(l + 1, x * 2 + 1, y * 2 + 0);
+                node(l + 1, x * 2 + 0, y * 2 + 1);
+                node(l + 1, x * 2 + 1, y * 2 + 1);
+                edgeH(l + 1, x * 2 + 0, y * 2 + 0);
+                edgeV(l + 1, x * 2 + 0, y * 2 + 0);
+                edgeH(l + 1, x * 2 + 0, y * 2 + 1);
+                edgeV(l + 1, x * 2 + 1, y * 2 + 0);
+            }
+            else {
+                if (addNode)
+                    addNode(l, x, y, e);
+            }
+        }
+        node(0, 0, 0);
+    }
+    // Generate a contour line for a specified value
+    //
+    // level: Value in the input array at which to draw a contour line
+    // opts: {
+    //   maxMipmapLevel: Maximum recursion depth in the mipmap. As if you rescaled
+    //                   the input to a maximum dimension of 2^n pixels.
+    //                   (default unlimited)
+    //   minPoints: Lines and rings with fewer points are removed. (default 0)
+    //   smoothKernelWidth: Width of the rectangular filter for smoothing (default 2)
+    //   smoothCycles: Number of iterations of smoothing (default 2)
+    // }
+    //
+    // Returns an array of lines, where each line is an array of [x, y] pairs.
+    contour(level, { maxMipmapLevel, smoothKernelWidth = 2, smoothCycles = 2, minPoints = 0 } = {}) {
+        // Use the quadtree algorithm to generate line segments that make up the contour
+        const segments = [];
+        this.evaluateContour(level, { maxMipmapLevel }, (l, x1, y1, x2, y2) => {
+            const scale = this.levels[l].scale;
+            const start = [scale * x1, scale * y1];
+            const end = [scale * x2, scale * y2];
+            segments.push({ start, end });
+        });
+        segments.sort((a, b) => key(a.start) - key(b.start));
+        // .. and then join them together into rings
+        // An arbitrary function to use a 2D point as a Map key
+        function key(a) { return a[0] + a[1] * 65536; }
+        const fragmentStart = new Map();
+        const fragmentEnd = new Map();
+        const rings = [];
+        segments.forEach(({ start, end }) => {
+            const a = fragmentEnd.get(key(start));
+            const b = fragmentStart.get(key(end));
+            if (a && b) {
+                fragmentEnd.delete(key(start));
+                fragmentStart.delete(key(end));
+                if (a === b) {
+                    // Close a ring
+                    a.push(end);
+                    rings.push(a);
+                }
+                else {
+                    // Join two lines together
+                    const c = a.concat(b);
+                    fragmentStart.set(key(c[0]), c);
+                    fragmentEnd.set(key(c[c.length - 1]), c);
+                }
+            }
+            else if (a) {
+                // Extend an existing line from the end
+                fragmentEnd.delete(key(start));
+                a.push(end);
+                fragmentEnd.set(key(end), a);
+            }
+            else if (b) {
+                // Extend an existing line from the start
+                fragmentStart.delete(key(end));
+                b.unshift(start);
+                fragmentStart.set(key(start), b);
+            }
+            else {
+                // New line doesn't connect to any existing line
+                const c = [start, end];
+                fragmentStart.set(key(start), c);
+                fragmentEnd.set(key(end), c);
+            }
+            if (fragmentStart.size !== fragmentEnd.size) {
+                console.error(`Contour remaining fragment size mismatch ${fragmentStart.size} ${fragmentEnd.size}`);
+            }
+        });
+        const smoothOpts = {
+            kernelWidth: smoothKernelWidth,
+            cycles: smoothCycles,
+        };
+        // Closed rings and any unclosed line strings
+        return [...rings, ...fragmentStart.values()]
+            .filter(l => l.length >= minPoints && l.length >= smoothKernelWidth * 2)
+            .map(l => smooth(l, smoothOpts));
+    }
+}
+// Smooth a line by repeatedly applying a rectangular filter to approximate
+// a gaussian filter. It detects closed loops and preserves them.
+// The line is passed as an array of `[x, y]` pairs.
+//
+// kernelWidth: Width of the rectangular filter kernel
+// cycles: Number of times to apply the kernel
+function smooth(line, { kernelWidth = 2, cycles = 2 }) {
+    const isLoop = line[0][0] === line[line.length - 1][0] && line[0][1] === line[line.length - 1][1];
+    let pointAt;
+    if (isLoop) {
+        pointAt = i => line[(i + line.length) % line.length];
+    }
+    else {
+        pointAt = i => line[Math.min(Math.max(i, 0), line.length - 1)];
+    }
+    const sc = 1.0 / (kernelWidth * 2);
+    for (let cycle = 0; cycle < cycles; cycle++) {
+        let px = 0;
+        let py = 0;
+        if (isLoop) {
+            for (let i = line.length - kernelWidth; i < line.length; i++) {
+                px += line[i][0];
+                py += line[i][1];
+            }
+        }
+        else {
+            px = line[0][0] * kernelWidth;
+            py = line[0][1] * kernelWidth;
+        }
+        for (let i = 0; i < kernelWidth; i++) {
+            px += line[i][0];
+            py += line[i][1];
+        }
+        const res = line.slice();
+        for (let i = 0; i < line.length; i++) {
+            res[i] = [px * sc, py * sc];
+            px += pointAt(i + kernelWidth)[0] - pointAt(i - kernelWidth)[0];
+            py += pointAt(i + kernelWidth)[1] - pointAt(i - kernelWidth)[1];
+        }
+        if (isLoop) {
+            // Keep the loop closed
+            res[res.length - 1] = res[0].slice();
+        }
+        line = res;
+    }
+    return line;
+}
+function scaleParameters(minLongitude, minLatitude, maxLongitude, maxLatitude, width, height) {
+    const scaleX = (maxLongitude - minLongitude) / width;
+    const scaleY = (maxLatitude - minLatitude) / height;
+    return { scaleX, scaleY };
+}
+export default ContourMipmap;
+export { scaleParameters };