bruce-cesium 2.1.7 → 2.1.9

package/dist/lib/rendering/render-managers/common/point-clustering.js

@@ -0,0 +1,809 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PointClustering = void 0;
+var bruce_models_1 = require("bruce-models");
+var Cesium = require("cesium");
+function GetValue(viewer, obj) {
+    if (obj === null || obj === void 0 ? void 0 : obj.getValue) {
+        return obj.getValue(viewer.scene.lastRenderTime);
+    }
+    return obj;
+}
+var Point = /** @class */ (function () {
+    function Point(lon, lat, id) {
+        this.lon = lon;
+        this.lat = lat;
+        this.id = id;
+    }
+    return Point;
+}());
+var Circle = /** @class */ (function () {
+    function Circle(x, y, radius) {
+        this.x = x;
+        this.y = y;
+        this.radius = radius;
+        this.width = 2 * radius;
+        this.height = 2 * radius;
+    }
+    Circle.prototype.Intersects = function (range) {
+        var xDist = Math.abs(range.x - this.x);
+        var yDist = Math.abs(range.y - this.y);
+        var r = this.radius;
+        var w = range.width;
+        var h = range.height;
+        if (xDist > (w + r) || yDist > (h + r)) {
+            return false;
+        }
+        if (xDist <= w || yDist <= h) {
+            return true;
+        }
+        var dx = xDist - w;
+        var dy = yDist - h;
+        return (dx * dx + dy * dy <= this.radius * this.radius);
+    };
+    Circle.prototype.Contains = function (point) {
+        var dx = this.x - point.lon;
+        var dy = this.y - point.lat;
+        var distance = Math.sqrt(dx * dx + dy * dy);
+        return distance <= this.radius;
+    };
+    return Circle;
+}());
+var Rectangle = /** @class */ (function () {
+    function Rectangle(x, y, w, h) {
+        this.x = x;
+        this.y = y;
+        this.w = w;
+        this.h = h;
+        this.width = 2 * w;
+        this.height = 2 * h;
+    }
+    Rectangle.prototype.Contains = function (point) {
+        return (point.lon >= this.x - this.w &&
+            point.lon < this.x + this.w &&
+            point.lat >= this.y - this.h &&
+            point.lat < this.y + this.h);
+    };
+    Rectangle.prototype.Intersects = function (range) {
+        return !(range.x - range.w > this.x + this.w ||
+            range.x + range.w < this.x - this.w ||
+            range.y - range.h > this.y + this.h ||
+            range.y + range.h < this.y - this.h);
+    };
+    return Rectangle;
+}());
+var Quad = /** @class */ (function () {
+    function Quad(boundary, capacity) {
+        this.boundary = boundary;
+        this.capacity = capacity;
+        this.points = [];
+        this.divided = false;
+    }
+    Quad.prototype.Subdivide = function () {
+        var x = this.boundary.x;
+        var y = this.boundary.y;
+        var w = this.boundary.w / 2;
+        var h = this.boundary.h / 2;
+        var ne = new Rectangle(x + w / 2, y - h / 2, w, h);
+        this.northeast = new Quad(ne, this.capacity);
+        var nw = new Rectangle(x - w / 2, y - h / 2, w, h);
+        this.northwest = new Quad(nw, this.capacity);
+        var se = new Rectangle(x + w / 2, y + h / 2, w, h);
+        this.southeast = new Quad(se, this.capacity);
+        var sw = new Rectangle(x - w / 2, y + h / 2, w, h);
+        this.southwest = new Quad(sw, this.capacity);
+        this.divided = true;
+    };
+    Quad.prototype.Insert = function (point) {
+        if (!this.boundary.Contains(point)) {
+            return false;
+        }
+        if (this.points.length < this.capacity) {
+            this.points.push(point);
+            return true;
+        }
+        if (!this.divided) {
+            this.Subdivide();
+        }
+        return (this.northeast.Insert(point) || this.northwest.Insert(point) ||
+            this.southeast.Insert(point) || this.southwest.Insert(point));
+    };
+    Quad.prototype.Query = function (range, found) {
+        if (!found) {
+            found = [];
+        }
+        if (!range.Intersects(this.boundary)) {
+            return found;
+        }
+        for (var _i = 0, _a = this.points; _i < _a.length; _i++) {
+            var p = _a[_i];
+            if (range.Contains(p)) {
+                found.push(p);
+            }
+        }
+        if (this.divided) {
+            this.northwest.Query(range, found);
+            this.northeast.Query(range, found);
+            this.southwest.Query(range, found);
+            this.southeast.Query(range, found);
+        }
+        return found;
+    };
+    Quad.prototype.Find = function (id) {
+        for (var _i = 0, _a = this.points; _i < _a.length; _i++) {
+            var point = _a[_i];
+            if (point.id === id) {
+                return point;
+            }
+        }
+        if (this.divided) {
+            return this.northwest.Find(id) || this.northeast.Find(id) ||
+                this.southwest.Find(id) || this.southeast.Find(id);
+        }
+        return null;
+    };
+    Quad.prototype.Remove = function (point) {
+        var index = this.points.indexOf(point);
+        if (index !== -1) {
+            this.points.splice(index, 1);
+        }
+        if (this.divided) {
+            this.northwest.Remove(point);
+            this.northeast.Remove(point);
+            this.southwest.Remove(point);
+            this.southeast.Remove(point);
+        }
+    };
+    return Quad;
+}());
+var _clusterImageCache = new bruce_models_1.LRUCache(500);
+var _clusterImageLoadedCache = new bruce_models_1.LRUCache(500);
+function _loadClusterImage(params) {
+    return __awaiter(this, void 0, void 0, function () {
+        var size, txtColor, bgColor, text, iconUrl, key, cacheData, prom;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    size = params.size, txtColor = params.txtColor, bgColor = params.bgColor, text = params.text, iconUrl = params.iconUrl;
+                    key = "".concat(size, "-").concat(txtColor, "-").concat(bgColor, "-").concat(text, "-").concat(iconUrl);
+                    cacheData = _clusterImageCache.Get(key);
+                    if (!cacheData) return [3 /*break*/, 2];
+                    return [4 /*yield*/, cacheData];
+                case 1: return [2 /*return*/, _a.sent()];
+                case 2:
+                    prom = new Promise(function (res, rej) {
+                        var canvas = document.createElement("canvas");
+                        canvas.width = size;
+                        canvas.height = size;
+                        var ctx = canvas.getContext("2d");
+                        var drawWithoutImage = function (img) {
+                            ctx.beginPath();
+                            ctx.arc(size / 2, size / 2, size / 2, 0, 2 * Math.PI, false);
+                            var fill = null;
+                            var txt = null;
+                            if (img) {
+                                var brightness = calculateImageBrightness(img);
+                                // brightness < 128 = light background.
+                                fill = brightness < 128 ? "white" : "#114d78";
+                                txt = brightness < 128 ? "black" : "white";
+                            }
+                            else {
+                                fill = bgColor ? bgColor : "#114d78";
+                                txt = txtColor ? txtColor : "white";
+                            }
+                            ctx.fillStyle = fill;
+                            ctx.fill();
+                            var maxTextWidth = size * 0.8;
+                            var maxTextHeight = size * 0.8;
+                            var minTextSize = Math.floor(size / 10);
+                            var textSize = findOptimalFontSize(text, maxTextWidth, maxTextHeight, minTextSize);
+                            ctx.font = "bold ".concat(textSize, "px Arial");
+                            ctx.fillStyle = txt;
+                            ctx.textAlign = "center";
+                            ctx.textBaseline = "middle";
+                            ctx.fillText(text, size / 2, size / 2);
+                        };
+                        var drawWithImage = function (img) {
+                            var aspectRatio = img.width / img.height;
+                            var imageSize = Math.min(size / 2, img.width, img.height);
+                            if (imageSize / aspectRatio > size / 2) {
+                                imageSize = (size / 2) * aspectRatio;
+                            }
+                            var imageX = (size - imageSize) / 2;
+                            var imageY = (size - imageSize) / 2 - imageSize / 3;
+                            ctx.beginPath();
+                            ctx.arc(size / 2, size / 2, size / 2, 0, 2 * Math.PI, false);
+                            var brightness = calculateImageBrightness(img);
+                            var bgColor = brightness < 128 ? "white" : "#114d78";
+                            var txtColor = brightness < 128 ? "black" : "white";
+                            ctx.fillStyle = bgColor;
+                            ctx.fill();
+                            ctx.shadowColor = "rgba(0, 0, 0, 0.3)";
+                            ctx.shadowOffsetX = 3;
+                            ctx.shadowOffsetY = 3;
+                            ctx.shadowBlur = 5;
+                            ctx.drawImage(img, imageX, imageY, imageSize, imageSize);
+                            var padding = imageSize / 6;
+                            var maxTextWidth = imageSize;
+                            var maxTextHeight = imageSize - padding;
+                            var minTextSize = Math.floor(imageSize / 5);
+                            var textSize = findOptimalFontSize(text, maxTextWidth, maxTextHeight, minTextSize);
+                            ctx.font = "bold ".concat(textSize, "px Arial");
+                            ctx.fillStyle = txtColor;
+                            ctx.textAlign = "center";
+                            ctx.textBaseline = "top";
+                            ctx.shadowColor = "rgba(0, 0, 0, 0)";
+                            ctx.shadowOffsetX = 0;
+                            ctx.shadowOffsetY = 0;
+                            ctx.shadowBlur = 0;
+                            ctx.fillText(text, size / 2, imageY + imageSize + padding);
+                        };
+                        var findOptimalFontSize = function (text, maxWidth, maxHeight, minSize) {
+                            var fontSize = maxHeight;
+                            var tempCanvas = document.createElement("canvas");
+                            var tempCtx = tempCanvas.getContext("2d");
+                            while (fontSize > minSize) {
+                                tempCtx.font = "bold ".concat(fontSize, "px Arial");
+                                var measuredWidth = tempCtx.measureText(text).width;
+                                var measuredHeight = fontSize * 1.2; // Allowing some padding
+                                if (measuredWidth <= maxWidth && measuredHeight <= maxHeight) {
+                                    break;
+                                }
+                                fontSize--;
+                            }
+                            return fontSize;
+                        };
+                        var calculateImageBrightness = function (img) {
+                            var brightness = 0;
+                            var tempCanvas = document.createElement("canvas");
+                            tempCanvas.width = img.width;
+                            tempCanvas.height = img.height;
+                            var tempCtx = tempCanvas.getContext("2d");
+                            tempCtx.drawImage(img, 0, 0);
+                            var imageData = tempCtx.getImageData(0, 0, img.width, img.height).data;
+                            for (var i = 0; i < imageData.length; i += 4) {
+                                var r = imageData[i];
+                                var g = imageData[i + 1];
+                                var b = imageData[i + 2];
+                                brightness += (r + g + b) / 3;
+                            }
+                            return Math.round(brightness / (img.width * img.height));
+                        };
+                        if (iconUrl) {
+                            var img_1 = new Image();
+                            img_1.crossOrigin = "anonymous";
+                            img_1.src = iconUrl;
+                            img_1.onload = function () {
+                                if (size > 50) {
+                                    drawWithImage(img_1);
+                                }
+                                else {
+                                    drawWithoutImage(img_1);
+                                }
+                                res(canvas);
+                            };
+                            img_1.onerror = function () {
+                                drawWithoutImage();
+                                res(canvas);
+                            };
+                        }
+                        else {
+                            drawWithoutImage();
+                            res(canvas);
+                        }
+                    });
+                    _clusterImageCache.Set(key, prom);
+                    prom.then(function (canvas) {
+                        _clusterImageLoadedCache.Set(key, canvas);
+                        _clusterImageCache.Set(key, null);
+                    });
+                    return [4 /*yield*/, prom];
+                case 3: return [2 /*return*/, _a.sent()];
+            }
+        });
+    });
+}
+function getClusterImage(params) {
+    var size = params.size, txtColor = params.txtColor, bgColor = params.bgColor, text = params.text, iconUrl = params.iconUrl;
+    var key = "".concat(size, "-").concat(txtColor, "-").concat(bgColor, "-").concat(text, "-").concat(iconUrl);
+    var cacheData = _clusterImageLoadedCache.Get(key);
+    // If available then return.
+    if (cacheData) {
+        return cacheData;
+    }
+    // If not available then queue for it to cook.
+    else {
+        _loadClusterImage(params);
+    }
+    return null;
+}
+var PointClustering = /** @class */ (function () {
+    function PointClustering(register, menuItemId) {
+        var _this = this;
+        this.disposed = false;
+        this.registeredEntityIds = new Set();
+        this.register = register;
+        this.viewer = register.Viewer;
+        this.menuItemId = menuItemId;
+        this.updateClusterSpacing(0);
+        var boundary = new Rectangle(0, 0, 360, 180);
+        this.quadTree = new Quad(boundary, 4);
+        this.prevClusteredEntities = new Set();
+        this.currClusteredEntities = new Set();
+        this.clusterEntities = new Map();
+        this.updateQueue = new bruce_models_1.DelayQueue(function () {
+            _this.doUpdate();
+        }, 1000);
+        this.listenCamera();
+    }
+    /**
+     * Starts listening to camera changes.
+     * This will trigger the clustering update whenever camera is moved.
+     */
+    PointClustering.prototype.listenCamera = function () {
+        var _this = this;
+        var viewer = this.viewer;
+        var lastPos3d;
+        var hasMoved = function () {
+            var _a;
+            var cameraPos = (_a = viewer === null || viewer === void 0 ? void 0 : viewer.camera) === null || _a === void 0 ? void 0 : _a.positionCartographic;
+            if (!cameraPos) {
+                return false;
+            }
+            var pos3d = Cesium.Cartographic.toCartesian(cameraPos);
+            if (!lastPos3d) {
+                lastPos3d = pos3d;
+                return false;
+            }
+            var distance = Cesium.Cartesian3.distance(pos3d, lastPos3d);
+            lastPos3d = pos3d;
+            // 50 meter movement at least.
+            return distance > 50;
+        };
+        this.listenCameraRemoval = viewer.scene.camera.changed.addEventListener(function () {
+            if (hasMoved()) {
+                _this.updateQueue.Call();
+            }
+        });
+    };
+    /**
+     * Stops listening to camera changes.
+     */
+    PointClustering.prototype.unlistenCamera = function () {
+        if (this.listenCameraRemoval) {
+            this.listenCameraRemoval();
+            this.listenCameraRemoval = null;
+        }
+    };
+    /**
+     * Removes all clusters and updates entities to no longer be suppressed.
+     * @returns
+     */
+    PointClustering.prototype.Dispose = function () {
+        if (this.disposed) {
+            return;
+        }
+        for (var _i = 0, _a = Array.from(this.clusterEntities); _i < _a.length; _i++) {
+            var _b = _a[_i], entity = _b[1];
+            this.viewer.entities.remove(entity);
+        }
+        this.clusterEntities.clear();
+        this.unlistenCamera();
+        this.disposed = true;
+        // Restore entities.
+        var toUpdateIds = [];
+        for (var _c = 0, _d = Array.from(this.registeredEntityIds); _c < _d.length; _c++) {
+            var id = _d[_c];
+            var rego = this.register.GetRego({
+                entityId: id,
+                menuItemId: this.menuItemId
+            });
+            if (rego && rego.suppressShow) {
+                rego.suppressShow = false;
+                toUpdateIds.push(id);
+            }
+        }
+        if (toUpdateIds.length) {
+            this.register.ForceUpdate({
+                entityIds: toUpdateIds,
+            });
+        }
+    };
+    /**
+     * Calculates center of given points.
+     * @param points
+     * @returns
+     */
+    PointClustering.prototype.calculateCentroid = function (points) {
+        var lonSum = 0;
+        var latSum = 0;
+        for (var _i = 0, points_1 = points; _i < points_1.length; _i++) {
+            var point = points_1[_i];
+            lonSum += point.lon;
+            latSum += point.lat;
+        }
+        var lonAvg = lonSum / points.length;
+        var latAvg = latSum / points.length;
+        return new Point(lonAvg, latAvg, "");
+    };
+    /**
+     * Gathers current clusters and renders them.
+     * @returns
+     */
+    PointClustering.prototype.doUpdate = function () {
+        var _this = this;
+        if (this.disposed) {
+            return;
+        }
+        // 1: Update precision.
+        // This defines how far apart these clusters can be.
+        var cameraHeight = this.viewer.camera.positionCartographic.height;
+        this.updateClusterSpacing(cameraHeight);
+        // 2: Get clusters.
+        var _a = this.getClusters(), clusters = _a.clusters, noLongerClustered = _a.noLongerClustered;
+        // 3: Remove all cesium cluster entities that are no longer clustered.
+        for (var _i = 0, _b = Array.from(noLongerClustered); _i < _b.length; _i++) {
+            var id = _b[_i];
+            this.removeClusterEntity(id);
+        }
+        // 4: Stop hiding entities that are no longer clustered.
+        var previousEntityIds = new Set(this.registeredEntityIds);
+        for (var _c = 0, _d = Array.from(previousEntityIds); _c < _d.length; _c++) {
+            var id = _d[_c];
+            if (!this.currClusteredEntities.has(id)) {
+                var rego = this.register.GetRego({
+                    entityId: id,
+                    menuItemId: this.menuItemId
+                });
+                if (rego && rego.suppressShow) {
+                    rego.suppressShow = false;
+                    this.register.ForceUpdate({
+                        entityIds: [id],
+                    });
+                }
+            }
+        }
+        var getScale = function (count) {
+            var baseSize = 20;
+            var scalingFactor = 2;
+            var scale = baseSize + scalingFactor * (count - 1);
+            scale = Math.min(scale, 120);
+            return scale;
+        };
+        /**
+         * Generate circle with label in center.
+         * @param count
+         * @returns
+         */
+        var getCanvas = function (count) {
+            var params = {
+                size: getScale(count),
+                txtColor: _this.pointColorTxt,
+                bgColor: _this.pointColorBg,
+                text: String(count),
+                iconUrl: _this.iconUrl
+            };
+            return getClusterImage(params);
+        };
+        var _loop_1 = function (cluster) {
+            var clusterId = cluster.center.id;
+            var clusterEntity = this_1.clusterEntities.get(clusterId);
+            var centroid = this_1.calculateCentroid(cluster.points);
+            var count = cluster.points.length;
+            if (clusterEntity) {
+                clusterEntity.position = Cesium.Cartesian3.fromDegrees(centroid.lon, centroid.lat, 150);
+                clusterEntity.billboard.image = new Cesium.CallbackProperty(function () {
+                    return getCanvas(count);
+                }, false),
+                    clusterEntity.billboard.width = getScale(cluster.points.length);
+                clusterEntity.billboard.height = getScale(cluster.points.length);
+            }
+            else {
+                clusterEntity = this_1.viewer.entities.add({
+                    position: Cesium.Cartesian3.fromDegrees(centroid.lon, centroid.lat, 150),
+                    billboard: {
+                        heightReference: Cesium.HeightReference.NONE,
+                        image: new Cesium.CallbackProperty(function () {
+                            return getCanvas(count);
+                        }, false),
+                        width: getScale(count),
+                        height: getScale(count),
+                        verticalOrigin: Cesium.VerticalOrigin.CENTER,
+                        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
+                        disableDepthTestDistance: Number.POSITIVE_INFINITY
+                    }
+                });
+                this_1.clusterEntities.set(clusterId, clusterEntity);
+            }
+            for (var i = 0; i < cluster.points.length; i++) {
+                var entityId = cluster.points[i].id;
+                var rego = this_1.register.GetRego({
+                    entityId: entityId,
+                    menuItemId: this_1.menuItemId
+                });
+                if (rego && !rego.suppressShow) {
+                    rego.suppressShow = true;
+                    this_1.register.ForceUpdate({
+                        entityIds: [entityId],
+                    });
+                }
+            }
+        };
+        var this_1 = this;
+        // 5: iterate over clusters and add/update them as Cesium entities.
+        for (var _e = 0, clusters_1 = clusters; _e < clusters_1.length; _e++) {
+            var cluster = clusters_1[_e];
+            _loop_1(cluster);
+        }
+        var _loop_2 = function (clusterId, clusterEntity) {
+            if (!clusters.find(function (x) { return x.center.id == clusterId; })) {
+                this_2.viewer.entities.remove(clusterEntity);
+                this_2.clusterEntities.delete(clusterId);
+            }
+        };
+        var this_2 = this;
+        // 6: Iterate over existing cluster entities and remove those that are no longer clustered.
+        for (var _f = 0, _g = Array.from(this.clusterEntities); _f < _g.length; _f++) {
+            var _h = _g[_f], clusterId = _h[0], clusterEntity = _h[1];
+            _loop_2(clusterId, clusterEntity);
+        }
+    };
+    /**
+     * Updates how apart clusters can be based on camera distance.
+     * @param cameraHeight
+     */
+    PointClustering.prototype.updateClusterSpacing = function (cameraHeight) {
+        // Camera height thresholds in meters.
+        var cameraHeightThresholds = [4000, 5000, 8000, 13000, 25000, 40000];
+        // Distance increments in degrees.
+        var distanceIncrements = [0.005, 0.01, 0.02, 0.04, 0.1, 0.5];
+        // Find the appropriate spacing based on the camera height.
+        var spacing = 0;
+        for (var i = 0; i < cameraHeightThresholds.length; i++) {
+            if (cameraHeight && cameraHeight < cameraHeightThresholds[i]) {
+                spacing += distanceIncrements[i];
+                break;
+            }
+            spacing += distanceIncrements[i];
+        }
+        this.distanceBetweenClusters = spacing;
+    };
+    /**
+     * Gathers clusters.
+     * @returns
+     */
+    PointClustering.prototype.getClusters = function () {
+        var _this = this;
+        this.currClusteredEntities.clear();
+        var clusters = [];
+        var processedPoints = new Set();
+        var cameraPosition = this.viewer.camera.position;
+        for (var _i = 0, _a = this.quadTree.points; _i < _a.length; _i++) {
+            var point = _a[_i];
+            // Skip points already processed in previous clusters.
+            if (processedPoints.has(point.id)) {
+                continue;
+            }
+            // Skip points closer than 4000 meters to the camera.
+            var cartesian3 = Cesium.Cartesian3.fromDegrees(point.lon, point.lat);
+            if (Cesium.Cartesian3.distance(cartesian3, cameraPosition) <= 4000) {
+                continue;
+            }
+            var found = [];
+            var nearbyPoints = this.quadTree.Query(new Circle(point.lon, point.lat, this.distanceBetweenClusters), found);
+            if (nearbyPoints.length > 1) {
+                var cluster = { center: point, points: [] };
+                for (var _b = 0, nearbyPoints_1 = nearbyPoints; _b < nearbyPoints_1.length; _b++) {
+                    var nearby = nearbyPoints_1[_b];
+                    if (!cluster.points.includes(nearby)) {
+                        cluster.points.push(nearby);
+                        processedPoints.add(nearby.id);
+                        this.currClusteredEntities.add(nearby.id);
+                    }
+                }
+                clusters.push(cluster);
+            }
+        }
+        // Filter out clusters with only one point.
+        var validClusters = clusters.filter(function (cluster) { return cluster.points.length > 1; });
+        // Merge adjacent clusters.
+        var mergedClusters = this.mergeClusters(validClusters);
+        // Get the entity IDs that are no longer clustered
+        var noLongerClustered = new Set(Array.from(this.prevClusteredEntities).filter(function (id) { return !_this.currClusteredEntities.has(id); }));
+        // Update the previous clustered entities ref.
+        this.prevClusteredEntities = new Set(this.currClusteredEntities);
+        return { clusters: mergedClusters, noLongerClustered: noLongerClustered };
+    };
+    /**
+     * Merges clusters that are nearby based on the distanceBetweenClusters value.
+     * @param clusters
+     * @returns
+     */
+    PointClustering.prototype.mergeClusters = function (clusters) {
+        var _a;
+        var mergedClusters = [].concat(clusters);
+        // Keep looping while merges keep happening.
+        var mergeOccurred = true;
+        while (mergeOccurred) {
+            mergeOccurred = false;
+            for (var i = 0; i < mergedClusters.length - 1; i++) {
+                for (var j = i + 1; j < mergedClusters.length; j++) {
+                    var cluster1 = mergedClusters[i];
+                    var cluster2 = mergedClusters[j];
+                    var centerDistance = this.calculateDistance(cluster1.center.lon, cluster1.center.lat, cluster2.center.lon, cluster2.center.lat);
+                    var distanceThreshold = this.distanceBetweenClusters;
+                    if (centerDistance <= distanceThreshold) {
+                        // Merge clusters.
+                        (_a = cluster1.points).push.apply(_a, cluster2.points);
+                        mergedClusters.splice(j, 1);
+                        this.removeClusterEntity(cluster2.center.id);
+                        mergeOccurred = true;
+                        break;
+                    }
+                }
+                if (mergeOccurred) {
+                    break;
+                }
+            }
+        }
+        return mergedClusters;
+    };
+    /**
+     * Removes Cesium cluster entity.
+     * @param clusterId
+     */
+    PointClustering.prototype.removeClusterEntity = function (clusterId) {
+        var clusterEntity = this.clusterEntities.get(clusterId);
+        if (clusterEntity) {
+            this.viewer.entities.remove(clusterEntity);
+            this.clusterEntities.delete(clusterId);
+        }
+    };
+    PointClustering.prototype.convertCartesianToCartographic = function (cartesian3) {
+        var carto = Cesium.Cartographic.fromCartesian(cartesian3);
+        var lon = Cesium.Math.toDegrees(carto.longitude);
+        var lat = Cesium.Math.toDegrees(carto.latitude);
+        var id = lon + ',' + lat;
+        return new Point(lon, lat, id);
+    };
+    /**
+     * Adds new entity to the clustering logic.
+     * @param id Bruce entity ID.
+     * @param cartesian3 entity's position.
+     */
+    PointClustering.prototype.addPoint = function (id, cartesian3) {
+        var point = this.convertCartesianToCartographic(cartesian3);
+        point.id = id;
+        this.quadTree.Insert(point);
+    };
+    /**
+     * Calculates rough distance across earth between two points.
+     * @param lon1
+     * @param lat1
+     * @param lon2
+     * @param lat2
+     * @returns
+     */
+    PointClustering.prototype.calculateDistance = function (lon1, lat1, lon2, lat2) {
+        var lonDelta = Math.abs(lon1 - lon2);
+        var latDelta = Math.abs(lat1 - lat2);
+        // Approximate radius of the Earth in kilometers
+        var earthRadius = 6371;
+        var distance = 2 * Math.asin(Math.sqrt(Math.sin(latDelta / 2) * Math.sin(latDelta / 2) +
+            Math.cos(lat1) * Math.cos(lat2) * Math.sin(lonDelta / 2) * Math.sin(lonDelta / 2))) * earthRadius;
+        return distance;
+    };
+    /**
+     * Adds entity to clustering logic.
+     * Will return false if entity could not be clustered and therefor should not be hidden.
+     * @param id
+     * @param entity
+     * @returns
+     */
+    PointClustering.prototype.AddEntity = function (id, entity) {
+        if (this.disposed) {
+            return false;
+        }
+        if (!entity) {
+            return false;
+        }
+        if (entity.polygon || entity.polyline) {
+            return false;
+        }
+        var pos3d = GetValue(this.viewer, entity.position);
+        if (!(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) {
+            return false;
+        }
+        if (!this.pointColorBg && entity.point) {
+            var pointColorBg = GetValue(this.viewer, entity.point.color);
+            if (pointColorBg) {
+                var cColor = null;
+                if (pointColorBg instanceof Object) {
+                    cColor = new Cesium.Color(pointColorBg.red, pointColorBg.green, pointColorBg.blue, pointColorBg.alpha);
+                }
+                else if (typeof pointColorBg === "string") {
+                    cColor = Cesium.Color.fromCssColorString(pointColorBg);
+                }
+                // Determine if text color should instead be black based on background.
+                // cColor contains r,g,b,a values where r,g,b are in the range [0,1].
+                if (cColor) {
+                    var brightness = (cColor.red * 299 + cColor.green * 587 + cColor.blue * 114) / 1000;
+                    if (brightness > 0.5) {
+                        this.pointColorTxt = "black";
+                    }
+                    else {
+                        this.pointColorTxt = "white";
+                    }
+                    this.pointColorBg = cColor.toCssColorString();
+                }
+            }
+        }
+        if (!this.iconUrl && entity.billboard) {
+            var iconUrl = GetValue(this.viewer, entity.billboard.image);
+            if (typeof iconUrl == "string") {
+                this.iconUrl = iconUrl;
+            }
+        }
+        this.registeredEntityIds.add(id);
+        this.addPoint(id, pos3d);
+        this.updateQueue.Call();
+        return true;
+    };
+    /**
+     * Removes entity from clustering logic.
+     * Warning: This will not reveal the entity, suppressShow will remain true.
+     * This is made with the assumption that the entity is being removed from viewer.
+     * @param id
+     * @returns
+     */
+    PointClustering.prototype.RemoveEntity = function (id) {
+        if (this.disposed) {
+            return;
+        }
+        var pointToRemove = this.quadTree.Find(id);
+        if (pointToRemove) {
+            this.quadTree.Remove(pointToRemove);
+            this.updateQueue.Call();
+        }
+        this.registeredEntityIds.delete(id);
+    };
+    return PointClustering;
+}());
+exports.PointClustering = PointClustering;
+//# sourceMappingURL=point-clustering.js.map