bruce-cesium 2.8.2 → 2.8.3

package/dist/bruce-cesium.es5.js

@@ -1,6 +1,6 @@
 import { BruceEvent, Cartes, Carto, Entity as Entity$1, Geometry, Tileset, MathUtils, LRUCache, ZoomControl, Style, EntityTag, Calculator, EntityLod, EntityType, ClientFile, ObjectUtils, Bounds, EntityRelationType, DelayQueue, BatchedDataGetter, EntityCoords, EntityFilterGetter, EntitySource, MenuItem, EntityRelation, ENVIRONMENT, ProjectView, ProjectViewBookmark, ProjectViewTile, ProjectViewLegacyTile, ProgramKey, Camera, AbstractApi, EntityAttachment, EntityAttachmentType, EntityAttribute } from 'bruce-models';
 import * as Cesium from 'cesium';
-import { Cartographic, Cartesian2, CallbackProperty, Cartesian3, Color, Rectangle, Math as Math$1, JulianDate, SceneMode, HeightReference, DistanceDisplayCondition, NearFarScalar, Entity, HorizontalOrigin, VerticalOrigin, ClassificationType, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, HeadingPitchRoll, Transforms, ColorBlendMode, Primitive, Cesium3DTileFeature, Cesium3DTileColorBlendMode, HeadingPitchRange, Cesium3DTileStyle, createOsmBuildings, KmlDataSource, OrthographicFrustum, EasingFunction, Cesium3DTileset, Matrix4, Matrix3, IonResource, Ion, EllipsoidGeodesic, EllipsoidTerrainProvider, sampleTerrainMostDetailed, defined, Model, createWorldTerrain, CesiumTerrainProvider, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, UrlTemplateImageryProvider, TileMapServiceImageryProvider, IonImageryProvider, CesiumInspector, PolygonPipeline, ColorMaterialProperty, GeometryInstance, ScreenSpaceEventHandler, ScreenSpaceEventType, BoundingSphere } from 'cesium';
+import { Cartographic, Cartesian2, CallbackProperty, Cartesian3, Color, Rectangle, Math as Math$1, JulianDate, SceneMode, Entity, Primitive, Cesium3DTileFeature, HeightReference, DistanceDisplayCondition, NearFarScalar, HorizontalOrigin, VerticalOrigin, ClassificationType, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, HeadingPitchRoll, Transforms, ColorBlendMode, Cesium3DTileColorBlendMode, HeadingPitchRange, createOsmBuildings, Cesium3DTileStyle, KmlDataSource, SceneTransforms, Cesium3DTileset, Matrix4, Matrix3, IonResource, Ion, OrthographicFrustum, EasingFunction, createWorldTerrain, EllipsoidTerrainProvider, CesiumTerrainProvider, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, UrlTemplateImageryProvider, TileMapServiceImageryProvider, IonImageryProvider, CesiumInspector, defined, PolygonPipeline, EllipsoidGeodesic, sampleTerrainMostDetailed, Model, ColorMaterialProperty, GeometryInstance, ScreenSpaceEventHandler, ScreenSpaceEventType, BoundingSphere } from 'cesium';
 
 var TIME_LAG = 300;
 var POSITION_CHECK_TIMER = 950;
@@ -1844,6 +1844,7 @@ function getRenderGroupId(zoomItem, terrain) {
     return zoomItem.MinZoom + "-" + zoomItem.MaxZoom + "-" + shouldApplyFlatFix(terrain);
 }
 var _fileValidationCache = {};
+var _fileHeightCache = {};
 /**
  * @param min
  * @param max
@@ -2198,7 +2199,7 @@ var EntityRenderEngine;
     (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:
@@ -2213,7 +2214,7 @@ var EntityRenderEngine;
                             }
                             cEntity = null;
                             siblings = [];
-                            if (!(type == Style.EPointType.Icon)) return [3 /*break*/, 7];
+                            if (!(type == Style.EPointType.Icon)) return [3 /*break*/, 12];
                             iconUrlRows = style.iconUrl == null ? [] : style.iconUrl;
                             iconUrlRows.forEach(function (row) {
                                 if (row.type == Calculator.EValueType.Color) {
@@ -2221,41 +2222,66 @@ var EntityRenderEngine;
                                 }
                             });
                             icon = 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 = ClientFile.GetUrl({
+                            if (!iconUrl_1 && style.iconId) {
+                                iconUrl_1 = 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(Calculator.GetNumber(style.iconScale, entity, params.tags));
                                 if (!iconScale && iconScale != 0) {
                                     iconScale = 1;
@@ -2267,11 +2293,12 @@ var EntityRenderEngine;
                                         billboard: {
                                             horizontalOrigin: HorizontalOrigin.CENTER,
                                             verticalOrigin: 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),
                                         },
@@ -2285,8 +2312,8 @@ var EntityRenderEngine;
                                     });
                                 }
                             }
-                            _a.label = 7;
-                        case 7:
+                            _a.label = 12;
+                        case 12:
                             if (type == Style.EPointType.Cylinder) {
                                 radius = EnsureNumber(Calculator.GetNumber(style.CylinderRadius, entity, params.tags));
                                 if (radius <= 0) {
@@ -3689,6 +3716,274 @@ var RelationRenderEngine;
     })(Parabola = RelationRenderEngine.Parabola || (RelationRenderEngine.Parabola = {}));
 })(RelationRenderEngine || (RelationRenderEngine = {}));
 
+// Key where the label instance is stored within the cesium entity.
+// Eg: cEntity[ATTACH_KEY] = new EntityLabel(...);
+var ATTACH_KEY = "nextspace-navigator-entity-label";
+/**
+ * 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;
+}
+/**
+ * Util for generating labels within cesium space on entities.
+ */
+var EntityLabel;
+(function (EntityLabel) {
+    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;
+            this.rego = params.rego;
+            this.viewer = params.viewer;
+            this.creating = true;
+            this.createCLabel().then(function () {
+                _this.creating = false;
+            }).catch(function (e) {
+                console.error("Failed to create label", e);
+                _this.creating = false;
+            });
+        }
+        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.
+         */
+        Label.prototype.createCLabel = function () {
+            var _a, _b, _c;
+            return __awaiter(this, void 0, void 0, function () {
+                var pos3d, heightRef, heightOffset, pixelOffset, visual, isClamped, height, scale, carto, text, ele, _lastDistance, _lastCameraPos, getDistance, MAX_DISTANCE, updateLabel;
+                var _this = this;
+                return __generator(this, function (_d) {
+                    if (this.label || this.disposed) {
+                        return [2 /*return*/];
+                    }
+                    pos3d = null;
+                    heightRef = null;
+                    heightOffset = 10;
+                    pixelOffset = new Cartesian2(0, 0);
+                    visual = (_a = this.rego) === null || _a === void 0 ? void 0 : _a.visual;
+                    if (visual && visual instanceof 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 ? HeightReference.NONE : 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);
+                    }
+                    if (isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) {
+                        return [2 /*return*/];
+                    }
+                    carto = 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 = Cartographic.toCartesian(carto);
+                    text = (_c = (_b = this.rego) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : "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;\n                border-radius: 6px;\n                font-family: sans-serif;\n                font-size: 12px;\n                background-color: #000000;\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 = Cartesian3.distance(cameraPos, pos3d);
+                        _lastDistance = distance;
+                        _lastCameraPos = cameraPos.clone();
+                        return distance;
+                    };
+                    MAX_DISTANCE = 5000;
+                    updateLabel = function () {
+                        if (_this.disposed || isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) {
+                            return;
+                        }
+                        var distance = getDistance();
+                        if (isNaN(distance) || distance >= MAX_DISTANCE) {
+                            ele.style.display = "none";
+                            return;
+                        }
+                        var pos2d = SceneTransforms.wgs84ToWindowCoordinates(_this.viewer.scene, 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;
+        if (!rego || !viewer || rego[ATTACH_KEY]) {
+            return;
+        }
+        rego[ATTACH_KEY] = new Label({
+            rego: rego,
+            viewer: viewer
+        });
+    }
+    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;
+        var rego = params.rego;
+        if (!rego || !rego[ATTACH_KEY]) {
+            return;
+        }
+        (_b = (_a = rego[ATTACH_KEY]).Dispose) === null || _b === void 0 ? void 0 : _b.call(_a);
+        rego[ATTACH_KEY] = null;
+    }
+    EntityLabel.Detatch = Detatch;
+})(EntityLabel || (EntityLabel = {}));
+
 /**
  * Returns if a given visual is alive and in the scene.
  * @param viewer
@@ -3817,7 +4112,24 @@ function updateEntity(viewer, entityId, register) {
     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) {
+                EntityLabel.Attach({
+                    rego: rego,
+                    viewer: viewer
+                });
+            }
+            else {
+                EntityLabel.Detatch({
+                    rego: rego
+                });
+            }
+        }
     }
 }
 function markEntity(register, rego, visual, ignoreParent) {
@@ -3999,6 +4311,10 @@ var VisualsRegister;
             this.hiddenIds = [];
             // Entity id -> opacity for visual.
             this.opacity = {};
+            // 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 = viewer;
         }
         Object.defineProperty(Register.prototype, "Id", {
@@ -4037,6 +4353,71 @@ var VisualsRegister;
             }
             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;
         };
@@ -4362,26 +4743,26 @@ var VisualsRegister;
                     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;
                 }
@@ -12266,11 +12647,11 @@ function renderLegacyNavigator(iteration, params, bookmark, view) {
  * @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;
@@ -12332,11 +12713,11 @@ function renderNavigator(iteration, params, bookmark, view) {
                             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) {
@@ -12496,10 +12877,21 @@ function renderNavigator(iteration, params, bookmark, view) {
                             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) {
@@ -12512,7 +12904,7 @@ function renderNavigator(iteration, params, bookmark, view) {
                             }
                         }
                     }
-                    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 = [
@@ -12539,7 +12931,7 @@ function renderNavigator(iteration, params, bookmark, view) {
                         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 ||
@@ -12557,11 +12949,11 @@ function renderNavigator(iteration, params, bookmark, view) {
                             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 = {
@@ -12577,15 +12969,15 @@ function renderNavigator(iteration, params, bookmark, view) {
                             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.
@@ -15489,7 +15881,7 @@ var ViewerUtils;
     ViewerUtils.CreateWidgets = CreateWidgets;
 })(ViewerUtils || (ViewerUtils = {}));
 
-var VERSION$1 = "2.8.2";
+var VERSION$1 = "2.8.3";
 
-export { VERSION$1 as VERSION, CesiumViewMonitor, ViewerUtils, MenuItemManager, EntityRenderEngine, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, RelationsRenderManager, SharedGetters, CesiumParabola, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, Draw3dPolygon, Draw3dPolyline };
+export { VERSION$1 as VERSION, CesiumViewMonitor, ViewerUtils, MenuItemManager, EntityRenderEngine, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, Draw3dPolygon, Draw3dPolyline };
 //# sourceMappingURL=bruce-cesium.es5.js.map