bruce-cesium 5.4.0 → 5.4.2

package/dist/bruce-cesium.es5.js

@@ -1,6 +1,6 @@
 import { BruceEvent, Cartes, Entity as Entity$1, Carto, Geometry, MathUtils, LRUCache, Api, Calculator, ClientFile, EntityTag, EntityType, ObjectUtils, Style, ProjectViewTile, DelayQueue, EntityLod, Bounds, ZoomControl, EntityRelationType, ENVIRONMENT, EntityHistoricData, Tileset, EntityCoords, DataLab, EntitySource, MenuItem, EntityRelation, ProgramKey, ProjectView, ProjectViewBookmark, ProjectViewLegacyTile, Camera, EntityAttachment, EntityAttachmentType, EntityAttribute, AbstractApi, Session } from 'bruce-models';
 import * as Cesium from 'cesium';
-import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, Entity, DistanceDisplayCondition, ClassificationType, ArcType, CornerType, ShadowMode, ConstantProperty, ConstantPositionProperty, PolygonHierarchy, PolylineGraphics, ColorMaterialProperty, ColorBlendMode, HeadingPitchRoll, Transforms, Model, HorizontalOrigin, VerticalOrigin, SceneMode, GeoJsonDataSource, Primitive, Cesium3DTileFeature, Cesium3DTileStyle, Cesium3DTileColorBlendMode, HeadingPitchRange, Ion, KmlDataSource, SceneTransforms, EllipsoidTerrainProvider, IonImageryProvider, createWorldImagery, createWorldImageryAsync, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, CesiumTerrainProvider, CesiumInspector, OrthographicFrustum, defined, ClockRange, EasingFunction, NearFarScalar, EllipsoidGeodesic, sampleTerrainMostDetailed, Cesium3DTileset, PolygonPipeline, Matrix4, Matrix3, IonResource, BoundingSphere, GeometryInstance, Quaternion, ScreenSpaceEventHandler, ScreenSpaceEventType, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, PolylineDashMaterialProperty, CzmlDataSource, Intersect, Fullscreen } from 'cesium';
+import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, Entity, DistanceDisplayCondition, HorizontalOrigin, VerticalOrigin, ConstantProperty, ClassificationType, ConstantPositionProperty, ArcType, CornerType, ShadowMode, ColorBlendMode, HeadingPitchRoll, Transforms, Model, PolygonHierarchy, PolylineGraphics, ColorMaterialProperty, Primitive, Cesium3DTileFeature, SceneMode, GeoJsonDataSource, Cesium3DTileStyle, HeadingPitchRange, Cesium3DTileColorBlendMode, Ion, KmlDataSource, SceneTransforms, EllipsoidTerrainProvider, IonImageryProvider, createWorldImagery, createWorldImageryAsync, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, CesiumTerrainProvider, CesiumInspector, OrthographicFrustum, defined, ClockRange, EasingFunction, NearFarScalar, Cesium3DTileset, Matrix4, Matrix3, IonResource, EllipsoidGeodesic, sampleTerrainMostDetailed, PolygonPipeline, BoundingSphere, GeometryInstance, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, PolylineDashMaterialProperty, ScreenSpaceEventHandler, ScreenSpaceEventType, Quaternion, CzmlDataSource, Intersect, Fullscreen } from 'cesium';
 
 const TIME_LAG = 300;
 const POSITION_CHECK_TIMER = 950;
@@ -1368,6 +1368,9 @@ var CesiumAnimatedProperty;
     }
     CesiumAnimatedProperty.AnimatePositionSeries = AnimatePositionSeries;
     function GetSeriesPossesForHistoricEntity(viewer, heightRef, historic) {
+        if (!historic || !historic.length) {
+            return [];
+        }
         const series = [];
         for (let i = 0; i < historic.length; i++) {
             const item = historic[i];
@@ -1406,25 +1409,6 @@ var CesiumAnimatedProperty;
         return series;
     }
     CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity = GetSeriesPossesForHistoricEntity;
-    /**
-     * Animates a tileset position and heading from a series of positions over time.
-     * Unlike other animation functions that directly modify the tileset,
-     * this provides a callback with calculated values for the caller to apply.
-     *
-     * Example:
-     * ```
-     * const dispose = CesiumAnimatedProperty.AnimateTPositionSeries({
-     *    viewer: viewer,
-     *    posses: positionSeries,
-     *    onUpdate: (position, heading) => {}
-     * });
-     *
-     * // To dispose:
-     * dispose();
-     * ```
-     * @param params Animation parameters
-     * @returns Function to stop the animation
-     */
     class AnimateTPositionSeries {
         constructor(params) {
             // Cache for calculated values.
@@ -1432,23 +1416,74 @@ var CesiumAnimatedProperty;
             this.lastCalcPos3d = null;
             this.lastCalcHeading = null;
             this.removal = null;
+            // Track the timeline range for which we have data.
+            this.minDate = null;
+            this.maxDate = null;
+            // Map of positions by timestamp for quick lookup and deduplication.
+            this.positionsMap = new Map();
             this.viewer = params.viewer;
             this.onUpdate = params.onUpdate;
             this.onDone = params.onDone;
-            // No positions to animate.
-            if (!params.posses || params.posses.length === 0) {
-                return;
+            this.onRangeChangeCallback = params.onRangeChange;
+            // Initialize the positions map
+            this.positionsMap = new Map();
+            // Add initial positions
+            if (params.posses && params.posses.length > 0) {
+                this.addPositions(params.posses);
             }
-            // Order positions by date.
-            const orderedPosses = [...params.posses].sort((a, b) => {
-                return a.dateTime.getTime() - b.dateTime.getTime();
-            });
-            // Process headings - if all are null or 0, assume all are null.
-            this.positions = this.processHeadings([...orderedPosses]);
             // Set up the animation loop.
             this.removal = this.viewer.scene.postUpdate.addEventListener(() => this.update());
             this.update();
         }
+        /**
+         * Add new positions to the animation.
+         * Will deduplicate positions with the same timestamp and sort them.
+         * @param newPositions Positions to add
+         */
+        addPositions(newPositions) {
+            if (!newPositions || newPositions.length === 0) {
+                return;
+            }
+            // Add new positions to our map, overwriting any existing positions with the same timestamp
+            for (const pos of newPositions) {
+                const key = pos.dateTime.toISOString();
+                this.positionsMap.set(key, pos);
+            }
+            // Rebuild our sorted array from the map
+            this.positions = Array.from(this.positionsMap.values()).sort((a, b) => {
+                return a.dateTime.getTime() - b.dateTime.getTime();
+            });
+            // Process headings
+            this.positions = this.processHeadings([...this.positions]);
+            // Update our min/max dates
+            if (this.positions.length > 0) {
+                const first = this.positions[0];
+                const last = this.positions[this.positions.length - 1];
+                if (!this.minDate || first.dateTime < this.minDate) {
+                    this.minDate = first.dateTime;
+                }
+                if (!this.maxDate || last.dateTime > this.maxDate) {
+                    this.maxDate = last.dateTime;
+                }
+            }
+        }
+        /**
+         * Get the current date range covered by our positions.
+         */
+        getDateRange() {
+            return {
+                minDate: this.minDate,
+                maxDate: this.maxDate
+            };
+        }
+        /**
+         * Trigger the onRangeChange callback to request more data.
+         */
+        onRangeChange() {
+            if (this.onRangeChangeCallback) {
+                this.onRangeChangeCallback();
+            }
+        }
         /**
          * Stop the animation and call the onDone callback if provided.
          */
@@ -1462,9 +1497,12 @@ var CesiumAnimatedProperty;
             }
         }
         /**
-         * Update function called on each frame.
+         * Update function called on each render frame.
          */
         update() {
+            if (!this.positions || this.positions.length === 0) {
+                return;
+            }
             let now = this.viewer.scene.lastRenderTime;
             if (!now) {
                 now = this.viewer.clock.currentTime;
@@ -1506,11 +1544,19 @@ var CesiumAnimatedProperty;
             return posses;
         }
         /**
-         * Calculate the position at the given time
+         * Calculate the position at the given time.
          */
         calculatePosition(currentTimeMs) {
             const posses = this.positions;
-            // See if we're before the first position
+            // No positions to interpolate
+            if (!posses || posses.length === 0) {
+                return {
+                    pos3d: new Cartesian3(),
+                    indexLast: -1,
+                    indexNext: -1
+                };
+            }
+            // See if we're before the first position.
             if (currentTimeMs <= posses[0].dateTime.getTime()) {
                 return {
                     pos3d: posses[0].pos3d,
@@ -1518,7 +1564,7 @@ var CesiumAnimatedProperty;
                     indexNext: 0
                 };
             }
-            // See if we're after the last position
+            // See if we're after the last position.
             if (currentTimeMs >= posses[posses.length - 1].dateTime.getTime()) {
                 const lastIndex = posses.length - 1;
                 return {
@@ -1527,35 +1573,41 @@ var CesiumAnimatedProperty;
                     indexNext: lastIndex
                 };
             }
-            // Find the current position
+            // Binary search to find the closest position.
+            let start = 0;
+            let end = posses.length - 1;
             let lastIndex = 0;
-            for (let i = 1; i < posses.length; i++) {
-                let pos = posses[i];
-                if (currentTimeMs >= pos.dateTime.getTime()) {
-                    lastIndex = i;
+            while (start <= end) {
+                const mid = Math.floor((start + end) / 2);
+                const midTime = posses[mid].dateTime.getTime();
+                if (midTime <= currentTimeMs) {
+                    lastIndex = mid;
+                    start = mid + 1;
                 }
                 else {
-                    break;
+                    end = mid - 1;
                 }
             }
             const last = posses[lastIndex];
-            const next = posses[lastIndex + 1];
-            // If no next position, use the last one
-            if (!next) {
+            const nextIndex = Math.min(lastIndex + 1, posses.length - 1);
+            const next = posses[nextIndex];
+            // If we found an exact match or there's no next position.
+            if (currentTimeMs === last.dateTime.getTime() || lastIndex === nextIndex) {
                 return {
                     pos3d: last.pos3d,
                     indexLast: lastIndex,
                     indexNext: lastIndex
                 };
             }
-            // Interpolate the position
-            const progress = (currentTimeMs - last.dateTime.getTime()) /
-                (next.dateTime.getTime() - last.dateTime.getTime());
+            // Interpolate between the two closest positions.
+            const lastTime = last.dateTime.getTime();
+            const nextTime = next.dateTime.getTime();
+            const progress = (currentTimeMs - lastTime) / (nextTime - lastTime);
             const interpolatedPos = Cartesian3.lerp(last.pos3d, next.pos3d, progress, new Cartesian3());
             return {
                 pos3d: interpolatedPos,
                 indexLast: lastIndex,
-                indexNext: lastIndex + 1
+                indexNext: nextIndex
             };
         }
         /**
@@ -5238,6 +5290,12 @@ async function getStyle(api, entity, styleId) {
 
 const CESIUM_INSPECTOR_KEY = "_nextspace_inspector";
 const CESIUM_TIMELINE_KEY = "_nextspace_timeline";
+const CESIUM_TIMELINE_LIVE_KEY = "_nextspace_timeline_live";
+const CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY = "_nextspace_timeline_live_padding_forward";
+const CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY = "_nextspace_timeline_live_padding_backward";
+const CESIUM_TIMELINE_INTERVAL_KEY = "_nextspace_timeline_interval";
+const DEFAULT_LIVE_PADDING_FORWARD_SECONDS = 5 * 60;
+const DEFAULT_LIVE_PADDING_BACKWARD_SECONDS = 25 * 60;
 var ViewUtils;
 (function (ViewUtils) {
     function GatherLegacyMapTiles(params) {
@@ -5460,7 +5518,10 @@ var ViewUtils;
             currentTimeIso: clock.currentTime.toString(),
             stopTime: clock.stopTime,
             stopTimeIso: clock.stopTime.toString(),
-            areCesiumValues: clock[CESIUM_TIMELINE_KEY] != true
+            areCesiumValues: clock[CESIUM_TIMELINE_KEY] != true,
+            isLive: clock[CESIUM_TIMELINE_LIVE_KEY] == true,
+            livePaddingForwardSeconds: clock[CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY] || DEFAULT_LIVE_PADDING_FORWARD_SECONDS,
+            livePaddingBackwardSeconds: clock[CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY] || DEFAULT_LIVE_PADDING_BACKWARD_SECONDS
         };
     }
     ViewUtils.GetTimeDetails = GetTimeDetails;
@@ -5518,8 +5579,59 @@ var ViewUtils;
         }
         viewer.scene.requestRender();
         clock[CESIUM_TIMELINE_KEY] = true;
+        clock[CESIUM_TIMELINE_LIVE_KEY] = params.isLive == true;
+        clock[CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY] = params.livePaddingSeconds || DEFAULT_LIVE_PADDING_FORWARD_SECONDS;
+        clock[CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY] = params.livePaddingSeconds || DEFAULT_LIVE_PADDING_BACKWARD_SECONDS;
+        if (params.isLive) {
+            startLive(viewer);
+        }
+        else {
+            stopLive(viewer);
+        }
     }
     ViewUtils.SetTimeDetails = SetTimeDetails;
+    function startLive(viewer) {
+        if (viewer[CESIUM_TIMELINE_INTERVAL_KEY]) {
+            // Already live.
+            return;
+        }
+        const doUpdate = () => {
+            if (!viewer || viewer.isDestroyed() || !viewer.scene) {
+                stopLive(viewer);
+                return;
+            }
+            // Get the current settings.
+            const tDetails = GetTimeDetails({ viewer });
+            const clock = viewer.clock;
+            if (clock) {
+                clock.shouldAnimate = true;
+                clock.multiplier = 1;
+                clock.currentTime = JulianDate.now();
+                clock.startTime = JulianDate.addSeconds(clock.currentTime, -tDetails.livePaddingBackwardSeconds, new JulianDate());
+                clock.stopTime = JulianDate.addSeconds(clock.currentTime, tDetails.livePaddingForwardSeconds, new JulianDate());
+                clock.clockRange = ClockRange.UNBOUNDED;
+            }
+        };
+        // We'll start an interval that occasionally updates the Cesium clock to stay in the desired settings.
+        // Since it moves live (1 second per second), we don't have to worry about the ranges being out of date quickly.
+        viewer[CESIUM_TIMELINE_INTERVAL_KEY] = setInterval(() => {
+            doUpdate();
+        }, 800);
+        viewer[CESIUM_TIMELINE_LIVE_KEY] = true;
+        // Initial update.
+        doUpdate();
+    }
+    function stopLive(viewer) {
+        if (!viewer) {
+            return;
+        }
+        let interval = viewer[CESIUM_TIMELINE_INTERVAL_KEY];
+        if (interval) {
+            clearInterval(interval);
+            viewer[CESIUM_TIMELINE_INTERVAL_KEY] = null;
+        }
+        viewer[CESIUM_TIMELINE_LIVE_KEY] = false;
+    }
 })(ViewUtils || (ViewUtils = {}));
 
 const MODEL_MIN_RADIUS = 10;
@@ -13169,14 +13281,16 @@ var BatchedDataGetter;
             }
             return this.onUpdate;
         }
-        constructor(data, viewPort, batchSize) {
+        constructor(data, viewPort, batchSize, singleEmit = false) {
             this.viewPortRemoval = null;
             this.viewRect = null;
             this.viewCenter = null;
             this.onUpdate = null;
+            this.emitted = false;
             this.data = data;
             this.viewPort = viewPort;
             this.batchSize = batchSize;
+            this.singleEmit = singleEmit;
         }
         Start() {
             this.viewPortRemoval = this.viewPort.Updated().Subscribe(() => {
@@ -13207,6 +13321,10 @@ var BatchedDataGetter;
             }
         }
         startGetterLoop() {
+            if (this.singleEmit && this.emitted) {
+                return;
+            }
+            this.emitted = true;
             clearInterval(this.getterInterval);
             if (!this.viewRect || !this.viewCenter) {
                 return;
@@ -13939,19 +14057,6 @@ var EntitiesLoadedRenderManager;
 })(EntitiesLoadedRenderManager || (EntitiesLoadedRenderManager = {}));
 
 const BATCH_SIZE$2 = 500;
-function getValue$4(viewer, obj) {
-    if (obj === null || obj === void 0 ? void 0 : obj.getValue) {
-        let date = viewer.scene.lastRenderTime;
-        if (!date) {
-            date = viewer.clock.currentTime;
-        }
-        return obj.getValue(date);
-    }
-    return obj;
-}
-function colorToCColor$3(color) {
-    return new Color(color.red ? color.red / 255 : 0, color.green ? color.green / 255 : 0, color.blue ? color.blue / 255 : 0, color.alpha);
-}
 /**
  * Render manager for rendering an array of entity ids.
  * This will render them in batches to avoid overloading the viewer.
@@ -13968,23 +14073,27 @@ var EntitiesIdsRenderManager;
             this.getterSub = null;
             this.disposed = false;
             this.renderedEntities = {};
-            this.sources = [];
-            // Highly experimental flag to try improve rendering large sets of polygons and polylines.
-            // Many things are not supported when this is enabled.
-            this.useGeojson = false;
+            // Callback to dispose the monitoring of the viewer's timeline for historic data.
+            this.viewerDateTimeChangeRemoval = null;
+            // Entity ID -> historic information on the Entity.
+            // This helps us manage what needs changing whenever we receive the same Entity update, or when the timeline range changes.
+            this.entitiesHistoric = {};
+            // Queue for renderAsIndividuals to avoid concurrent calls.
+            this.renderQueueActive = false;
+            this.renderQueue = [];
+            this.renderQueueForceFlags = [];
             const { viewer, apiGetter, monitor, item, register: visualsManager } = params;
             this.viewer = viewer;
             this.apiGetter = apiGetter;
             this.monitor = monitor;
             this.item = item;
             this.visualsManager = visualsManager;
-            this.useGeojson = item.renderAsGeojson == true;
             if (this.item.enableClustering) {
                 this.clustering = new PointClustering(visualsManager, this.item.id, (_a = this.item) === null || _a === void 0 ? void 0 : _a.clustering);
             }
         }
         Init() {
-            var _a;
+            var _a, _b, _c;
             if (this.disposed) {
                 throw (new Error("This item is disposed."));
             }
@@ -14004,15 +14113,19 @@ var EntitiesIdsRenderManager;
             if (this.renderPriority == null) {
                 this.renderPriority = 2;
             }
-            if (this.renderAsGeojson && this.item.CameraZoomSettings.length > 1) {
-                console.warn("Geojson rendering does not support multiple zoom controls. Only the first one will be used.");
-                this.item.CameraZoomSettings = [this.item.CameraZoomSettings[0]];
-            }
-            this.getter = new BatchedDataGetter.Getter(this.item.BruceEntity.EntityIds, this.monitor, BATCH_SIZE$2);
+            this.getter = new BatchedDataGetter.Getter(this.item.BruceEntity.EntityIds, this.monitor, BATCH_SIZE$2, 
+            // Don't emit the same Entity multiple times.
+            true);
             this.getterSub = this.getter.OnUpdate.Subscribe((ids) => {
                 this.onGetterUpdate(ids);
             });
             this.getter.Start();
+            if (((_b = this.item.BruceEntity) === null || _b === void 0 ? void 0 : _b.historic) || ((_c = this.item.BruceEntity) === null || _c === void 0 ? void 0 : _c.historicAttrKey)) {
+                this.viewerDateTimeSub();
+            }
+            else {
+                this.viewerDateTimeDispose();
+            }
         }
         Dispose() {
             if (this.disposed) {
@@ -14030,11 +14143,11 @@ var EntitiesIdsRenderManager;
             });
             (_b = this.clustering) === null || _b === void 0 ? void 0 : _b.Dispose();
             this.clustering = null;
-            for (let i = 0; i < this.sources.length; i++) {
-                const source = this.sources[i];
-                this.viewer.dataSources.remove(source);
-            }
-            this.sources = [];
+            this.viewerDateTimeDispose();
+            // Clear render queue when disposed
+            this.renderQueue = [];
+            this.renderQueueForceFlags = [];
+            this.renderQueueActive = false;
         }
         async ReRender(params) {
             let { entityIds, force, entities } = params;
@@ -14069,10 +14182,6 @@ var EntitiesIdsRenderManager;
             }
             if (CameraZoomSettings === null || CameraZoomSettings === void 0 ? void 0 : CameraZoomSettings.length) {
                 this.item.CameraZoomSettings = CameraZoomSettings;
-                if (this.renderAsGeojson && this.item.CameraZoomSettings.length > 1) {
-                    console.warn("Geojson rendering does not support multiple zoom controls. Only the first one will be used.");
-                    this.item.CameraZoomSettings = [this.item.CameraZoomSettings[0]];
-                }
             }
             if (queueRerender != false) {
                 const entityIds = Object.keys(this.renderedEntities);
@@ -14084,15 +14193,25 @@ var EntitiesIdsRenderManager;
             }
         }
         async onGetterUpdate(entityIds, force = false) {
-            if (this.disposed || this.viewer.isDestroyed()) {
+            if (this.disposed || this.viewer.isDestroyed() || !(entityIds === null || entityIds === void 0 ? void 0 : entityIds.length)) {
                 return;
             }
             try {
                 const api = this.apiGetter.getApi();
+                let newDateTime = null;
+                if (this.item.BruceEntity.historic || this.item.BruceEntity.historicAttrKey) {
+                    newDateTime = JulianDate.toDate(this.viewer.clock.currentTime).toISOString();
+                }
                 const { entities } = await Entity$1.GetListByIds({
                     api,
                     entityIds,
-                    migrated: true
+                    historicPoint: newDateTime,
+                    historicKey: this.item.BruceEntity.historicAttrKey,
+                    migrated: true,
+                    // If we're taking 5+ minutes to make a query, it's a dud.
+                    // This is a timeout imposed on our DB and not external sources.
+                    // Honestly could lower down to 30 seconds, but we'll keep it high for now.
+                    maxSearchTimeSec: 60 * 5,
                 });
                 await this.renderEntities(entities, force);
             }
@@ -14101,347 +14220,82 @@ var EntitiesIdsRenderManager;
             }
         }
         async renderEntities(entities, force = false) {
-            if (this.disposed || this.viewer.isDestroyed()) {
+            if (this.disposed || this.viewer.isDestroyed() || !(entities === null || entities === void 0 ? void 0 : entities.length)) {
                 return;
             }
             try {
-                if (this.useGeojson) {
-                    const zoomItem = this.item.CameraZoomSettings[0];
-                    if (zoomItem.DisplayType == ZoomControl.EDisplayType.Point) {
-                        // We'll just render these as individuals since we don't support point geojson.
-                        await this.renderAsIndividuals(entities, force);
-                    }
-                    else {
-                        await this.renderAsGeojson(entities, force);
-                    }
-                }
-                else {
-                    await this.renderAsIndividuals(entities, force);
-                }
+                await this.queueRenderAsIndividuals(entities, force);
             }
             catch (e) {
                 console.error(e);
             }
         }
         /**
-         * Our optimized and more stable path.
-         * We construct a geojson that we draw in one go.
-         * @param entities
-         * @param force TODO: This should re-render entities that are already rendered.
+         * Queues a render operation to be processed in sequence.
+         * If an operation is already in progress, this will be added to the queue.
          */
-        async renderAsGeojson(entities, force) {
-            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-            entities = entities.filter((entity) => {
-                var _a;
-                return !this.renderedEntities[(_a = entity.Bruce) === null || _a === void 0 ? void 0 : _a.ID];
-            });
-            // Mark these as rendered.
-            entities.forEach((entity) => {
-                var _a;
-                this.renderedEntities[(_a = entity.Bruce) === null || _a === void 0 ? void 0 : _a.ID] = true;
-            });
-            // This process only supports a single zoom control item.
-            const zoomItem = this.item.CameraZoomSettings[0];
-            // If we're after 3d models then we'll check if there are LODs and render those as individuals.
-            if (zoomItem.DisplayType == ZoomControl.EDisplayType.Model3D && entities.length) {
-                const { lods } = await EntityLod.GetLods({
-                    api: this.apiGetter.getApi(),
-                    filter: {
-                        externalSources: false,
-                        Items: entities.map(x => {
-                            var _a, _b;
-                            return {
-                                entityId: (_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.ID,
-                                categoryId: (_b = zoomItem.LODCategoryID) !== null && _b !== void 0 ? _b : "GLB",
-                                group: "DEFAULT",
-                                level: Number(zoomItem.LODLevel)
-                            };
-                        }),
-                        strict: false
-                    }
-                });
-                if (this.disposed) {
-                    this.doDispose();
-                    return;
-                }
-                const withLods = lods.filter(x => x.entityId && !!x.clientFileId).map(x => x.entityId);
-                const individuals = entities.filter((entity) => {
-                    var _a;
-                    return withLods.includes((_a = entity.Bruce) === null || _a === void 0 ? void 0 : _a.ID);
-                });
-                if (individuals.length) {
-                    this.renderAsIndividuals(individuals, force);
-                }
-                // Now we proceed with what is left.
-                entities = entities.filter((entity) => {
-                    var _a;
-                    return !withLods.includes((_a = entity.Bruce) === null || _a === void 0 ? void 0 : _a.ID);
-                });
-            }
-            if (!entities.length) {
+        async queueRenderAsIndividuals(entities, force = false) {
+            if (this.disposed) {
                 return;
             }
-            let style = null;
-            if ((zoomItem === null || zoomItem === void 0 ? void 0 : zoomItem.StyleID) && (zoomItem === null || zoomItem === void 0 ? void 0 : zoomItem.StyleID) > -1) {
-                try {
-                    style = (_a = (await Style.Get({
-                        api: this.apiGetter.getApi(),
-                        styleId: zoomItem === null || zoomItem === void 0 ? void 0 : zoomItem.StyleID
-                    })).style) === null || _a === void 0 ? void 0 : _a.Settings;
-                }
-                // Probably deleted.
-                catch (e) {
-                    console.error(e);
-                }
+            // If no active render is happening, start processing immediately.
+            if (!this.renderQueueActive) {
+                this.renderQueueActive = true;
+                await this.processRenderQueue(entities, force);
+                return;
             }
-            let entityTypeId = (_b = this.item.BruceEntity) === null || _b === void 0 ? void 0 : _b["EntityType.ID"];
-            if (!entityTypeId) {
-                entityTypeId = (_d = (_c = entities.find(x => { var _a; return !!((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a["EntityType.ID"]); })) === null || _c === void 0 ? void 0 : _c.Bruce) === null || _d === void 0 ? void 0 : _d["EntityType.ID"];
+            // Otherwise, add to the queue.
+            this.renderQueue.push(entities);
+            this.renderQueueForceFlags.push(force);
+        }
+        /**
+         * Processes the render queue, handling one rendering operation at a time.
+         */
+        async processRenderQueue(initialEntities, initialForce = false) {
+            if (this.disposed) {
+                this.renderQueueActive = false;
+                return;
             }
-            // Getting type regardless cause it's needed for name calculations.
-            let entityType;
-            if (entityTypeId) {
-                // Try using the Entity Type default if one is specified in the menu item.
-                try {
-                    entityType = (_e = (await EntityType.Get({
-                        entityTypeId: entityTypeId,
-                        api: this.apiGetter.getApi()
-                    }))) === null || _e === void 0 ? void 0 : _e.entityType;
-                    if (!style && entityType) {
-                        if (entityType["DisplaySetting.ID"] && entityType["DisplaySetting.ID"] > 0) {
-                            style = (_f = (await Style.Get({
-                                api: this.apiGetter.getApi(),
-                                styleId: entityType["DisplaySetting.ID"]
-                            })).style) === null || _f === void 0 ? void 0 : _f.Settings;
+            try {
+                // Process the initial batch.
+                await this.renderAsIndividuals(initialEntities, initialForce);
+                if (this.disposed) {
+                    return;
+                }
+                // Process any queued items.
+                while (this.renderQueue.length > 0 && !this.disposed) {
+                    // If multiple entities are waiting, combine them to reduce render operations.
+                    const allEntities = [];
+                    const forces = [];
+                    // Collect all pending entities.
+                    while (this.renderQueue.length > 0) {
+                        const entities = this.renderQueue.shift();
+                        const force = this.renderQueueForceFlags.shift();
+                        if (entities && entities.length > 0) {
+                            allEntities.push(...entities);
+                            forces.push(force);
                         }
                     }
+                    if (allEntities.length > 0) {
+                        // If any are forced, we need to force the render.
+                        const combinedForce = forces.some(f => f === true);
+                        const uniqueEntities = this.deduplicateEntities(allEntities);
+                        await this.renderAsIndividuals(uniqueEntities, combinedForce);
+                    }
                 }
-                catch (e) {
-                    console.error(e);
-                }
-            }
-            const pStyle = (_g = style === null || style === void 0 ? void 0 : style.polygonStyle) !== null && _g !== void 0 ? _g : {};
-            const lStyle = (_h = style === null || style === void 0 ? void 0 : style.polylineStyle) !== null && _h !== void 0 ? _h : {};
-            const polygonsClamped = ((_j = pStyle === null || pStyle === void 0 ? void 0 : pStyle.altitudeOption) === null || _j === void 0 ? void 0 : _j.id) == null ? true : ((_k = pStyle === null || pStyle === void 0 ? void 0 : pStyle.altitudeOption) === null || _k === void 0 ? void 0 : _k.id) == 0;
-            const bFillColor = Calculator.GetColor(pStyle.fillColor, {}, []);
-            const cFillColor = bFillColor ? colorToCColor$3(bFillColor) : Color.fromCssColorString("rgba(139, 195, 74, 0.8)");
-            const bLineColor = Calculator.GetColor(pStyle.lineColor, {}, []);
-            const cLineColor = bLineColor ? colorToCColor$3(bLineColor) : Color.fromCssColorString("rgba(80, 80, 80, 0.8)");
-            let lineWidthPx = pStyle.lineWidth ? Calculator.GetNumber(pStyle.lineWidth, {}, []) : null;
-            if (lineWidthPx == null) {
-                lineWidthPx = 1;
             }
-            lineWidthPx = EnsureNumber(lineWidthPx);
-            if (lineWidthPx < 0.01) {
-                lineWidthPx = 0;
+            finally {
+                this.renderQueueActive = false;
             }
-            lineWidthPx = Math.round(lineWidthPx);
-            const collection = {
-                features: [],
-                type: "FeatureCollection"
-            };
-            for (let i = 0; i < entities.length; i++) {
-                const entity = entities[i];
-                const feature = Geometry.ToGeoJsonFeature({
-                    geometry: entity.Bruce.VectorGeometry,
-                    noAltitude: polygonsClamped && lineWidthPx <= 0,
-                    altitude: lineWidthPx > 0 && polygonsClamped ? 1 : null,
-                    properties: {
-                        ...entity,
-                        Bruce: {
-                            ...entity.Bruce,
-                            // Exclude as we just converted it to geojson.
-                            VectorGeometry: null
-                        }
-                    }
-                });
-                if (feature) {
-                    collection.features.push(feature);
+        }
+        deduplicateEntities(entities) {
+            const entityMap = new Map();
+            for (const entity of entities) {
+                if (entity && entity.Bruce && entity.Bruce.ID) {
+                    entityMap.set(entity.Bruce.ID, entity);
                 }
             }
-            // Anything that failed to turn into geojson or points we'll render as individuals.
-            const individuals = entities.filter((entity) => {
-                const feature = collection.features.find(x => { var _a, _b; return ((_b = (_a = x.properties) === null || _a === void 0 ? void 0 : _a.Bruce) === null || _b === void 0 ? void 0 : _b.ID) == entity.Bruce.ID; });
-                if (!feature) {
-                    return true;
-                }
-                if (feature.geometry.type == "Point") {
-                    return true;
-                }
-                return false;
-            });
-            if (individuals.length) {
-                this.renderAsIndividuals(individuals, force);
-            }
-            // Filter out points (the ones we just rendered as individuals).
-            collection.features = collection.features.filter(x => x.geometry.type != "Point");
-            // If there is nothing to render now, return.
-            if (!collection.features.length) {
-                return;
-            }
-            const source = await GeoJsonDataSource.load(collection, {
-                stroke: cLineColor,
-                fill: cFillColor,
-                strokeWidth: lineWidthPx,
-                clampToGround: lineWidthPx <= 0 && polygonsClamped
-            });
-            this.viewer.dataSources.add(source);
-            this.sources.push(source);
-            if (this.disposed) {
-                this.doDispose();
-                return;
-            }
-            const groups = [];
-            /**
-             * Applies individual styling to a rendered entity.
-             * This will exclude tag styling for now since it's harder to load that on the fly.
-             * @param thing
-             * @param entityId
-             * @param data
-             * @returns
-             */
-            const applyStyle = (thing, entityId, data) => {
-                if (thing.polygon) {
-                    const bFillColor = Calculator.GetColor(pStyle.fillColor, data, []);
-                    const cFillColor = bFillColor ? colorToCColor$3(bFillColor) : Color.fromCssColorString("rgba(139, 195, 74, 0.8)");
-                    const bLineColor = Calculator.GetColor(pStyle.lineColor, data, []);
-                    const cLineColor = bLineColor ? colorToCColor$3(bLineColor) : Color.fromCssColorString("rgba(80, 80, 80, 0.8)");
-                    let width = pStyle.lineWidth ? Calculator.GetNumber(pStyle.lineWidth, data, []) : null;
-                    if (width == null) {
-                        width = 1;
-                    }
-                    width = EnsureNumber(width);
-                    if (width < 0.01) {
-                        width = 0;
-                    }
-                    let curFillColor = getValue$4(this.viewer, thing.polygon.material);
-                    if (curFillColor && curFillColor instanceof ColorMaterialProperty) {
-                        curFillColor = curFillColor.color;
-                    }
-                    let curLineColor = getValue$4(this.viewer, thing.polygon.outlineColor);
-                    if (curLineColor && curLineColor instanceof ColorMaterialProperty) {
-                        curLineColor = curLineColor.color;
-                    }
-                    const curWidth = getValue$4(this.viewer, thing.polygon.outlineWidth);
-                    if ((curFillColor instanceof Color && curFillColor.equals(cFillColor)) &&
-                        (curLineColor instanceof Color && curLineColor.equals(cLineColor)) &&
-                        curWidth == width) {
-                        return;
-                    }
-                    thing.polygon.material = new ColorMaterialProperty(cFillColor);
-                    thing.polygon.outlineColor = new ConstantProperty(cLineColor);
-                    thing.polygon.outlineWidth = new ConstantProperty(width);
-                }
-                else if (thing.polyline) {
-                    const bColor = lStyle.lineColor ? Calculator.GetColor(lStyle.lineColor, data, []) : null;
-                    const cColor = bColor ? colorToCColor$3(bColor) : Color.fromCssColorString("rgba(255, 193, 7, 0.8)");
-                    let width = lStyle.lineWidth ? Calculator.GetNumber(lStyle.lineWidth, data, []) : null;
-                    if (width == null) {
-                        width = 2;
-                    }
-                    width = EnsureNumber(width);
-                    if (width < 0.01) {
-                        width = 0;
-                    }
-                    let curColor = getValue$4(this.viewer, thing.polyline.material);
-                    if (curColor && curColor instanceof ColorMaterialProperty) {
-                        curColor = curColor.color;
-                    }
-                    const curWidth = getValue$4(this.viewer, thing.polyline.width);
-                    if ((curColor instanceof Color && curColor.equals(cColor)) &&
-                        curWidth == width) {
-                        return;
-                    }
-                    thing.polyline.material = new ColorMaterialProperty(cColor);
-                    thing.polyline.width = new ConstantProperty(width);
-                }
-            };
-            let toForceUpdate = [];
-            /**
-             * Registers a given cesium entity produced from rendering geojson.
-             * Since one nextspace entity can have multiple cesium entities, there is special logic to group them together.
-             * @param thing
-             * @returns
-             */
-            const register = (thing) => {
-                var _a, _b, _c, _d;
-                // See if the cesium entity already exists in a group.
-                let group = groups.find((x) => { var _a; return ((_a = x.visual) === null || _a === void 0 ? void 0 : _a.id) == thing.id || x.siblings.find(x => (x === null || x === void 0 ? void 0 : x.id) == thing.id); });
-                if (group) {
-                    return;
-                }
-                const metadata = getValue$4(this.viewer, thing === null || thing === void 0 ? void 0 : thing.properties);
-                const entityId = (_a = metadata === null || metadata === void 0 ? void 0 : metadata.Bruce) === null || _a === void 0 ? void 0 : _a.ID;
-                if (!entityId) {
-                    return;
-                }
-                // Find group for the nextspace entity ID.
-                group = groups.find((x) => x.entityId == entityId);
-                // No group yet. We can designate this as the primary entity and create a new group for it.
-                if (!group) {
-                    group = {
-                        entityId: entityId,
-                        visual: thing,
-                        tagIds: (_b = metadata === null || metadata === void 0 ? void 0 : metadata.Bruce) === null || _b === void 0 ? void 0 : _b["Layer.ID"],
-                        entityTypeId: (_c = metadata === null || metadata === void 0 ? void 0 : metadata.Bruce) === null || _c === void 0 ? void 0 : _c["EntityType.ID"],
-                        siblings: [],
-                        data: entities.find(x => { var _a; return ((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.ID) == entityId; }),
-                        rego: null
-                    };
-                    groups.push(group);
-                    applyStyle(thing, entityId, group.data);
-                    const rego = {
-                        entityId: entityId,
-                        menuItemId: this.item.id,
-                        menuItemType: this.item.Type,
-                        visual: thing,
-                        priority: this.renderPriority,
-                        entityTypeId: group.entityTypeId,
-                        accountId: this.apiGetter.accountId,
-                        tagIds: group.tagIds ? [].concat(group.tagIds) : [],
-                        name: entityType ? (_d = Entity$1.CalculateName({
-                            entity: group.data,
-                            type: entityType,
-                            defaultToId: false
-                        })) !== null && _d !== void 0 ? _d : "Unnamed Entity" : "Unnamed Entity",
-                        cdn: this.item.cdnEnabled,
-                        collection: source.entities
-                    };
-                    group.rego = rego;
-                    this.visualsManager.AddRego({
-                        rego,
-                        requestRender: false
-                    });
-                }
-                // Found a group. We flag this as a sibling entity of the primary.
-                else {
-                    applyStyle(thing, entityId, group.data);
-                    group.siblings.push(thing);
-                    group.visual._siblingGraphics = group.siblings;
-                    thing._parentEntity = group.visual;
-                    if (group.rego) {
-                        this.visualsManager.RefreshMark({
-                            rego: group.rego
-                        });
-                        if (!toForceUpdate.includes(entityId)) {
-                            toForceUpdate.push(entityId);
-                        }
-                    }
-                }
-            };
-            const sEntities = source.entities.values;
-            for (let i = 0; i < sEntities.length; i++) {
-                const cEntity = sEntities[i];
-                register(cEntity);
-            }
-            if (toForceUpdate.length) {
-                this.visualsManager.ForceUpdate({
-                    entityIds: toForceUpdate,
-                    refreshColors: true,
-                    requestRender: false
-                });
-            }
-            this.viewer.scene.requestRender();
+            return Array.from(entityMap.values());
         }
         /**
          * Our default path.
@@ -14452,16 +14306,28 @@ var EntitiesIdsRenderManager;
          */
         async renderAsIndividuals(entities, force = false) {
             var _a;
+            if (this.disposed || this.viewer.isDestroyed() || !entities.length) {
+                return;
+            }
+            let entitiesHistoric = {};
+            if ((this.item.BruceEntity.historic || this.item.BruceEntity.historicAttrKey) && entities.length) {
+                entitiesHistoric = await this.getHistoricInfo(entities);
+            }
             const { updated, entities: cEntities } = await EntityRenderEngine.Render({
                 viewer: this.viewer,
                 apiGetter: this.apiGetter,
                 entities: entities,
                 menuItemId: this.item.id,
                 visualRegister: this.visualsManager,
+                entitiesHistoric: entitiesHistoric,
+                entityHistoricDrawTrack: this.item.historicDrawTrack,
                 zoomControl: this.item.CameraZoomSettings,
                 force
             });
             for (let i = 0; i < entities.length; i++) {
+                if (this.disposed) {
+                    break;
+                }
                 const entity = entities[i];
                 const id = entity.Bruce.ID;
                 const cEntity = cEntities.get(id);
@@ -14510,11 +14376,144 @@ var EntitiesIdsRenderManager;
                     (_a = this.clustering) === null || _a === void 0 ? void 0 : _a.RemoveEntity(id, false);
                 }
             }
-            this.viewer.scene.requestRender();
-            if (this.clustering && entities.length) {
-                this.clustering.Update();
+            if (!this.disposed) {
+                this.viewer.scene.requestRender();
+                if (this.clustering && entities.length) {
+                    this.clustering.Update();
+                }
             }
         }
+        /**
+         * Returns historic information for the given set of Entities at the current timeline range.
+         * @param entities
+         */
+        async getHistoricInfo(entities) {
+            const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
+            const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
+            let rangesToRequest = [{
+                    start: startTmp.toISOString(),
+                    stop: stopTmp.toISOString()
+                }];
+            // If we already have cached data, determine what ranges we're missing.
+            if (this.lastHistoricMin && this.lastHistoricMax && Object.keys(this.entitiesHistoric).length >= entities.length) {
+                const cachedStart = new Date(this.lastHistoricMin).getTime();
+                const cachedStop = new Date(this.lastHistoricMax).getTime();
+                const newStart = startTmp.getTime();
+                const newStop = stopTmp.getTime();
+                // Complete overlap - we already have all the data.
+                if (newStart >= cachedStart && newStop <= cachedStop) {
+                    return this.entitiesHistoric;
+                }
+                // Calculate missing ranges.
+                rangesToRequest = [];
+                // Check if we need data before our cached range.
+                if (newStart < cachedStart) {
+                    rangesToRequest.push({
+                        start: startTmp.toISOString(),
+                        stop: new Date(cachedStart).toISOString()
+                    });
+                }
+                // Check if we need data after our cached range.
+                if (newStop > cachedStop) {
+                    rangesToRequest.push({
+                        start: new Date(cachedStop).toISOString(),
+                        stop: stopTmp.toISOString()
+                    });
+                }
+            }
+            const entityIds = entities.map(x => x.Bruce.ID);
+            const combined = { ...this.entitiesHistoric };
+            // Make requests for each missing range
+            for (const range of rangesToRequest) {
+                if (this.disposed) {
+                    break;
+                }
+                // Add padding to ensure we get all data.
+                const start = new Date(range.start);
+                const stop = new Date(range.stop);
+                start.setSeconds(start.getSeconds() - 1);
+                stop.setSeconds(stop.getSeconds() + 1);
+                const paddedStartStr = start.toISOString();
+                const paddedStopStr = stop.toISOString();
+                const historicData = await EntityHistoricData.GetList({
+                    attrKey: this.item.BruceEntity.historicAttrKey,
+                    dateTimeFrom: paddedStartStr,
+                    dateTimeTo: paddedStopStr,
+                    entityIds: entityIds,
+                    api: this.apiGetter.getApi()
+                });
+                if (this.disposed) {
+                    break;
+                }
+                // Merge the new data with existing data
+                const records = historicData.recordsByIds;
+                const recordsIds = Object.keys(records);
+                for (let i = 0; i < recordsIds.length; i++) {
+                    const entityId = recordsIds[i];
+                    const latest = records[entityId] || [];
+                    const current = combined[entityId] || [];
+                    // Use a Map to de-duplicate by timestamp.
+                    const tmp = new Map();
+                    for (let j = 0; j < current.length; j++) {
+                        const record = current[j];
+                        const dateTime = new Date(record.dateTime).getTime();
+                        tmp.set(dateTime, record);
+                    }
+                    for (let j = 0; j < latest.length; j++) {
+                        const record = latest[j];
+                        const dateTime = new Date(record.dateTime).getTime();
+                        tmp.set(dateTime, record);
+                    }
+                    // Convert to array and sort by date.
+                    const sorted = Array.from(tmp.values()).sort((a, b) => {
+                        return new Date(a.dateTime).getTime() - new Date(b.dateTime).getTime();
+                    });
+                    combined[entityId] = sorted;
+                }
+            }
+            if (!this.disposed) {
+                // Update our cache boundaries.
+                this.lastHistoricMin = startTmp.toISOString();
+                this.lastHistoricMax = stopTmp.toISOString();
+                this.entitiesHistoric = combined;
+            }
+            return combined;
+        }
+        viewerDateTimeSub() {
+            var _a, _b;
+            if ((!((_a = this.item.BruceEntity) === null || _a === void 0 ? void 0 : _a.historic) && !((_b = this.item.BruceEntity) === null || _b === void 0 ? void 0 : _b.historicAttrKey)) || this.viewerDateTimeChangeRemoval) {
+                return;
+            }
+            const THROTTLE_INTERVAL = 2000;
+            let queue = new DelayQueue(() => {
+                this.onGetterUpdate(Object.keys(this.renderedEntities));
+            }, THROTTLE_INTERVAL, true);
+            let clockTickRemoval;
+            let prevTick = this.viewer.clock.currentTime.toString();
+            clockTickRemoval = this.viewer.clock.onTick.addEventListener(() => {
+                if (this.disposed || this.viewer.isDestroyed()) {
+                    return;
+                }
+                const currentTick = this.viewer.clock.currentTime.toString();
+                if (currentTick === prevTick) {
+                    return;
+                }
+                queue.Call();
+            });
+            this.viewerDateTimeChangeRemoval = () => {
+                if (clockTickRemoval) {
+                    clockTickRemoval();
+                    clockTickRemoval = null;
+                }
+                queue.Dispose();
+                queue = null;
+            };
+        }
+        viewerDateTimeDispose() {
+            var _a;
+            (_a = this.viewerDateTimeChangeRemoval) === null || _a === void 0 ? void 0 : _a.call(this);
+            this.viewerDateTimeChangeRemoval = null;
+        }
     }
     EntitiesIdsRenderManager.Manager = Manager;
 })(EntitiesIdsRenderManager || (EntitiesIdsRenderManager = {}));
@@ -15657,7 +15656,7 @@ var SharedGetters;
     })(Queue = SharedGetters.Queue || (SharedGetters.Queue = {}));
 })(SharedGetters || (SharedGetters = {}));
 
-function colorToCColor$4(color) {
+function colorToCColor$3(color) {
     return new Color(color.red ? color.red / 255 : 0, color.green ? color.green / 255 : 0, color.blue ? color.blue / 255 : 0, color.alpha);
 }
 /**
@@ -16961,7 +16960,7 @@ var TilesetRenderEngine;
                 cColor = Color.WHITE;
             }
             else {
-                cColor = colorToCColor$4(bColor);
+                cColor = colorToCColor$3(bColor);
             }
             const override = this.styledEntityIds[entity.entityId] == true;
             CesiumEntityStyler.SetDefaultColor({
@@ -17159,7 +17158,7 @@ var TilesetCadRenderManager;
             this.viewerDateTimeChangeRemoval = null;
             // Series of points to help interpolate movement when the timeline changes.
             this.historicPosses = [];
-            this.historicPossesLoading = false;
+            this.historicAnimation = null;
             this.historicPossesLoadingProm = null;
             const { viewer, register: visualsManager, getters, item } = params;
             this.viewer = viewer;
@@ -17616,7 +17615,7 @@ var TilesetCadRenderManager;
         /**
          * Monitors the Cesium Viewer and updates the root Entity based on the scene time changing.
          * If the root Entity is historic, this can allow for movement of the assembly as a whole.
-         * @parma tileset
+         * @param tileset
          */
         viewerDateTimeSub(tileset) {
             var _a, _b;
@@ -17630,60 +17629,172 @@ var TilesetCadRenderManager;
             const api = this.getters.GetBruceApi({
                 accountId: accountId
             });
-            // Returns a series of positions to use for position interpolation based on time.
-            // If the timeline range is different to the previous query, we'll re-request the data.
-            const getSeriesPosses = async () => {
+            // 'start-stop' time string that maps to a pending request.
+            // Helps us avoid repeated requests that are the same.
+            const pendingRequests = new Map();
+            /**
+             * Returns a list of historic positions for a given time range.
+             * @param startStr
+             * @param stopStr
+             * @returns
+             */
+            const getPossesForRange = async (startStr, stopStr) => {
+                const requestKey = `${startStr}-${stopStr}`;
+                if (pendingRequests.has(requestKey)) {
+                    return pendingRequests.get(requestKey);
+                }
+                const requestPromise = new Promise(async (res) => {
+                    try {
+                        const historicData = await EntityHistoricData.GetList({
+                            attrKey: null,
+                            dateTimeFrom: startStr,
+                            dateTimeTo: stopStr,
+                            entityIds: [this.rootId],
+                            api: api
+                        });
+                        const posses = CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity(this.viewer, HeightReference.NONE, historicData.recordsByIds[this.rootId]);
+                        res(posses);
+                    }
+                    catch (e) {
+                        console.error(e);
+                        res([]);
+                    }
+                    finally {
+                        pendingRequests.delete(requestKey);
+                    }
+                });
+                pendingRequests.set(requestKey, requestPromise);
+                return requestPromise;
+            };
+            /**
+             * Checks if the current timeline range is not fully loaded and requests the difference.
+             * This will call getPossesForRange() if it needs more data.
+             * @returns
+             */
+            const checkTimelineRange = async () => {
                 const minDateTime = this.viewer.clock.startTime.toString();
                 const maxDateTime = this.viewer.clock.stopTime.toString();
-                if (this.historicPossesMinDateTime == minDateTime &&
-                    this.historicPossesMaxDateTime == maxDateTime) {
-                    if (this.historicPossesLoading) {
-                        if (!await this.historicPossesLoadingProm) {
-                            return false;
-                        }
-                    }
-                    return this.historicPosses;
+                // See if the current range is within the range we already have.
+                if (this.historicPosses.length > 0 &&
+                    this.historicPossesMinDateTime &&
+                    this.historicPossesMaxDateTime &&
+                    minDateTime >= this.historicPossesMinDateTime &&
+                    maxDateTime <= this.historicPossesMaxDateTime) {
+                    return;
                 }
-                this.historicPossesMinDateTime = minDateTime;
-                this.historicPossesMaxDateTime = maxDateTime;
-                this.historicPossesLoading = true;
-                this.historicPossesLoadingProm = new Promise(async (res) => {
-                    // We'll add/remove 1 second to ensure we cover all records.
+                // See if the requested range is before or after the range we have.
+                const fetchBefore = !this.historicPossesMinDateTime || minDateTime < this.historicPossesMinDateTime;
+                const fetchAfter = !this.historicPossesMaxDateTime || maxDateTime > this.historicPossesMaxDateTime;
+                if (!fetchBefore && !fetchAfter) {
+                    // Already have the data we need.
+                    return;
+                }
+                // No known range so we need to fetch the whole thing.
+                if (!this.historicPossesMinDateTime || !this.historicPossesMaxDateTime) {
                     const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
                     const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
                     const startStr = new Date(startTmp.getTime() - 1000).toISOString();
                     const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
-                    const historicData = await EntityHistoricData.GetList({
-                        attrKey: null,
-                        dateTimeFrom: startStr,
-                        dateTimeTo: stopStr,
-                        entityIds: [this.rootId],
-                        api: api
-                    });
-                    const posses = CesiumAnimatedProperty.GetSeriesPossesForHistoricEntity(this.viewer, HeightReference.NONE, historicData.recordsByIds[this.rootId]);
-                    if (this.historicPossesMinDateTime == minDateTime &&
-                        this.historicPossesMaxDateTime == maxDateTime) {
-                        this.historicPosses = posses;
+                    const newPositions = await getPossesForRange(startStr, stopStr);
+                    if (this.disposed) {
+                        return;
+                    }
+                    if (this.historicAnimation && this.historicAnimation.addPositions) {
+                        this.historicAnimation.addPositions(newPositions);
+                    }
+                    this.historicPossesMinDateTime = minDateTime;
+                    this.historicPossesMaxDateTime = maxDateTime;
+                }
+                else {
+                    // The data we want is before the range we've currently loaded.
+                    if (fetchBefore) {
+                        // Calculate the missing difference and request it.
+                        const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
+                        const stopTmp = new Date(this.historicPossesMinDateTime);
+                        const startStr = new Date(startTmp.getTime() - 1000).toISOString();
+                        const stopStr = stopTmp.toISOString();
+                        getPossesForRange(startStr, stopStr).then(newPositions => {
+                            if (this.disposed) {
+                                return;
+                            }
+                            this.historicPossesMinDateTime = minDateTime;
+                            if (this.historicAnimation && this.historicAnimation.addPositions) {
+                                this.historicAnimation.addPositions(newPositions);
+                            }
+                        });
+                    }
+                    // The data we want is after the range we've currently loaded.
+                    if (fetchAfter) {
+                        // Calculate the missing difference and request it.
+                        const startTmp = new Date(this.historicPossesMaxDateTime);
+                        const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
+                        const startStr = startTmp.toISOString();
+                        const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
+                        getPossesForRange(startStr, stopStr).then(newPositions => {
+                            if (this.disposed) {
+                                return;
+                            }
+                            this.historicPossesMaxDateTime = maxDateTime;
+                            if (this.historicAnimation && this.historicAnimation.addPositions) {
+                                this.historicAnimation.addPositions(newPositions);
+                            }
+                        });
+                    }
+                }
+            };
+            /**
+             * Requests the initial set of historic positions for the timeline range.
+             * This is called when the tileset is loaded and the timeline range is set.
+             * @returns
+             */
+            const getInitialPosses = async () => {
+                const minDateTime = this.viewer.clock.startTime.toString();
+                const maxDateTime = this.viewer.clock.stopTime.toString();
+                this.historicPossesLoadingProm = new Promise(async (res) => {
+                    try {
+                        if (this.disposed) {
+                            res(false);
+                            return;
+                        }
+                        const startTmp = JulianDate.toDate(this.viewer.clock.startTime);
+                        const stopTmp = JulianDate.toDate(this.viewer.clock.stopTime);
+                        const startStr = new Date(startTmp.getTime() - 1000).toISOString();
+                        const stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
+                        const positions = await getPossesForRange(startStr, stopStr);
+                        if (this.disposed) {
+                            res(false);
+                            return;
+                        }
+                        this.historicPosses = positions;
                         this.historicPossesMinDateTime = minDateTime;
                         this.historicPossesMaxDateTime = maxDateTime;
-                        this.historicPossesLoading = false;
-                        res(posses);
+                        res(positions);
+                    }
+                    catch (e) {
+                        console.error(e);
+                        res(false);
                     }
-                    res(false);
                 });
                 return await this.historicPossesLoadingProm;
             };
-            getSeriesPosses().then((posses) => {
+            // Last known timeline range. Helps us detect changes.
+            let lastStartTime = this.viewer.clock.startTime.toString();
+            let lastStopTime = this.viewer.clock.stopTime.toString();
+            let clockTickRemoval;
+            getInitialPosses().then((posses) => {
                 if (this.disposed || posses === false) {
                     return;
                 }
-                let animation = new CesiumAnimatedProperty.AnimateTPositionSeries({
+                // Generate animation utility for the initial set of positions.
+                this.historicAnimation = new CesiumAnimatedProperty.AnimateTPositionSeries({
                     viewer: this.viewer,
                     posses: posses,
                     onUpdate: (pos3d, heading) => {
                         if (this.disposed) {
                             return;
                         }
+                        // Jank code that hacks the position to be different.
+                        // This can mess up our panels so we'll need to disable editing until a better system is in place.
                         const location = Cartographic.fromCartesian(pos3d);
                         const lat = Math$1.toDegrees(location.latitude);
                         const lon = Math$1.toDegrees(location.longitude);
@@ -17710,12 +17821,35 @@ var TilesetCadRenderManager;
                             }
                         };
                         this.applyCoords(tileset, coords);
+                    },
+                    onRangeChange: () => {
+                        checkTimelineRange();
+                    },
+                    onDone: () => {
+                        if (this.viewerDateTimeChangeRemoval) {
+                            this.viewerDateTimeChangeRemoval();
+                            this.viewerDateTimeChangeRemoval = null;
+                        }
+                    }
+                });
+                // When the clock changes we'll see if the range is different and queue a request for the difference.
+                clockTickRemoval = this.viewer.clock.onTick.addEventListener(() => {
+                    const startTime = this.viewer.clock.startTime.toString();
+                    const stopTime = this.viewer.clock.stopTime.toString();
+                    if (startTime !== lastStartTime || stopTime !== lastStopTime) {
+                        lastStartTime = startTime;
+                        lastStopTime = stopTime;
+                        this.historicAnimation.onRangeChange();
                     }
                 });
                 this.viewerDateTimeChangeRemoval = () => {
-                    if (animation) {
-                        animation.stop();
-                        animation = null;
+                    if (this.historicAnimation) {
+                        this.historicAnimation.stop();
+                        this.historicAnimation = null;
+                    }
+                    if (clockTickRemoval) {
+                        clockTickRemoval();
+                        clockTickRemoval = null;
                     }
                 };
             });
@@ -24676,7 +24810,8 @@ async function renderNavigator(iteration, params, bookmark, view, getters) {
             end: null,
             playing: false,
             speed: 1,
-            start: null
+            start: null,
+            live: false
         };
     }
     ViewUtils.SetTimeDetails({
@@ -24685,7 +24820,8 @@ async function renderNavigator(iteration, params, bookmark, view, getters) {
         currentTimeIso: dateTime,
         startTimeIso: timeline.start,
         stopTimeIso: timeline.end,
-        isAnimating: timeline.playing
+        isAnimating: timeline.playing,
+        isLive: timeline.live
     });
     // Newer version that has states per Entity ID + Menu Item ID.
     let states = bSettings === null || bSettings === void 0 ? void 0 : bSettings.states;
@@ -30501,7 +30637,7 @@ class WidgetViewBar extends Widget.AWidget {
     }
 }
 
-const VERSION = "5.4.0";
+const VERSION = "5.4.2";
 
-export { VERSION, CesiumViewMonitor, ViewerUtils, ViewerEventTracker, MenuItemManager, isHistoricMetadataChanged, EntityRenderEngine, EntityRenderEnginePoint, EntityRenderEnginePolyline, EntityRenderEnginePolygon, EntityRenderEngineModel3d, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, DataLabRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, GoogleSearchRenderManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, CESIUM_TIMELINE_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, CesiumEntityStyler, CesiumAnimatedProperty, CesiumAnimatedInOut, Draw3dPolygon, Draw3dPolyline, MeasureCreator, Walkthrough, Widget, VIEWER_BOOKMARKS_WIDGET_KEY, WidgetBookmarks, WidgetBranding, WidgetCursorBar, WidgetEmbeddedInfoView, WidgetInfoView, WidgetNavCompass$$1 as WidgetNavCompass, VIEWER_VIEW_BAR_WIDGET_KEY, WidgetViewBar, WidgetControlViewBar, WidgetControlViewBarSearch, VIEWER_LEFT_PANEL_WIDGET_KEY, VIEWER_LEFT_PANEL_CSS_VAR_LEFT, WidgetLeftPanel, WidgetLeftPanelTab, WidgetLeftPanelTabBookmarks };
+export { VERSION, CesiumViewMonitor, ViewerUtils, ViewerEventTracker, MenuItemManager, isHistoricMetadataChanged, EntityRenderEngine, EntityRenderEnginePoint, EntityRenderEnginePolyline, EntityRenderEnginePolygon, EntityRenderEngineModel3d, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, DataLabRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, GoogleSearchRenderManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, CESIUM_TIMELINE_KEY, CESIUM_TIMELINE_LIVE_KEY, CESIUM_TIMELINE_LIVE_PADDING_FORWARD_KEY, CESIUM_TIMELINE_LIVE_PADDING_BACKWARD_KEY, CESIUM_TIMELINE_INTERVAL_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, CesiumEntityStyler, CesiumAnimatedProperty, CesiumAnimatedInOut, Draw3dPolygon, Draw3dPolyline, MeasureCreator, Walkthrough, Widget, VIEWER_BOOKMARKS_WIDGET_KEY, WidgetBookmarks, WidgetBranding, WidgetCursorBar, WidgetEmbeddedInfoView, WidgetInfoView, WidgetNavCompass$$1 as WidgetNavCompass, VIEWER_VIEW_BAR_WIDGET_KEY, WidgetViewBar, WidgetControlViewBar, WidgetControlViewBarSearch, VIEWER_LEFT_PANEL_WIDGET_KEY, VIEWER_LEFT_PANEL_CSS_VAR_LEFT, WidgetLeftPanel, WidgetLeftPanelTab, WidgetLeftPanelTabBookmarks };
 //# sourceMappingURL=bruce-cesium.es5.js.map