bruce-cesium 2.8.2 → 2.8.4

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, Entity, Primitive, Cesium3DTileFeature, JulianDate, HeightReference, DistanceDisplayCondition, NearFarScalar, HorizontalOrigin, VerticalOrigin, ClassificationType, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, HeadingPitchRoll, Transforms, ColorBlendMode, SceneMode, Cesium3DTileColorBlendMode, HeadingPitchRange, createOsmBuildings, Cesium3DTileStyle, KmlDataSource, OrthographicFrustum, EasingFunction, SceneTransforms, EllipsoidTerrainProvider, CesiumInspector, defined, EllipsoidGeodesic, sampleTerrainMostDetailed, Cesium3DTileset, Model, createWorldTerrain, CesiumTerrainProvider, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, UrlTemplateImageryProvider, TileMapServiceImageryProvider, IonImageryProvider, Matrix4, Matrix3, IonResource, Ion, PolygonPipeline, ScreenSpaceEventHandler, ScreenSpaceEventType, ColorMaterialProperty, GeometryInstance, BoundingSphere } from 'cesium';
 
 var TIME_LAG = 300;
 var POSITION_CHECK_TIMER = 950;
@@ -1741,7 +1741,7 @@ function getName(api, entity) {
                             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:
@@ -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,370 @@ var RelationRenderEngine;
     })(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;
+}
+/**
+ * Util for generating labels within cesium space on entities.
+*/
+var EntityLabel;
+(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 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 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);
+                            }
+                            else if (visual instanceof 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 = Cartographic.toCartesian(Cartographic.fromRadians(lon, lat, 0));
+                                        }
+                                        else if (latIsDeg && lonIsDeg) {
+                                            pos3d = Cartographic.toCartesian(Cartographic.fromDegrees(lon, lat, 0));
+                                        }
+                                        heightRef = HeightReference.CLAMP_TO_GROUND;
+                                    }
+                                }
+                            }
+                            if (!isNaN(pos3d === null || pos3d === void 0 ? void 0 : pos3d.x)) return [3 /*break*/, 2];
+                            return [4 /*yield*/, EntityUtils.GetPosAsync({
+                                    viewer: this.viewer,
+                                    api: this.api,
+                                    entityId: (_c = this.rego) === null || _c === void 0 ? void 0 : _c.entityId,
+                                    returnHeightRef: HeightReference.NONE,
+                                    tilesetId: (_d = this.rego) === null || _d === void 0 ? void 0 : _d.tilesetId,
+                                    visualRegister: this.visualRegister
+                                })];
+                        case 1:
+                            pos3d = _g.sent();
+                            heightRef = HeightReference.NONE;
+                            _g.label = 2;
+                        case 2: return [3 /*break*/, 4];
+                        case 3:
+                            heightRef = 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 = DrawingUtils.EnsurePosHeight({
+                                desiredHeightRef: 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 = 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);
+                            }
+                            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 = 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 = 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;
+})(EntityLabel || (EntityLabel = {}));
+
 /**
  * Returns if a given visual is alive and in the scene.
  * @param viewer
@@ -3817,7 +4208,26 @@ 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,
+                    api: register.ApiGetters.GetBruceApi(),
+                    visualRegister: register
+                });
+            }
+            else {
+                EntityLabel.Detatch({
+                    rego: rego
+                });
+            }
+        }
     }
 }
 function markEntity(register, rego, visual, ignoreParent) {
@@ -3990,7 +4400,7 @@ var VisualsRegister;
         EVisualUpdateType["DeselectAll"] = "DESELECT_ALL";
     })(EVisualUpdateType = VisualsRegister.EVisualUpdateType || (VisualsRegister.EVisualUpdateType = {}));
     var Register = /** @class */ (function () {
-        function Register(viewer) {
+        function Register(params) {
             this.id = ObjectUtils.UId();
             this.rego = {};
             this.onUpdate = null;
@@ -3999,7 +4409,12 @@ var VisualsRegister;
             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 () {
@@ -4015,6 +4430,13 @@ var VisualsRegister;
             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) {
@@ -4037,6 +4459,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 +4849,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;
                 }
@@ -9546,15 +10033,29 @@ var MenuItemManager;
         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 = ENVIRONMENT.Api();
+            }
+            this.getters = getters;
             if (!visualsRegister) {
-                visualsRegister = new VisualsRegister.Register(viewer);
+                visualsRegister = new VisualsRegister.Register({
+                    viewer: this.viewer,
+                    apiGetters: getters
+                });
             }
             this.visualsRegister = visualsRegister;
             this.sharedGetters = new 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;
@@ -9597,11 +10098,15 @@ var MenuItemManager;
             if (this.viewer.isDestroyed()) {
                 return null;
             }
+            if (!params.getters) {
+                params.getters = this.getters;
+            }
+            // Deprecated. Backwards compatibility.
             if (!params.getters) {
                 params.getters = 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();
@@ -12266,11 +12771,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 +12837,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 +13001,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 +13028,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 +13055,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 +13073,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 +13093,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.
@@ -15199,7 +15715,7 @@ var WidgetInfoView = /** @class */ (function (_super) {
                             defaultToId: false
                         });
                         if (!name_1) {
-                            name_1 = "Unnamed entity";
+                            name_1 = "Unnamed Entity";
                         }
                         this._title.style.display = "block";
                         this._flyTo.style.display = "flex";
@@ -15425,12 +15941,15 @@ var ViewerUtils;
      * @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 MenuItemManager.Manager({ viewer: viewer });
+            var manager = new MenuItemManager.Manager({
+                viewer: viewer,
+                getters: getters
+            });
             viewer[CESIUM_VIEWER_MANAGER_KEY] = manager;
             return manager;
         }
@@ -15489,7 +16008,7 @@ var ViewerUtils;
     ViewerUtils.CreateWidgets = CreateWidgets;
 })(ViewerUtils || (ViewerUtils = {}));
 
-var VERSION$1 = "2.8.2";
+var VERSION$1 = "2.8.4";
 
-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