bruce-cesium 2.8.2 → 2.8.4

package/dist/bruce-cesium.umd.js

@@ -1739,7 +1739,7 @@
                                 type: type,
                                 defaultToId: false
                             });
-                            return [2 /*return*/, name_1 ? name_1 : "Unnamed entity"];
+                            return [2 /*return*/, name_1 ? name_1 : "Unnamed Entity"];
                         }
                         return [3 /*break*/, 4];
                     case 3:
@@ -1842,6 +1842,7 @@
         return zoomItem.MinZoom + "-" + zoomItem.MaxZoom + "-" + shouldApplyFlatFix(terrain);
     }
     var _fileValidationCache = {};
+    var _fileHeightCache = {};
     /**
      * @param min
      * @param max
@@ -2195,7 +2196,7 @@
         (function (Point) {
             function Render(params) {
                 return __awaiter(this, void 0, void 0, function () {
-                    var entity, style, type, cEntity, siblings, iconUrlRows, icon, iconUrl, res, e_4, iconScale, disableDepthTest, heightRef, radius, bFill, cFill, outline, cOutline, outlineWidth, bOutline, heightRef, pos3d, extrusion, outlineExtrusion, bColor, cColor, size, heightRef;
+                    var entity, style, type, cEntity, siblings, iconUrlRows, icon, iconUrl_1, res, blob_1, e_4, e_5, iconScale, disableDepthTest, heightRef, radius, bFill, cFill, outline, cOutline, outlineWidth, bOutline, heightRef, pos3d, extrusion, outlineExtrusion, bColor, cColor, size, heightRef;
                     return __generator(this, function (_a) {
                         switch (_a.label) {
                             case 0:
@@ -2210,7 +2211,7 @@
                                 }
                                 cEntity = null;
                                 siblings = [];
-                                if (!(type == bruceModels.Style.EPointType.Icon)) return [3 /*break*/, 7];
+                                if (!(type == bruceModels.Style.EPointType.Icon)) return [3 /*break*/, 12];
                                 iconUrlRows = style.iconUrl == null ? [] : style.iconUrl;
                                 iconUrlRows.forEach(function (row) {
                                     if (row.type == bruceModels.Calculator.EValueType.Color) {
@@ -2218,41 +2219,66 @@
                                     }
                                 });
                                 icon = bruceModels.Calculator.GetString(iconUrlRows, entity, params.tags);
-                                iconUrl = null;
+                                iconUrl_1 = null;
                                 if (typeof icon == "string") {
-                                    iconUrl = icon;
+                                    iconUrl_1 = icon;
                                 }
-                                if (!iconUrl && style.iconId) {
-                                    iconUrl = bruceModels.ClientFile.GetUrl({
+                                if (!iconUrl_1 && style.iconId) {
+                                    iconUrl_1 = bruceModels.ClientFile.GetUrl({
                                         api: params.api,
                                         fileId: style.iconId
                                     });
                                 }
-                                if (!iconUrl) return [3 /*break*/, 6];
+                                if (!iconUrl_1) return [3 /*break*/, 11];
                                 _a.label = 1;
                             case 1:
-                                _a.trys.push([1, 5, , 6]);
-                                if (!(_fileValidationCache[iconUrl] == null)) return [3 /*break*/, 3];
-                                return [4 /*yield*/, fetch(iconUrl)];
+                                _a.trys.push([1, 10, , 11]);
+                                if (!(_fileValidationCache[iconUrl_1] == null)) return [3 /*break*/, 8];
+                                return [4 /*yield*/, fetch(iconUrl_1)];
                             case 2:
                                 res = _a.sent();
-                                if (res.status != 200) {
-                                    iconUrl = null;
-                                }
-                                _fileValidationCache[iconUrl] = Boolean(iconUrl);
-                                return [3 /*break*/, 4];
+                                if (!(res.status != 200)) return [3 /*break*/, 3];
+                                iconUrl_1 = null;
+                                return [3 /*break*/, 7];
                             case 3:
-                                if (!_fileValidationCache[iconUrl]) {
-                                    iconUrl = null;
-                                }
-                                _a.label = 4;
-                            case 4: return [3 /*break*/, 6];
+                                _a.trys.push([3, 6, , 7]);
+                                return [4 /*yield*/, res.blob()];
+                            case 4:
+                                blob_1 = _a.sent();
+                                return [4 /*yield*/, new Promise(function (res) {
+                                        var img = new Image();
+                                        img.onload = function () {
+                                            _fileHeightCache[iconUrl_1] = img.height;
+                                            res(null);
+                                        };
+                                        img.onerror = function () {
+                                            _fileHeightCache[iconUrl_1] = undefined;
+                                            res(null);
+                                        };
+                                        img.src = URL.createObjectURL(blob_1);
+                                    })];
                             case 5:
-                                e_4 = _a.sent();
-                                iconUrl = null;
-                                return [3 /*break*/, 6];
+                                _a.sent();
+                                return [3 /*break*/, 7];
                             case 6:
-                                if (iconUrl) {
+                                e_4 = _a.sent();
+                                console.error(e_4);
+                                return [3 /*break*/, 7];
+                            case 7:
+                                _fileValidationCache[iconUrl_1] = Boolean(iconUrl_1);
+                                return [3 /*break*/, 9];
+                            case 8:
+                                if (!_fileValidationCache[iconUrl_1]) {
+                                    iconUrl_1 = null;
+                                }
+                                _a.label = 9;
+                            case 9: return [3 /*break*/, 11];
+                            case 10:
+                                e_5 = _a.sent();
+                                iconUrl_1 = null;
+                                return [3 /*break*/, 11];
+                            case 11:
+                                if (iconUrl_1) {
                                     iconScale = EnsureNumber(bruceModels.Calculator.GetNumber(style.iconScale, entity, params.tags));
                                     if (!iconScale && iconScale != 0) {
                                         iconScale = 1;
@@ -2264,11 +2290,12 @@
                                             billboard: {
                                                 horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
                                                 verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
-                                                image: iconUrl,
+                                                image: iconUrl_1,
                                                 heightReference: getHeightRef(style),
                                                 scale: iconScale,
                                                 disableDepthTestDistance: disableDepthTest ? Number.POSITIVE_INFINITY : undefined,
                                                 distanceDisplayCondition: getDisplayCondition(params.minDistance, params.maxDistance),
+                                                height: _fileHeightCache[iconUrl_1]
                                                 // Would be great once we have a setting for this.
                                                 // translucencyByDistance: getTranslucencyByDistance(params.minDistance, params.maxDistance),
                                             },
@@ -2282,8 +2309,8 @@
                                         });
                                     }
                                 }
-                                _a.label = 7;
-                            case 7:
+                                _a.label = 12;
+                            case 12:
                                 if (type == bruceModels.Style.EPointType.Cylinder) {
                                     radius = EnsureNumber(bruceModels.Calculator.GetNumber(style.CylinderRadius, entity, params.tags));
                                     if (radius <= 0) {
@@ -3686,6 +3713,366 @@
         })(Parabola = RelationRenderEngine.Parabola || (RelationRenderEngine.Parabola = {}));
     })(RelationRenderEngine || (RelationRenderEngine = {}));
 
+    /**
+     * Returns cesium property's value.
+     * This will check if it's one that changes over time, or just a fixed value.
+     * Eg: const pos3d = getValue<Cesium.Cartesian3>(cViewer, cEntity.point.position);
+     * @param viewer
+     * @param obj
+    */
+    function getValue$1(viewer, obj) {
+        if (obj === null || obj === void 0 ? void 0 : obj.getValue) {
+            return obj.getValue(viewer.scene.lastRenderTime);
+        }
+        return obj;
+    }
+    (function (EntityLabel) {
+        // Key where the label instance is stored within the cesium entity.
+        // Eg: rego[ATTACH_KEY] = new EntityLabel(...);
+        EntityLabel.ATTACH_KEY = "nextspace-navigator-entity-label";
+        var Label = /** @class */ (function () {
+            function Label(params) {
+                var _this = this;
+                // The label element itself.
+                this.label = null;
+                // Callback to kill render listener.
+                this.renderRemoval = null;
+                // Indicates the label was disposed and any actions will be ignored.
+                this.disposed = false;
+                this.creating = false;
+                // Calculated pos3d for the label.
+                // Override to make it draw at a different position.
+                this.pos3d = null;
+                this.rego = params.rego;
+                this.viewer = params.viewer;
+                this.api = params.api;
+                this.visualRegister = params.visualRegister;
+                this.creating = true;
+                this.createCLabel(params.pos3d).then(function () {
+                    _this.creating = false;
+                }).catch(function (e) {
+                    console.error("Failed to create label", e);
+                    _this.creating = false;
+                });
+            }
+            Object.defineProperty(Label.prototype, "Rego", {
+                get: function () {
+                    return this.rego;
+                },
+                enumerable: false,
+                configurable: true
+            });
+            Object.defineProperty(Label.prototype, "Disposed", {
+                get: function () {
+                    return this.disposed;
+                },
+                enumerable: false,
+                configurable: true
+            });
+            Object.defineProperty(Label.prototype, "Creating", {
+                get: function () {
+                    return this.creating;
+                },
+                enumerable: false,
+                configurable: true
+            });
+            /**
+             * Disposes label and marks instance as disposed.
+             * Recalling will be ignored.
+             */
+            Label.prototype.Dispose = function () {
+                if (this.disposed) {
+                    return;
+                }
+                this.disposed = true;
+                if (this.label &&
+                    this.label.parentElement) {
+                    this.label.parentElement.removeChild(this.label);
+                    this.label = null;
+                }
+                if (this.renderRemoval) {
+                    this.renderRemoval();
+                    this.renderRemoval = null;
+                }
+            };
+            /**
+             * Creates cesium entity for the label if one does not exist.
+             * @param pos23 optional position to create label at.
+             */
+            Label.prototype.createCLabel = function (pos3d) {
+                var _a, _b, _c, _d, _e, _f;
+                return __awaiter(this, void 0, void 0, function () {
+                    var heightRef, heightOffset, pixelOffset, visual, isClamped, height, scale, featureAny, propertyNames, latProp, lonProp, lat, lon, latIsRad, lonIsRad, latIsDeg, lonIsDeg, carto, text, ele, _lastDistance, _lastCameraPos, getDistance, MAX_DISTANCE, updateLabel;
+                    var _this = this;
+                    return __generator(this, function (_g) {
+                        switch (_g.label) {
+                            case 0:
+                                if (this.label || this.disposed) {
+                                    return [2 /*return*/];
+                                }
+                                heightRef = null;
+                                heightOffset = 10;
+                                pixelOffset = new Cesium.Cartesian2(0, 0);
+                                if (!isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) return [3 /*break*/, 3];
+                                visual = (_a = this.rego) === null || _a === void 0 ? void 0 : _a.visual;
+                                if (visual && visual instanceof Cesium.Entity) {
+                                    if (visual.polygon) {
+                                        heightRef = getValue$1(this.viewer, visual.polygon.heightReference);
+                                    }
+                                    else if (visual.polyline) {
+                                        isClamped = getValue$1(this.viewer, visual.polyline.clampToGround);
+                                        heightRef = isClamped == false ? Cesium.HeightReference.NONE : Cesium.HeightReference.CLAMP_TO_GROUND;
+                                    }
+                                    else if (visual.model) {
+                                        heightRef = getValue$1(this.viewer, visual.model.heightReference);
+                                    }
+                                    else if (visual.point) {
+                                        heightRef = getValue$1(this.viewer, visual.point.heightReference);
+                                    }
+                                    else if (visual.billboard) {
+                                        heightRef = getValue$1(this.viewer, visual.billboard.heightReference);
+                                        height = getValue$1(this.viewer, visual.billboard.height);
+                                        if (height) {
+                                            scale = EnsureNumber(getValue$1(this.viewer, visual.billboard.scale), 1);
+                                            pixelOffset.y = -(height * scale);
+                                        }
+                                        // Flat padding.
+                                        pixelOffset.y -= 5;
+                                        heightOffset = 0;
+                                    }
+                                    else if (visual.corridor) {
+                                        heightRef = getValue$1(this.viewer, visual.corridor.heightReference);
+                                    }
+                                    else if (visual.ellipse) {
+                                        heightRef = getValue$1(this.viewer, visual.ellipse.heightReference);
+                                    }
+                                    pos3d = getValue$1(this.viewer, visual.position);
+                                }
+                                else if (visual instanceof Cesium.Cesium3DTileFeature) {
+                                    featureAny = visual;
+                                    propertyNames = featureAny.getPropertyNames ? featureAny.getPropertyNames() : (_b = featureAny.getPropertyIds) === null || _b === void 0 ? void 0 : _b.call(featureAny);
+                                    if (propertyNames === null || propertyNames === void 0 ? void 0 : propertyNames.length) {
+                                        latProp = propertyNames.find(function (x) { return x.toLowerCase().includes("lat"); });
+                                        lonProp = propertyNames.find(function (x) { return x.toLowerCase().includes("lon"); });
+                                        lat = latProp ? featureAny.getProperty(latProp) : null;
+                                        lon = lonProp ? featureAny.getProperty(lonProp) : null;
+                                        if (lat && lon) {
+                                            latIsRad = typeof lat == "number" && lat > -Math.PI && lat < Math.PI;
+                                            lonIsRad = typeof lon == "number" && lon > -Math.PI && lon < Math.PI;
+                                            latIsDeg = typeof lat == "number" && lat > -180 && lat < 180;
+                                            lonIsDeg = typeof lon == "number" && lon > -180 && lon < 180;
+                                            if (latIsRad && lonIsRad) {
+                                                pos3d = Cesium.Cartographic.toCartesian(Cesium.Cartographic.fromRadians(lon, lat, 0));
+                                            }
+                                            else if (latIsDeg && lonIsDeg) {
+                                                pos3d = Cesium.Cartographic.toCartesian(Cesium.Cartographic.fromDegrees(lon, lat, 0));
+                                            }
+                                            heightRef = Cesium.HeightReference.CLAMP_TO_GROUND;
+                                        }
+                                    }
+                                }
+                                if (!isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) return [3 /*break*/, 2];
+                                return [4 /*yield*/, exports.EntityUtils.GetPosAsync({
+                                        viewer: this.viewer,
+                                        api: this.api,
+                                        entityId: (_c = this.rego) === null || _c === void 0 ? void 0 : _c.entityId,
+                                        returnHeightRef: Cesium.HeightReference.NONE,
+                                        tilesetId: (_d = this.rego) === null || _d === void 0 ? void 0 : _d.tilesetId,
+                                        visualRegister: this.visualRegister
+                                    })];
+                            case 1:
+                                pos3d = _g.sent();
+                                heightRef = Cesium.HeightReference.NONE;
+                                _g.label = 2;
+                            case 2: return [3 /*break*/, 4];
+                            case 3:
+                                heightRef = Cesium.HeightReference.NONE;
+                                // Flat padding.
+                                heightOffset = 0;
+                                pixelOffset.y = -15;
+                                _g.label = 4;
+                            case 4:
+                                if (isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) {
+                                    return [2 /*return*/];
+                                }
+                                pos3d = exports.DrawingUtils.EnsurePosHeight({
+                                    desiredHeightRef: Cesium.HeightReference.NONE,
+                                    heightRef: heightRef,
+                                    pos3d: pos3d,
+                                    viewer: this.viewer
+                                });
+                                if (isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) {
+                                    return [2 /*return*/];
+                                }
+                                if (heightOffset) {
+                                    carto = Cesium.Cartographic.fromCartesian(pos3d);
+                                    // TODO: Check if we need to use heightRef and adjust to absolute height.
+                                    // TODO: We should be smarter and not just add 10m to the height. Eg: use polygon extrusion.
+                                    carto.height += heightOffset;
+                                    pos3d = Cesium.Cartographic.toCartesian(carto);
+                                }
+                                this.pos3d = pos3d;
+                                text = (_f = (_e = this.rego) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : "Unnamed Entity";
+                                ele = document.createElement("div");
+                                ele.innerHTML = text;
+                                ele.setAttribute("style", "\n                position: absolute;\n                z-index: 1;\n                display: none;\n                pointer-events: none;\n                padding: 6px 8px;\n                border-radius: 6px;\n                font-family: Arial;\n                font-size: 12px;\n                -webkit-backdrop-filter: blur(20px);\n                backdrop-filter: blur(20px);\n                background: rgba(33,39,42,.8);\n                border-radius: 9px;\n                box-shadow: 0 0 1px rgba(18,22,25,.36),0 18px 36px -4px rgba(18,22,25,.36);\n                color: #ffffff;\n            }");
+                                this.label = ele;
+                                this.viewer.container.appendChild(ele);
+                                _lastDistance = null;
+                                _lastCameraPos = null;
+                                getDistance = function () {
+                                    var _a;
+                                    if (_this.disposed) {
+                                        return null;
+                                    }
+                                    var cameraPos = (_a = _this.viewer.camera) === null || _a === void 0 ? void 0 : _a.position;
+                                    if (isNaN(cameraPos === null || cameraPos === void 0 ? void 0 : cameraPos.x)) {
+                                        return null;
+                                    }
+                                    // If camera hasn't moved much then we can use the last distance.
+                                    var TOLERANCE = 0.1;
+                                    if (_lastCameraPos) {
+                                        var totalMovement = Math.abs(_lastCameraPos.x - cameraPos.x) +
+                                            Math.abs(_lastCameraPos.y - cameraPos.y) +
+                                            Math.abs(_lastCameraPos.z - cameraPos.z);
+                                        if (totalMovement < TOLERANCE) {
+                                            return _lastDistance;
+                                        }
+                                    }
+                                    // Check if there is a raycast collision between camera and pos3d.
+                                    // We'll let the labels draw through a ground collision.
+                                    // Commented out while it is WIP.
+                                    // const direction = Cesium.Cartesian3.subtract(pos3d, cameraPos, new Cesium.Cartesian3());
+                                    // const ray = new Cesium.Ray(pos3d.clone(), direction);
+                                    // const objects = (this.viewer.scene as any).drillPickFromRay(ray, 1, [visuals]);
+                                    // if (objects && objects.length > 0) {
+                                    //     for (let i = 0; i < objects.length; ++i) {
+                                    //         const obj = objects[i];
+                                    //         if (!visuals.find(x => x == obj?.id)) {
+                                    //             let isGround = true;
+                                    //             if (obj.object) {
+                                    //                 const url = obj.object?.primitive?._basePath;
+                                    //                 if (url && typeof url == "string") {
+                                    //                     isGround = url.includes("tile.googleapis.com");
+                                    //                 }
+                                    //                 else {
+                                    //                     isGround = false;
+                                    //                 }
+                                    //             }
+                                    //             if (!isGround) {
+                                    //                 return null;
+                                    //             }
+                                    //         }
+                                    //     }
+                                    // }
+                                    var distance = Cesium.Cartesian3.distance(cameraPos, _this.pos3d);
+                                    _lastDistance = distance;
+                                    _lastCameraPos = cameraPos.clone();
+                                    return distance;
+                                };
+                                MAX_DISTANCE = 5000;
+                                updateLabel = function () {
+                                    var _a;
+                                    if (_this.disposed || isNaN((_a = _this.pos3d) === null || _a === void 0 ? void 0 : _a.x)) {
+                                        return;
+                                    }
+                                    var distance = getDistance();
+                                    if (isNaN(distance) || distance >= MAX_DISTANCE) {
+                                        ele.style.display = "none";
+                                        return;
+                                    }
+                                    var pos2d = Cesium.SceneTransforms.wgs84ToWindowCoordinates(_this.viewer.scene, _this.pos3d);
+                                    if (isNaN(pos2d === null || pos2d === void 0 ? void 0 : pos2d.x)) {
+                                        ele.style.display = "none";
+                                        return;
+                                    }
+                                    // If out of the screen then we can hide it.
+                                    if (pos2d.x < 0 || pos2d.x > _this.viewer.canvas.clientWidth ||
+                                        pos2d.y < 0 || pos2d.y > _this.viewer.canvas.clientHeight) {
+                                        ele.style.display = "none";
+                                        return;
+                                    }
+                                    ele.style.display = "block";
+                                    // Check scale to apply based on distance between camera and pos3d.
+                                    // We'll make the label smaller and less transparent when further away.
+                                    var scale = 1 - (distance / MAX_DISTANCE);
+                                    if (scale && scale > 0.15) {
+                                        ele.style.transform = "scale(".concat(scale, ")");
+                                        ele.style.opacity = "".concat(scale);
+                                        var left = pos2d.x - (ele.clientWidth / 2) + pixelOffset.x;
+                                        ele.style.left = "".concat(left, "px");
+                                        var top_1 = pos2d.y - ele.clientHeight + (pixelOffset.y * scale);
+                                        ele.style.top = "".concat(top_1, "px");
+                                    }
+                                    else {
+                                        ele.style.transform = "";
+                                        ele.style.opacity = "0";
+                                    }
+                                };
+                                this.renderRemoval = this.viewer.scene.postUpdate.addEventListener(updateLabel);
+                                updateLabel();
+                                return [2 /*return*/];
+                        }
+                    });
+                });
+            };
+            return Label;
+        }());
+        EntityLabel.Label = Label;
+        /**
+         * Creates an entity label for a given rego.
+         * If one exists then the action is ignored.
+         */
+        function Attach(params) {
+            var rego = params.rego, viewer = params.viewer, pos3d = params.pos3d, visualRegister = params.visualRegister, api = params.api;
+            if (!rego || !viewer || rego[EntityLabel.ATTACH_KEY]) {
+                return;
+            }
+            rego[EntityLabel.ATTACH_KEY] = new Label({
+                rego: rego,
+                viewer: viewer,
+                pos3d: pos3d,
+                visualRegister: visualRegister,
+                api: api
+            });
+            return rego[EntityLabel.ATTACH_KEY];
+        }
+        EntityLabel.Attach = Attach;
+        /**
+         * Removes an entity label from a given rego.
+         * If one doesn't exist then the action is ignored.
+         */
+        function Detatch(params) {
+            var _a, _b, _c;
+            var rego = params.rego, label = params.label;
+            if (!rego && label) {
+                rego = label.Rego;
+            }
+            if (!rego || !rego[EntityLabel.ATTACH_KEY]) {
+                if (label) {
+                    (_a = label.Dispose) === null || _a === void 0 ? void 0 : _a.call(label);
+                }
+                return;
+            }
+            (_c = (_b = rego[EntityLabel.ATTACH_KEY]).Dispose) === null || _c === void 0 ? void 0 : _c.call(_b);
+            rego[EntityLabel.ATTACH_KEY] = null;
+        }
+        EntityLabel.Detatch = Detatch;
+        /**
+         * Returns label instance from given rego if one exists.
+         * @param params
+         * @returns
+         */
+        function GetLabel(params) {
+            var rego = params.rego;
+            if (!rego) {
+                return null;
+            }
+            return rego[EntityLabel.ATTACH_KEY];
+        }
+        EntityLabel.GetLabel = GetLabel;
+    })(exports.EntityLabel || (exports.EntityLabel = {}));
+
     /**
      * Returns if a given visual is alive and in the scene.
      * @param viewer
@@ -3814,7 +4201,26 @@
         for (var i = 0; i < regos.length; i++) {
             var rego = regos[i];
             rego.best = rego === highestPriority;
-            updateEntityShow(viewer, rego.visual, rego.suppressShow ? false : getShowState(rego));
+            var visible = rego.suppressShow ? false : getShowState(rego);
+            updateEntityShow(viewer, rego.visual, visible);
+            if (rego.best) {
+                var isLabelled = register.GetIsLabelled({
+                    entityId: entityId
+                });
+                if (isLabelled && visible) {
+                    exports.EntityLabel.Attach({
+                        rego: rego,
+                        viewer: viewer,
+                        api: register.ApiGetters.GetBruceApi(),
+                        visualRegister: register
+                    });
+                }
+                else {
+                    exports.EntityLabel.Detatch({
+                        rego: rego
+                    });
+                }
+            }
         }
     }
     function markEntity(register, rego, visual, ignoreParent) {
@@ -3982,7 +4388,7 @@
             EVisualUpdateType["DeselectAll"] = "DESELECT_ALL";
         })(EVisualUpdateType = VisualsRegister.EVisualUpdateType || (VisualsRegister.EVisualUpdateType = {}));
         var Register = /** @class */ (function () {
-            function Register(viewer) {
+            function Register(params) {
                 this.id = bruceModels.ObjectUtils.UId();
                 this.rego = {};
                 this.onUpdate = null;
@@ -3991,7 +4397,12 @@
                 this.hiddenIds = [];
                 // Entity id -> opacity for visual.
                 this.opacity = {};
-                this.viewer = viewer;
+                // Array of entity ids for entities who have labels drawn for them.
+                // It will be drawn on the "best" visual, and only while the entity is visible.
+                // Warning: this sucks for CAD entities.
+                this.labelledEntityIds = [];
+                this.viewer = params.viewer;
+                this.apiGetters = params.apiGetters;
             }
             Object.defineProperty(Register.prototype, "Id", {
                 get: function () {
@@ -4007,6 +4418,13 @@
                 enumerable: false,
                 configurable: true
             });
+            Object.defineProperty(Register.prototype, "ApiGetters", {
+                get: function () {
+                    return this.apiGetters;
+                },
+                enumerable: false,
+                configurable: true
+            });
             Object.defineProperty(Register.prototype, "OnUpdate", {
                 get: function () {
                     if (!this.onUpdate) {
@@ -4029,6 +4447,71 @@
                 }
                 this.viewer.scene.requestRender();
             };
+            /**
+             * Marks given entityIds as either labelled or not labelled.
+             * When an entity is labelled a label will be drawn on the "best" visual for it.
+             * @param params
+             */
+            Register.prototype.SetLabelled = function (params) {
+                var labelled = params.labelled, entityIds = params.entityIds, requestRender = params.requestRender;
+                var _loop_3 = function (i) {
+                    var id = entityIds[i];
+                    var index = this_1.labelledEntityIds.findIndex(function (x) { return x == id; });
+                    if (labelled) {
+                        if (index <= -1) {
+                            this_1.labelledEntityIds.push(id);
+                            updateEntity(this_1.viewer, id, this_1);
+                        }
+                    }
+                    else {
+                        if (index > -1) {
+                            this_1.labelledEntityIds.splice(index, 1);
+                            updateEntity(this_1.viewer, id, this_1);
+                        }
+                    }
+                };
+                var this_1 = this;
+                for (var i = 0; i < entityIds.length; i++) {
+                    _loop_3(i);
+                }
+                if (requestRender != false) {
+                    this.viewer.scene.requestRender();
+                }
+            };
+            /**
+             * Returns if given entity id is labelled.
+             * @param params
+             */
+            Register.prototype.GetIsLabelled = function (params) {
+                var id = params.entityId;
+                return this.labelledEntityIds.indexOf(id) !== -1;
+            };
+            /**
+             * Clears all labelled entities.
+             * @param params
+             */
+            Register.prototype.ClearLabelled = function (params) {
+                var ids = [].concat(this.labelledEntityIds);
+                this.labelledEntityIds = [];
+                for (var i = 0; i < ids.length; i++) {
+                    var id = ids[i];
+                    updateEntity(this.viewer, id, this);
+                }
+                if ((params === null || params === void 0 ? void 0 : params.requestRender) != false) {
+                    this.viewer.scene.requestRender();
+                }
+            };
+            /**
+             * Returns all labelled entity ids.
+             */
+            Register.prototype.GetLabelled = function () {
+                return this.labelledEntityIds;
+            };
+            /**
+             * Updates the selection color.
+             * This will not update the selection color for already selected entities.
+             * @param color
+             */
             Register.prototype.SetSelectionColor = function (color) {
                 this.selectionColor = color;
             };
@@ -4354,26 +4837,26 @@
                         return;
                     }
                     var menuItems = menuItemId ? [menuItemId] : entityRegos.map(function (x) { return x.menuItemId; });
-                    var _loop_3 = function (i) {
+                    var _loop_4 = function (i) {
                         var menuItemId_2 = menuItems[i];
                         var rego = entityRegos.find(function (r) { return r.menuItemId === menuItemId_2; });
                         if (!rego) {
                             return { value: void 0 };
                         }
-                        removeEntity(this_1.viewer, rego.visual);
-                        (_b = this_1.onUpdate) === null || _b === void 0 ? void 0 : _b.Trigger({
+                        removeEntity(this_2.viewer, rego.visual);
+                        (_b = this_2.onUpdate) === null || _b === void 0 ? void 0 : _b.Trigger({
                             type: EVisualUpdateType.Remove,
                             entityId: rego.entityId,
                             rego: rego
                         });
-                        this_1.rego[entityId] = entityRegos.filter(function (r) { return r.menuItemId !== menuItemId_2; });
+                        this_2.rego[entityId] = entityRegos.filter(function (r) { return r.menuItemId !== menuItemId_2; });
                         if (doUpdate && menuItemId_2) {
-                            updateEntity(this_1.viewer, entityId, this_1);
+                            updateEntity(this_2.viewer, entityId, this_2);
                         }
                     };
-                    var this_1 = this;
+                    var this_2 = this;
                     for (var i = 0; i < menuItems.length; i++) {
-                        var state_1 = _loop_3(i);
+                        var state_1 = _loop_4(i);
                         if (typeof state_1 === "object")
                             return state_1.value;
                     }
@@ -9500,15 +9983,29 @@
             function Manager(params) {
                 this.items = [];
                 this.onUpdate = null;
-                var viewer = params.viewer, visualsRegister = params.visualsRegister;
+                var viewer = params.viewer, visualsRegister = params.visualsRegister, getters = params.getters;
                 this.viewer = viewer;
+                if (!getters) {
+                    getters = bruceModels.ENVIRONMENT.Api();
+                }
+                this.getters = getters;
                 if (!visualsRegister) {
-                    visualsRegister = new exports.VisualsRegister.Register(viewer);
+                    visualsRegister = new exports.VisualsRegister.Register({
+                        viewer: this.viewer,
+                        apiGetters: getters
+                    });
                 }
                 this.visualsRegister = visualsRegister;
                 this.sharedGetters = new exports.SharedGetters.Cache();
                 this.sharedMonitor = new CesiumViewMonitor(this.viewer);
             }
+            Object.defineProperty(Manager.prototype, "Getters", {
+                get: function () {
+                    return this.getters;
+                },
+                enumerable: false,
+                configurable: true
+            });
             Object.defineProperty(Manager.prototype, "Viewer", {
                 get: function () {
                     return this.viewer;
@@ -9551,11 +10048,15 @@
                 if (this.viewer.isDestroyed()) {
                     return null;
                 }
+                if (!params.getters) {
+                    params.getters = this.getters;
+                }
+                // Deprecated. Backwards compatibility.
                 if (!params.getters) {
                     params.getters = bruceModels.ENVIRONMENT.Api();
                 }
-                if (params.apiGetter && !params.getters) {
-                    console.warn("RenderItem(): Please pass getters instead of apiGetter. This is now deprecated due to needing access to other kinds of apis.");
+                if (params.apiGetter && !this.getters) {
+                    console.warn("RenderItem(): Please pass getters within menu-item-manager constructor. 'getters' and 'apiGetter' within RenderItem are now deprecated.");
                 }
                 else if (!params.apiGetter) {
                     params.apiGetter = params.getters.GetBruceGetter();
@@ -12214,11 +12715,11 @@
      * @param view
      */
     function renderNavigator(iteration, params, bookmark, view) {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6;
         return __awaiter(this, void 0, void 0, function () {
-            var viewer, scene, vSettings, bSettings, defaults, camera, newLens, shouldBe2d, curIs2d, transition, pos, terrain, hillShades, baseColor, globeHidden, terrainWireframe, globeAlpha, shadows, size, ambientOcclusion, AO, lighting, light, quality, fxaa, dateTime, clock, selectedIds, hiddenIds, isolatedIds, entityOpacityMap, entityId, opacity, imagery, renderedRelationEntityIds, curEnabled, newItemIds, _i, curEnabled_1, id, menuItem, gOcclusion;
-            return __generator(this, function (_6) {
-                switch (_6.label) {
+            var viewer, scene, vSettings, bSettings, defaults, camera, newLens, shouldBe2d, curIs2d, transition, pos, terrain, hillShades, baseColor, globeHidden, terrainWireframe, globeAlpha, shadows, size, ambientOcclusion, AO, lighting, light, quality, fxaa, dateTime, clock, selectedIds, hiddenIds, isolatedIds, labelledIds, entityOpacityMap, entityId, opacity, imagery, renderedRelationEntityIds, curEnabled, newItemIds, _i, curEnabled_1, id, menuItem, gOcclusion;
+            return __generator(this, function (_7) {
+                switch (_7.label) {
                     case 0:
                         viewer = params.manager.Viewer;
                         scene = viewer.scene;
@@ -12280,11 +12781,11 @@
                                 viewer: params.manager.Viewer,
                             })];
                     case 1:
-                        _6.sent();
+                        _7.sent();
                         if (!assertIteration$1(params.viewer, iteration)) {
                             return [2 /*return*/];
                         }
-                        _6.label = 2;
+                        _7.label = 2;
                     case 2:
                         hillShades = (_o = bookmark === null || bookmark === void 0 ? void 0 : bookmark.Settings) === null || _o === void 0 ? void 0 : _o.hillShades;
                         if (hillShades == null) {
@@ -12444,10 +12945,21 @@
                                 entityIds: isolatedIds
                             });
                         }
+                        params.manager.VisualsRegister.ClearLabelled();
+                        labelledIds = bSettings === null || bSettings === void 0 ? void 0 : bSettings.labelledEntityIds;
+                        if (labelledIds == null) {
+                            labelledIds = (_2 = defaults === null || defaults === void 0 ? void 0 : defaults.settings) === null || _2 === void 0 ? void 0 : _2.labelledEntityIds;
+                        }
+                        if (labelledIds != null) {
+                            params.manager.VisualsRegister.SetLabelled({
+                                labelled: true,
+                                entityIds: labelledIds
+                            });
+                        }
                         params.manager.VisualsRegister.ClearOpacity();
                         entityOpacityMap = bSettings === null || bSettings === void 0 ? void 0 : bSettings.entityOpacityMap;
                         if (entityOpacityMap == null) {
-                            entityOpacityMap = (_2 = defaults === null || defaults === void 0 ? void 0 : defaults.settings) === null || _2 === void 0 ? void 0 : _2.entityOpacityMap;
+                            entityOpacityMap = (_3 = defaults === null || defaults === void 0 ? void 0 : defaults.settings) === null || _3 === void 0 ? void 0 : _3.entityOpacityMap;
                         }
                         if (entityOpacityMap != null) {
                             for (entityId in entityOpacityMap) {
@@ -12460,7 +12972,7 @@
                                 }
                             }
                         }
-                        imagery = (bSettings === null || bSettings === void 0 ? void 0 : bSettings.imagery) != null ? bSettings.imagery : (_3 = defaults.settings) === null || _3 === void 0 ? void 0 : _3.imagery;
+                        imagery = (bSettings === null || bSettings === void 0 ? void 0 : bSettings.imagery) != null ? bSettings.imagery : (_4 = defaults.settings) === null || _4 === void 0 ? void 0 : _4.imagery;
                         if (imagery == null) {
                             // TODO: Need global default.
                             imagery = [
@@ -12487,7 +12999,7 @@
                             renderedRelationEntityIds = [];
                         }
                         curEnabled = params.manager.GetEnabledItemIds();
-                        newItemIds = (_4 = bSettings === null || bSettings === void 0 ? void 0 : bSettings.menuItemIds) !== null && _4 !== void 0 ? _4 : [];
+                        newItemIds = (_5 = bSettings === null || bSettings === void 0 ? void 0 : bSettings.menuItemIds) !== null && _5 !== void 0 ? _5 : [];
                         for (_i = 0, curEnabled_1 = curEnabled; _i < curEnabled_1.length; _i++) {
                             id = curEnabled_1[_i];
                             if (newItemIds.indexOf(id) === -1 ||
@@ -12505,11 +13017,11 @@
                                 bookmark: bookmark
                             })];
                     case 3:
-                        _6.sent();
+                        _7.sent();
                         if (!assertIteration$1(params.viewer, iteration)) {
                             return [2 /*return*/];
                         }
-                        _6.label = 4;
+                        _7.label = 4;
                     case 4:
                         if (!renderedRelationEntityIds.length) return [3 /*break*/, 6];
                         menuItem = {
@@ -12525,15 +13037,15 @@
                                 item: menuItem
                             })];
                     case 5:
-                        _6.sent();
+                        _7.sent();
                         if (!assertIteration$1(params.viewer, iteration)) {
                             return [2 /*return*/];
                         }
-                        _6.label = 6;
+                        _7.label = 6;
                     case 6:
                         gOcclusion = bSettings === null || bSettings === void 0 ? void 0 : bSettings.groundOcclusion;
                         if (gOcclusion == null) {
-                            gOcclusion = (_5 = defaults === null || defaults === void 0 ? void 0 : defaults.settings) === null || _5 === void 0 ? void 0 : _5.groundOcclusion;
+                            gOcclusion = (_6 = defaults === null || defaults === void 0 ? void 0 : defaults.settings) === null || _6 === void 0 ? void 0 : _6.groundOcclusion;
                         }
                         if (gOcclusion == null) {
                             // TODO: Need global default.
@@ -15146,7 +15658,7 @@
                                 defaultToId: false
                             });
                             if (!name_1) {
-                                name_1 = "Unnamed entity";
+                                name_1 = "Unnamed Entity";
                             }
                             this._title.style.display = "block";
                             this._flyTo.style.display = "flex";
@@ -15371,12 +15883,15 @@
          * @returns
          */
         function GetManager(params) {
-            var viewer = params.viewer, createIfMissing = params.createIfMissing;
+            var viewer = params.viewer, createIfMissing = params.createIfMissing, getters = params.getters;
             if (viewer[CESIUM_VIEWER_MANAGER_KEY]) {
                 return viewer[CESIUM_VIEWER_MANAGER_KEY];
             }
             else if (createIfMissing != false) {
-                var manager = new exports.MenuItemManager.Manager({ viewer: viewer });
+                var manager = new exports.MenuItemManager.Manager({
+                    viewer: viewer,
+                    getters: getters
+                });
                 viewer[CESIUM_VIEWER_MANAGER_KEY] = manager;
                 return manager;
             }
@@ -15435,7 +15950,7 @@
         ViewerUtils.CreateWidgets = CreateWidgets;
     })(exports.ViewerUtils || (exports.ViewerUtils = {}));
 
-    var VERSION$1 = "2.8.2";
+    var VERSION$1 = "2.8.4";
 
     exports.VERSION = VERSION$1;
     exports.CesiumViewMonitor = CesiumViewMonitor;