@pirireis/webglobeplugins 0.9.9 → 0.9.11

package/compass-rose/compass-rose-padding-flat.js

@@ -0,0 +1,247 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PixelPaddingCompassPlugin = void 0;
+var pixel_padding_for_compass_1 = require("../programs/two-d/pixel-padding-for-compass");
+var account_1 = require("../util/account");
+var compass_text_writer_1 = require("./compass-text-writer");
+var PaddingAngle = 30;
+var textGapFit = 10;
+var PixelPaddingCompassPlugin = /** @class */ (function () {
+    function PixelPaddingCompassPlugin(id, _a) {
+        var _b = _a === void 0 ? {} : _a, _c = _b.opacity, opacity = _c === void 0 ? 1 : _c, _d = _b.textAngleOn, textAngleOn = _d === void 0 ? true : _d, _e = _b.defaultProperties, defaultProperties = _e === void 0 ? {
+            rgba: [1, 1, 1, 1],
+            pixelRadiusRatioBig: 0.8,
+            pixelRadiusRatioSmall: 0.6,
+        } : _e, _f = _b.font, font = _f === void 0 ? {
+            name: 'Arial',
+            textColor: '#FFFFFF',
+            hollowColor: '#000000',
+            size: 12, // piksel
+            hollow: true,
+            bold: true,
+            italic: false,
+        } : _f, _g = _b.northFont, northFont = _g === void 0 ? {
+            name: 'Arial',
+            textColor: '#BBAA00',
+            hollowColor: '#000000',
+            size: 14, // piksel
+            hollow: true,
+            bold: true,
+            italic: false,
+        } : _g;
+        this.id = id;
+        this.textAngleOn = textAngleOn;
+        this.defaultProperties = defaultProperties;
+        this.bufferOrchestrator = new account_1.BufferOrchestrator({ capacity: 10 });
+        this._font_hold = { font: font, northFont: northFont };
+        this.compassMap = new CompassMap(this);
+        this._opacity = opacity;
+    }
+    PixelPaddingCompassPlugin.prototype.init = function (globe, gl) {
+        this.globe = globe;
+        this.resize();
+        this.gl = gl;
+        if (this.textAngleOn) {
+            this._createTextWriter();
+        }
+        this._initOrchestrations();
+    };
+    /**
+     * @param {string} key
+     * @param {number} long
+     * @param {number} lat
+     * @typedef properties
+     * @property {number} pixelRadiusRatioBig
+     * @property {number} pixelRadiusRatioSmall
+     * @property {[4 numbers between 0-1]} rgba
+     */
+    PixelPaddingCompassPlugin.prototype.insert = function (key, long, lat, properties) {
+        if (properties === void 0) { properties = null; }
+        this.__insertText(key, null, null, { properties: properties, update: true });
+        this.compassMap.insert(key, long, lat, properties);
+        this.globe.DrawRender();
+    };
+    /**
+     *
+     * @param {string} key
+     */
+    PixelPaddingCompassPlugin.prototype.delete = function (key) {
+        this.compassMap.delete(key);
+        this.globe.DrawRender();
+    };
+    PixelPaddingCompassPlugin.prototype.setFont = function (_a) {
+        var _b = _a === void 0 ? {} : _a, _c = _b.textFont, textFont = _c === void 0 ? null : _c, _d = _b.northFont, northFont = _d === void 0 ? null : _d;
+        if (textFont)
+            this.writer.setFont(textFont);
+        if (northFont)
+            this.writer.setNorthFont(northFont);
+        this.globe.DrawRender();
+    };
+    PixelPaddingCompassPlugin.prototype.setOpacity = function (opacity) {
+        var _a;
+        this._opacity = opacity;
+        (_a = this.writer) === null || _a === void 0 ? void 0 : _a.setOpacity(opacity);
+        this.globe.DrawRender();
+    };
+    PixelPaddingCompassPlugin.prototype.getTextWriter = function () {
+        return this.writer;
+    };
+    PixelPaddingCompassPlugin.prototype._initOrchestrations = function () {
+        var _a;
+        var _this = this;
+        var _b = this, gl = _b.gl, globe = _b.globe;
+        this.paddingProgram = pixel_padding_for_compass_1.PixelPaddingForFlatCompassCache.get(globe);
+        {
+            // createBuffers
+            var bufferType = "DYNAMIC_DRAW";
+            var initialCapacity = this.bufferOrchestrator.capacity;
+            this.bufferManagersCompMap = new Map([
+                ["screenCoordinates", {
+                        'bufferManager': new account_1.BufferManager(gl, 2, { bufferType: bufferType, initialCapacity: initialCapacity }),
+                        'adaptor': function (item) { return new Float32Array([item.x, item.y]); }
+                    }],
+                ["pixelRadiusRatioSmall", {
+                        'bufferManager': new account_1.BufferManager(gl, 1, { bufferType: bufferType, initialCapacity: initialCapacity }),
+                        'adaptor': function (item) { return new Float32Array([item.properties.pixelRadiusRatioSmall]); }
+                    }],
+                ["pixelRadiusRatioBig", {
+                        'bufferManager': new account_1.BufferManager(gl, 1, { bufferType: bufferType, initialCapacity: initialCapacity }),
+                        'adaptor': function (item) { return new Float32Array([item.properties.pixelRadiusRatioBig]); }
+                    }],
+                ["rgba", {
+                        'bufferManager': new account_1.BufferManager(gl, 4, { bufferType: bufferType, initialCapacity: initialCapacity }),
+                        'adaptor': function (item) { return new Float32Array(item.properties.rgba); }
+                    }],
+            ]);
+            var obj_1 = function (bufferManagerComp) {
+                return { 'buffer': bufferManagerComp.bufferManager.buffer, 'stride': 0, 'offset': 0 };
+            };
+            this.paddingVao = (_a = this.paddingProgram).createVAO.apply(_a, ['screenCoordinates', 'pixelRadiusRatioSmall', 'pixelRadiusRatioBig', 'rgba'].map(function (key) { return obj_1(_this.bufferManagersCompMap.get(key)); }));
+        }
+    };
+    PixelPaddingCompassPlugin.prototype._createTextWriter = function () {
+        this.writer = new compass_text_writer_1.PixelPaddingCompassTextWriter(this.globe, __assign({ angle: PaddingAngle }, this._font_hold));
+    };
+    PixelPaddingCompassPlugin.prototype.resize = function () {
+        var _a;
+        (_a = this.writer) === null || _a === void 0 ? void 0 : _a.resize();
+    };
+    PixelPaddingCompassPlugin.prototype.__insertText = function (key, x, y, _a) {
+        var _b = _a === void 0 ? {} : _a, properties = _b.properties, _c = _b.update, update = _c === void 0 ? false : _c;
+        if (!this.writer)
+            return;
+        if (update) {
+            var radius = void 0;
+            if (properties != null && properties.pixelRadiusRatioBig) {
+                radius = properties.pixelRadiusRatioBig * this.radiusMultiplier;
+            }
+            else {
+                radius = this.defaultProperties.pixelRadiusRatioBig * this.radiusMultiplier;
+            }
+            this.writer.insertTextItem(key, x, y, radius + textGapFit);
+        }
+        else {
+            this.writer.insertTextItem(key, x, y);
+        }
+    };
+    // Globe API interface methods
+    PixelPaddingCompassPlugin.prototype.draw2D = function () {
+        var _this = this;
+        var _a;
+        var _b = this, gl = _b.gl, globe = _b.globe, paddingProgram = _b.paddingProgram, paddingVao = _b.paddingVao, bufferOrchestrator = _b.bufferOrchestrator, bufferManagersCompMap = _b.bufferManagersCompMap;
+        var is3D = globe.api_GetCurrentGeometry() === 0;
+        if (is3D)
+            return;
+        var items = this.compassMap.query(globe, this.writer);
+        if (items.length === 0)
+            return;
+        bufferOrchestrator.flush();
+        bufferOrchestrator.insertBulk(items, bufferManagersCompMap);
+        items.forEach(function (v) {
+            _this.__insertText(v.key, v.x, v.y);
+        });
+        gl.disable(gl.DEPTH_TEST);
+        paddingProgram.draw(paddingVao, bufferOrchestrator.length, this._opacity);
+        gl.enable(gl.DEPTH_TEST);
+        (_a = this.writer) === null || _a === void 0 ? void 0 : _a.draw();
+    };
+    PixelPaddingCompassPlugin.prototype.free = function () {
+        this.compassMap.free();
+        var _a = this, globe = _a.globe, gl = _a.gl, paddingVao = _a.paddingVao;
+        gl.deleteVertexArray(paddingVao);
+        pixel_padding_for_compass_1.PixelPaddingForFlatCompassCache.release(globe);
+        this.bufferManagersCompMap.forEach(function (v) {
+            v.bufferManager.free();
+        });
+    };
+    PixelPaddingCompassPlugin.prototype.resize = function () {
+        this.radiusMultiplier = this._shorterDimension() * 0.5;
+        this._reinsertAllText();
+    };
+    PixelPaddingCompassPlugin.prototype._reinsertAllText = function () {
+        var _this = this;
+        this.compassMap.query(this.globe, this.writer).forEach(function (v) {
+            _this.__insertText(v.key, v.x, v.y, { properties: v.properties, update: true });
+        });
+    };
+    PixelPaddingCompassPlugin.prototype._shorterDimension = function () {
+        var globe = this.globe;
+        return Math.min(globe.api_ScrW(), globe.api_ScrH());
+    };
+    return PixelPaddingCompassPlugin;
+}());
+exports.PixelPaddingCompassPlugin = PixelPaddingCompassPlugin;
+var CompassMap = /** @class */ (function () {
+    function CompassMap(parent) {
+        this.coordsMemory = new Map();
+        this.propertyMemory = new Map();
+        this.parent = parent;
+    }
+    CompassMap.prototype.insert = function (key, long, lat, properties) {
+        if (properties === void 0) { properties = null; }
+        this.coordsMemory.set(key, [long, lat]);
+        if (properties)
+            this.propertyMemory.set(key, properties);
+    };
+    CompassMap.prototype.delete = function (key) {
+        this.coordsMemory.delete(key);
+        this.propertyMemory.delete(key);
+    };
+    CompassMap.prototype.free = function () {
+        this.coordsMemory.clear();
+        this.propertyMemory.clear();
+        this.coordsMemory = null;
+        this.propertyMemory = null;
+    };
+    CompassMap.prototype.query = function (globe, writer) {
+        var _a = this, coordsMemory = _a.coordsMemory, propertyMemory = _a.propertyMemory;
+        var defaultProperties = this.parent.defaultProperties;
+        var result = [];
+        coordsMemory.forEach(function (v, k, c) {
+            var _a = globe.api_GetScreenPointFromGeo({
+                long: v[0],
+                lat: v[1],
+                z: 0,
+            }), x = _a.x, y = _a.y;
+            writer === null || writer === void 0 ? void 0 : writer.insertTextItem(k, x, y);
+            if (x !== null) {
+                var properties = __assign(__assign({}, defaultProperties), propertyMemory.get(k));
+                result.push({ key: k, x: x, y: y, properties: properties });
+            }
+        });
+        return result;
+    };
+    return CompassMap;
+}());
+function isOnTheScreen(globe, points) { }

package/compass-rose/compass-text-writer.js

@@ -0,0 +1,161 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PixelPaddingCompassTextWriter = void 0;
+var webglobe_1 = require("@pirireis/webglobe");
+// const defaultStyle = {
+//     textFont: {
+//         name: 'Arial',
+//         textColor: '#FFFFFF', // beyaz
+//         hollowColor: '#000000', // siyah
+//         size: 12, // piksel
+//         hollow: true,
+//         bold: true,
+//         italic: false,
+//     },
+//     opacity: 1.0,
+//     zMode: CSZMode.Z_GROUND_PERVERTEX,
+// }
+/**
+ * TODOs:
+ * 1) update all if initials change (propably need a context and a callback to iterate over data)
+ * 2) expose a mechanic to update text on zoom change
+ * 3) extend the mechanic on 2 to other events
+ */
+var yGapFit = -2;
+var xGapFit = -5;
+var PixelPaddingCompassTextWriter = /** @class */ (function () {
+    function PixelPaddingCompassTextWriter(globe, _a) {
+        var _b = _a === void 0 ? {} : _a, _c = _b.font, font = _c === void 0 ? {
+            name: 'Arial',
+            textColor: '#FFFFFF', // beyaz
+            hollowColor: '#000000', // siyah
+            size: 12, // piksel
+            hollow: true,
+            bold: true,
+            italic: false,
+        } : _c, _d = _b.northFont, northFont = _d === void 0 ? {
+            name: 'Arial',
+            textColor: '#BB0000', // beyaz
+            hollowColor: '#000000', // siyah
+            size: 14, // piksel
+            hollow: true,
+            bold: true,
+            italic: false,
+        } : _d, _e = _b.doDraw, doDraw = _e === void 0 ? true : _e, _f = _b.angle, angle = _f === void 0 ? 30 : _f;
+        this.globe = globe;
+        this.itemMap = new Map();
+        this.font = font;
+        this.northFont = northFont;
+        this.doDraw = doDraw;
+        this.angle = angle;
+        this.angles = [];
+        this.texts = [];
+        this.positions = [];
+        var currentAngle = 0;
+        while (currentAngle < 360) {
+            if (currentAngle > 180) {
+                this.positions.push(webglobe_1.CSMeasureTextPositionTypes.CENTER);
+            }
+            else {
+                this.positions.push(null);
+            }
+            this.angles.push(currentAngle);
+            if (currentAngle == 0) {
+                this.texts.push("K");
+            }
+            else {
+                // to string 3 chars fill left with 0
+                this.texts.push(currentAngle.toString().padStart(3, '0'));
+            }
+            currentAngle += this.angle;
+        }
+        this._lastNorthAngle = globe.api_GetCurrentLookInfo()["NorthAng"] * (Math.PI / 180);
+        this.offsets = this.__offset(this._lastNorthAngle);
+    }
+    PixelPaddingCompassTextWriter.prototype.setKeyAdaptor = function (adaptor) {
+        this.keyAdaptor = adaptor;
+    };
+    PixelPaddingCompassTextWriter.prototype.setDoDraw = function (bool) {
+        this.doDraw = bool;
+    };
+    PixelPaddingCompassTextWriter.prototype.setFont = function (font) {
+        this.font = font;
+    };
+    PixelPaddingCompassTextWriter.prototype.setNorthFont = function (font) {
+        this.northFont = font;
+    };
+    PixelPaddingCompassTextWriter.prototype.setOpacity = function (opacity) {
+        this.opacity = opacity;
+    };
+    PixelPaddingCompassTextWriter.prototype._checkSetOffsets = function () {
+        var globe = this.globe;
+        var newAngle = globe.api_GetCurrentLookInfo()["NorthAng"] * (Math.PI / 180);
+        ;
+        if (newAngle !== this._lastNorthAngle) {
+            this._lastNorthAngle = newAngle;
+            this.offsets = this.__offset();
+        }
+    };
+    PixelPaddingCompassTextWriter.prototype.draw = function () {
+        if (!this.doDraw)
+            return;
+        var _a = this, globe = _a.globe, font = _a.font, opacity_ = _a.opacity, northFont = _a.northFont, itemMap = _a.itemMap, texts = _a.texts, angles = _a.angles, positions = _a.positions;
+        this._checkSetOffsets(); //  zMode: CSZMode.Z_GROUND_PERVERTEX,
+        var offsets = this.offsets;
+        var _loop_1 = function (key, center, radius, opacity) {
+            var o = opacity === null ? opacity_ : opacity * opacity_;
+            if (center.x !== null && center.y !== null) {
+                offsets.forEach(function (_a, i) {
+                    var offsetX = _a.offsetX, offsetY = _a.offsetY;
+                    var text = texts[i];
+                    var angle = angles[i];
+                    font.position = positions[i];
+                    if (angle === 0) {
+                        globe.api_DrawContextTextMultiLine(text, northFont, o, { x: center.x + offsetX * radius + xGapFit, y: center.y + offsetY * radius + yGapFit });
+                    }
+                    else {
+                        globe.api_DrawContextTextMultiLine(text, font, o, { x: center.x + offsetX * radius + xGapFit, y: center.y + offsetY * radius + yGapFit });
+                    }
+                });
+            }
+        };
+        for (var _i = 0, itemMap_1 = itemMap; _i < itemMap_1.length; _i++) {
+            var _b = itemMap_1[_i], key = _b[0], _c = _b[1], center = _c.center, radius = _c.radius, _d = _c.opacity, opacity = _d === void 0 ? null : _d;
+            _loop_1(key, center, radius, opacity);
+        }
+    };
+    PixelPaddingCompassTextWriter.prototype.insertTextItem = function (key, x, y, radius) {
+        if (radius === void 0) { radius = undefined; }
+        var item = this.getItem(key);
+        item.center = { x: x, y: y };
+        if (radius === undefined)
+            return;
+        if (item.radius != undefined && item.radius === radius)
+            return;
+        item.radius = radius;
+    };
+    PixelPaddingCompassTextWriter.prototype.getItem = function (key) {
+        if (!this.itemMap.has(key))
+            this.itemMap.set(key, {});
+        return this.itemMap.get(key);
+    };
+    PixelPaddingCompassTextWriter.prototype.__calculateOffset = function (angle) {
+        var rAngle = (angle - 90) * (Math.PI / 180);
+        return { offsetX: Math.cos(rAngle + this._lastNorthAngle), offsetY: Math.sin(rAngle + this._lastNorthAngle) };
+    };
+    PixelPaddingCompassTextWriter.prototype.__offset = function () {
+        var angle = this.angle;
+        var offsets = [];
+        var currentAngle = 0;
+        while (currentAngle < 360) {
+            offsets.push(this.__calculateOffset(currentAngle));
+            currentAngle += angle;
+        }
+        return offsets;
+    };
+    PixelPaddingCompassTextWriter.prototype.clear = function () {
+        this.itemMap.clear();
+    };
+    return PixelPaddingCompassTextWriter;
+}());
+exports.PixelPaddingCompassTextWriter = PixelPaddingCompassTextWriter;

package/compass-rose/index.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PixelPaddingCompassTextWriter = exports.PixelPaddingCompassPlugin = void 0;
+var compass_text_writer_1 = require("./compass-text-writer");
+Object.defineProperty(exports, "PixelPaddingCompassTextWriter", { enumerable: true, get: function () { return compass_text_writer_1.PixelPaddingCompassTextWriter; } });
+var compass_rose_padding_flat_1 = require("./compass-rose-padding-flat");
+Object.defineProperty(exports, "PixelPaddingCompassPlugin", { enumerable: true, get: function () { return compass_rose_padding_flat_1.PixelPaddingCompassPlugin; } });