bruce-cesium 3.8.2 → 3.8.4

package/dist/bruce-cesium.umd.js

@@ -1010,6 +1010,11 @@
                 }
                 this.startTime = new Date();
             }
+            AnimateColor.prototype.IsDone = function () {
+                var now = new Date();
+                var elapsedMs = now.getTime() - this.startTime.getTime();
+                return elapsedMs >= this.durationMs;
+            };
             /**
              * Returns the calculated color at the provided time.
              * @returns
@@ -1106,7 +1111,7 @@
          * @returns
          */
         function AnimateTFeatureColor(params) {
-            var viewer = params.viewer, feature = params.feature, color = params.targetColor, startColor = params.startColor, durationMs = params.durationMs;
+            var viewer = params.viewer, feature = params.feature, color = params.targetColor, startColor = params.startColor, durationMs = params.durationMs, onDone = params.onDone;
             ClearTFeatureColorAnimation(feature);
             if (!startColor) {
                 if (feature.color) {
@@ -1147,6 +1152,7 @@
                 if (!assertColorMark(mark, feature.color)) {
                     removal === null || removal === void 0 ? void 0 : removal();
                     removal = null;
+                    onDone === null || onDone === void 0 ? void 0 : onDone();
                     return;
                 }
                 var now = new Date();
@@ -1156,6 +1162,7 @@
                     feature.color = color;
                     removal === null || removal === void 0 ? void 0 : removal();
                     removal = null;
+                    onDone === null || onDone === void 0 ? void 0 : onDone();
                     return;
                 }
                 try {
@@ -1256,6 +1263,69 @@
             return AnimateHeading;
         }());
         CesiumAnimatedProperty.AnimateHeading = AnimateHeading;
+        /**
+         * Animates a position from a set of provided positions in time.
+         * This will return a position across the provided positions based on the current time.
+         * If the time exceeds the duration, the last position will be returned.
+         * If the time proceeds the first position, the first position will be returned.
+         */
+        var AnimatePositionSeries = /** @class */ (function () {
+            function AnimatePositionSeries(params) {
+                this.cachedCalc = null;
+                this.cachedTime = null;
+                this.viewer = params.viewer;
+                this.positions = params.posses;
+                // Order positions by date.
+                this.positions.sort(function (a, b) {
+                    return a.dateTime.getTime() - b.dateTime.getTime();
+                });
+            }
+            AnimatePositionSeries.prototype.GetValue = function () {
+                var _this = this;
+                var now = this.viewer.scene.lastRenderTime;
+                if (!now) {
+                    now = this.viewer.clock.currentTime;
+                }
+                var nowTime = Cesium.JulianDate.toDate(now);
+                if (this.cachedTime == nowTime.getTime()) {
+                    return this.cachedCalc;
+                }
+                var calculate = function () {
+                    // See if we're before the first position.
+                    if (nowTime.getTime() <= _this.positions[0].dateTime.getTime()) {
+                        return _this.positions[0].pos3d;
+                    }
+                    // See if we're after the last position.
+                    if (nowTime.getTime() >= _this.positions[_this.positions.length - 1].dateTime.getTime()) {
+                        return _this.positions[_this.positions.length - 1].pos3d;
+                    }
+                    // Find the current position.
+                    var lastIndex = 0;
+                    for (var i = 1; i < _this.positions.length; i++) {
+                        var pos = _this.positions[i];
+                        if (nowTime.getTime() >= pos.dateTime.getTime()) {
+                            lastIndex = i;
+                        }
+                        else {
+                            break;
+                        }
+                    }
+                    var last = _this.positions[lastIndex];
+                    // Interpolate the position.
+                    var next = _this.positions[lastIndex + 1];
+                    if (!next) {
+                        return last.pos3d;
+                    }
+                    var progress = (nowTime.getTime() - last.dateTime.getTime()) / (next.dateTime.getTime() - last.dateTime.getTime());
+                    return Cesium.Cartesian3.lerp(last.pos3d, next.pos3d, progress, new Cesium.Cartesian3());
+                };
+                this.cachedTime = nowTime.getTime();
+                this.cachedCalc = calculate();
+                return this.cachedCalc;
+            };
+            return AnimatePositionSeries;
+        }());
+        CesiumAnimatedProperty.AnimatePositionSeries = AnimatePositionSeries;
     })(CesiumAnimatedProperty || (CesiumAnimatedProperty = {}));
 
     /**
@@ -1612,10 +1682,32 @@
         }
         CesiumEntityStyler.Refresh = Refresh;
         function BakeDefaultColor(params) {
-            var viewer = params.viewer, entity = params.entity, override = params.override;
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            var viewer = params.viewer, entity = params.entity, override = params.override, colors = params.colors, refresh = params.refresh;
             if (!entity) {
                 return;
             }
+            if (refresh == null) {
+                refresh = true;
+            }
+            var colorMap;
+            if (colors) {
+                if (!(colors instanceof Map)) {
+                    var keys = Object.keys(colors);
+                    var map = new Map();
+                    for (var i = 0; i < keys.length; i++) {
+                        var key = keys[i];
+                        map.set(key, colors[key]);
+                    }
+                    colorMap = map;
+                }
+                else {
+                    colorMap = colors;
+                }
+            }
+            else {
+                colorMap = new Map();
+            }
             var parts = exports.EntityUtils.GatherEntity({
                 entity: entity
             });
@@ -1633,37 +1725,61 @@
                 }
                 if (part instanceof Cesium.Cesium3DTileFeature) {
                     var opacity = getAppliedOpacity(part);
-                    storeColor("default", calculateCurColor(viewer, part), part);
-                    refreshColor(viewer, part, opacity);
+                    var color = (_a = colorMap.get("feature")) !== null && _a !== void 0 ? _a : calculateCurColor(viewer, part);
+                    storeColor("default", color, part);
+                    if (refresh) {
+                        refreshColor(viewer, part, opacity);
+                    }
                 }
                 else if (part instanceof Cesium.Entity) {
                     if (part.billboard) {
-                        storeColor("default", calculateCurColor(viewer, part.billboard), part.billboard);
-                        refreshColor(viewer, part.billboard, getAppliedOpacity(part.billboard));
+                        var color = (_b = colorMap.get("billboard")) !== null && _b !== void 0 ? _b : calculateCurColor(viewer, part.billboard);
+                        storeColor("default", color, part.billboard);
+                        if (refresh) {
+                            refreshColor(viewer, part.billboard, getAppliedOpacity(part.billboard));
+                        }
                     }
                     if (part.model) {
-                        storeColor("default", calculateCurColor(viewer, part.model), part.model);
-                        refreshColor(viewer, part.model, getAppliedOpacity(part.model));
+                        var color = (_c = colorMap.get("model")) !== null && _c !== void 0 ? _c : calculateCurColor(viewer, part.model);
+                        storeColor("default", color, part.model);
+                        if (refresh) {
+                            refreshColor(viewer, part.model, getAppliedOpacity(part.model));
+                        }
                     }
                     if (part.polyline) {
-                        storeColor("default", calculateCurColor(viewer, part.polyline), part.polyline);
-                        refreshColor(viewer, part.polyline, getAppliedOpacity(part.polyline));
+                        var color = (_d = colorMap.get("polyline")) !== null && _d !== void 0 ? _d : calculateCurColor(viewer, part.polyline);
+                        storeColor("default", color, part.polyline);
+                        if (refresh) {
+                            refreshColor(viewer, part.polyline, getAppliedOpacity(part.polyline));
+                        }
                     }
                     if (part.polygon) {
-                        storeColor("default", calculateCurColor(viewer, part.polygon), part.polygon);
-                        refreshColor(viewer, part.polygon, getAppliedOpacity(part.polygon));
+                        var color = (_e = colorMap.get("polygon")) !== null && _e !== void 0 ? _e : calculateCurColor(viewer, part.polygon);
+                        storeColor("default", color, part.polygon);
+                        if (refresh) {
+                            refreshColor(viewer, part.polygon, getAppliedOpacity(part.polygon));
+                        }
                     }
                     if (part.corridor) {
-                        storeColor("default", calculateCurColor(viewer, part.corridor), part.corridor);
-                        refreshColor(viewer, part.corridor, getAppliedOpacity(part.corridor));
+                        var color = (_f = colorMap.get("corridor")) !== null && _f !== void 0 ? _f : calculateCurColor(viewer, part.corridor);
+                        storeColor("default", color, part.corridor);
+                        if (refresh) {
+                            refreshColor(viewer, part.corridor, getAppliedOpacity(part.corridor));
+                        }
                     }
                     if (part.point) {
-                        storeColor("default", calculateCurColor(viewer, part.point), part.point);
-                        refreshColor(viewer, part.point, getAppliedOpacity(part.point));
+                        var color = (_g = colorMap.get("point")) !== null && _g !== void 0 ? _g : calculateCurColor(viewer, part.point);
+                        storeColor("default", color, part.point);
+                        if (refresh) {
+                            refreshColor(viewer, part.point, getAppliedOpacity(part.point));
+                        }
                     }
                     if (part.ellipse) {
-                        storeColor("default", calculateCurColor(viewer, part.ellipse), part.ellipse);
-                        refreshColor(viewer, part.ellipse, getAppliedOpacity(part.ellipse));
+                        var color = (_h = colorMap.get("ellipse")) !== null && _h !== void 0 ? _h : calculateCurColor(viewer, part.ellipse);
+                        storeColor("default", color, part.ellipse);
+                        if (refresh) {
+                            refreshColor(viewer, part.ellipse, getAppliedOpacity(part.ellipse));
+                        }
                     }
                 }
             }
@@ -4880,6 +4996,27 @@
             envId: envId
         };
     }
+    function getSeriesPossesForHistoricEntity(viewer, heightRef, historic) {
+        var series = [];
+        for (var i = 0; i < historic.length; i++) {
+            var item = historic[i];
+            var pos3d = exports.EntityUtils.GetPos({
+                entity: item.data,
+                viewer: viewer,
+                recordHeightRef: heightRef,
+                returnHeightRef: heightRef
+            });
+            var dateTime = new Date(item.dateTime);
+            if (!dateTime || !pos3d || isNaN(pos3d.x) || isNaN(pos3d.y) || isNaN(pos3d.z)) {
+                continue;
+            }
+            series.push({
+                dateTime: dateTime,
+                pos3d: pos3d
+            });
+        }
+        return series;
+    }
     (function (EntityRenderEngine) {
         function Render(params) {
             var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
@@ -4974,7 +5111,7 @@
                                 }
                             }
                             if (!(models.length > 0)) return [3 /*break*/, 2];
-                            mParams = __assign(__assign({}, groupRenderParams), { rendered: cEntities, entities: models });
+                            mParams = __assign(__assign({}, groupRenderParams), { rendered: cEntities, entities: models, entitiesHistoric: params.entitiesHistoric });
                             return [4 /*yield*/, Model3d.RenderGroup(mParams)];
                         case 1:
                             mEntities = _m.sent();
@@ -5003,6 +5140,7 @@
                                                 return [2 /*return*/, "continue"];
                                             }
                                             pParams = __assign(__assign({}, groupRenderParams), { entities: [], rendered: cEntities });
+                                            pParams.entitiesHistoric = params.entitiesHistoric;
                                             zoomItem = pParams.zoomItems[entity.Bruce.ID];
                                             for (j = 0; j < entity.geometry.MultiGeometry.length; j++) {
                                                 subEntity = __assign(__assign({}, entity), { geometry: entity.geometry.MultiGeometry[j], Bruce: __assign(__assign({}, entity.Bruce), { ID: bruceModels.ObjectUtils.UId() }) });
@@ -5105,7 +5243,7 @@
                             _m.label = 10;
                         case 10:
                             if (!(points.length > 0)) return [3 /*break*/, 12];
-                            pParams = __assign(__assign({}, groupRenderParams), { entities: points, rendered: cEntities });
+                            pParams = __assign(__assign({}, groupRenderParams), { entities: points, rendered: cEntities, entitiesHistoric: params.entitiesHistoric });
                             return [4 /*yield*/, Point.RenderGroup(pParams)];
                         case 11:
                             pEntities = _m.sent();
@@ -5174,11 +5312,14 @@
             function Render(params) {
                 var _a, _b, _c, _d;
                 return __awaiter(this, void 0, void 0, function () {
-                    var entity, style, type, cEntity, siblings, prepareExistingGraphic, iconUrlRows, icon, iconUrl, metadata, api, image, e_5, iconScale, disableDepthTest, bColor, cColor_1, heightRef_1, currentImgKey, pos3d, prevPos3d, animatePosition_1, radius, bFill, cFill, outline, cOutline, outlineWidth, bOutline, heightRef, pos3d, extrusion, hasOutline, outlineExtrusion, outlineEntity, bColor, cColor, size, heightRef_2, circleBillboard, disableDepthTest, imgKey, currentImgKey, pos3d, prevPos3d, animatePosition_2;
+                    var entity, style, type, cEntity, siblings, prepareExistingGraphic, iconUrlRows, icon, iconUrl, metadata, api, image, e_5, iconScale, disableDepthTest, bColor, cColor, heightRef_1, animateColorIn_1, position, series, animatePosition_1, currentImgKey, series, animatePosition_2, pos3d, prevPos3d, animatePosition_3, radius, bFill, cFill, outline, cOutline, outlineWidth, bOutline, heightRef, pos3d, extrusion, hasOutline, outlineExtrusion, outlineEntity, bColor, cColor, size, heightRef_2, circleBillboard, disableDepthTest, animateColorIn_2, position, series, animatePosition_4, imgKey, currentImgKey, series, animatePosition_5, pos3d, prevPos3d, animatePosition_6;
                     return __generator(this, function (_e) {
                         switch (_e.label) {
                             case 0:
                                 entity = params.entity;
+                                if (!params.entityHistoric) {
+                                    params.entityHistoric = [];
+                                }
                                 style = params.style;
                                 type = style.Type;
                                 if (type == null) {
@@ -5274,9 +5415,32 @@
                                     disableDepthTest = Boolean(style.renderOnTop);
                                     if (iconScale > 0) {
                                         bColor = style.iconTintColor ? bruceModels.Calculator.GetColor(style.iconTintColor, entity, params.tags) : null;
-                                        cColor_1 = bColor ? colorToCColor(bColor) : undefined;
+                                        cColor = bColor ? colorToCColor(bColor) : Cesium.Color.WHITE.clone();
                                         heightRef_1 = getHeightRef(style);
                                         if (!params.rendered || !params.rendered.billboard) {
+                                            animateColorIn_1 = new CesiumAnimatedProperty.AnimateColor({
+                                                durationMs: 200,
+                                                targetColor: cColor,
+                                                startColor: cColor.withAlpha(0),
+                                                viewer: params.viewer
+                                            });
+                                            position = null;
+                                            series = getSeriesPossesForHistoricEntity(params.viewer, heightRef_1, params.entityHistoric);
+                                            if (series.length > 1) {
+                                                animatePosition_1 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                                                    posses: series,
+                                                    viewer: params.viewer
+                                                });
+                                                position = new Cesium.CallbackProperty(function () { return animatePosition_1.GetValue(); }, false);
+                                            }
+                                            else {
+                                                position = new Cesium.CallbackProperty(function () { return exports.EntityUtils.GetPos({
+                                                    viewer: params.viewer,
+                                                    entity: entity,
+                                                    recordHeightRef: heightRef_1,
+                                                    returnHeightRef: heightRef_1
+                                                }); }, true);
+                                            }
                                             cEntity = new Cesium.Entity({
                                                 id: bruceModels.ObjectUtils.UId(10),
                                                 billboard: {
@@ -5287,18 +5451,27 @@
                                                     scale: iconScale,
                                                     disableDepthTestDistance: disableDepthTest ? Number.POSITIVE_INFINITY : undefined,
                                                     distanceDisplayCondition: getDisplayCondition(params.minDistance, params.maxDistance),
-                                                    color: new Cesium.CallbackProperty(function () { return cColor_1; }, true),
+                                                    color: new Cesium.CallbackProperty(function () {
+                                                        var color = animateColorIn_1.GetColor();
+                                                        if (animateColorIn_1.IsDone() && (cEntity === null || cEntity === void 0 ? void 0 : cEntity.billboard)) {
+                                                            cEntity.billboard.color = new Cesium.CallbackProperty(function () { return color; }, true);
+                                                        }
+                                                        return color;
+                                                    }, false),
                                                     // Would be great once we have a setting for this.
                                                     // translucencyByDistance: getTranslucencyByDistance(params.minDistance, params.maxDistance),
                                                 },
-                                                position: new Cesium.CallbackProperty(function () { return exports.EntityUtils.GetPos({
-                                                    viewer: params.viewer,
-                                                    entity: entity,
-                                                    recordHeightRef: heightRef_1,
-                                                    returnHeightRef: heightRef_1
-                                                }); }, true),
+                                                position: position,
                                                 show: true
                                             });
+                                            exports.CesiumEntityStyler.BakeDefaultColor({
+                                                entity: cEntity,
+                                                colors: {
+                                                    "billboard": cColor
+                                                },
+                                                viewer: params.viewer,
+                                                refresh: false
+                                            });
                                         }
                                         else {
                                             prepareExistingGraphic(params.rendered);
@@ -5311,25 +5484,35 @@
                                             cEntity.billboard.heightReference = new Cesium.ConstantProperty(getHeightRef(style));
                                             cEntity.billboard.disableDepthTestDistance = new Cesium.ConstantProperty(disableDepthTest ? Number.POSITIVE_INFINITY : undefined);
                                             cEntity.billboard.distanceDisplayCondition = new Cesium.ConstantProperty(getDisplayCondition(params.minDistance, params.maxDistance));
-                                            pos3d = exports.EntityUtils.GetPos({
-                                                viewer: params.viewer,
-                                                entity: entity,
-                                                recordHeightRef: heightRef_1,
-                                                returnHeightRef: heightRef_1
-                                            });
-                                            prevPos3d = getValue$1(params.viewer, cEntity.position);
-                                            if (!prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d)) {
-                                                animatePosition_1 = new CesiumAnimatedProperty.AnimatePosition({
-                                                    durationMs: 200,
-                                                    targetPos3d: pos3d,
+                                            series = getSeriesPossesForHistoricEntity(params.viewer, heightRef_1, params.entityHistoric);
+                                            if (series.length > 1) {
+                                                animatePosition_2 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                                                    posses: series,
+                                                    viewer: params.viewer
+                                                });
+                                                cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_2.GetValue(); }, false);
+                                            }
+                                            else {
+                                                pos3d = exports.EntityUtils.GetPos({
                                                     viewer: params.viewer,
-                                                    startPos3d: prevPos3d
+                                                    entity: entity,
+                                                    recordHeightRef: heightRef_1,
+                                                    returnHeightRef: heightRef_1
                                                 });
-                                                cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_1.GetValue(); }, false);
+                                                prevPos3d = getValue$1(params.viewer, cEntity.position);
+                                                if (!prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d)) {
+                                                    animatePosition_3 = new CesiumAnimatedProperty.AnimatePosition({
+                                                        durationMs: 200,
+                                                        targetPos3d: pos3d,
+                                                        viewer: params.viewer,
+                                                        startPos3d: prevPos3d
+                                                    });
+                                                    cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_3.GetValue(); }, false);
+                                                }
                                             }
                                             // We'll use "SetDefaultColor" to updating the internal reference and to allow for an animation.
                                             exports.CesiumEntityStyler.SetDefaultColor({
-                                                color: cColor_1 ? cColor_1 : new Cesium.Color(),
+                                                color: cColor ? cColor : new Cesium.Color(),
                                                 entity: cEntity,
                                                 viewer: params.viewer,
                                                 override: true,
@@ -5474,6 +5657,29 @@
                                     circleBillboard = createCircleBillboard(size, cColor.toCssColorString());
                                     disableDepthTest = Boolean(style.renderOnTop);
                                     if (!params.rendered || !params.rendered.billboard) {
+                                        animateColorIn_2 = new CesiumAnimatedProperty.AnimateColor({
+                                            durationMs: 200,
+                                            targetColor: cColor,
+                                            startColor: cColor.withAlpha(0),
+                                            viewer: params.viewer
+                                        });
+                                        position = null;
+                                        series = getSeriesPossesForHistoricEntity(params.viewer, heightRef_2, params.entityHistoric);
+                                        if (series.length > 1) {
+                                            animatePosition_4 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                                                posses: series,
+                                                viewer: params.viewer
+                                            });
+                                            position = new Cesium.CallbackProperty(function () { return animatePosition_4.GetValue(); }, false);
+                                        }
+                                        else {
+                                            position = new Cesium.CallbackProperty(function () { return exports.EntityUtils.GetPos({
+                                                viewer: params.viewer,
+                                                entity: entity,
+                                                recordHeightRef: heightRef_2,
+                                                returnHeightRef: heightRef_2
+                                            }); }, true);
+                                        }
                                         cEntity = new Cesium.Entity({
                                             id: bruceModels.ObjectUtils.UId(10),
                                             // point: {
@@ -5489,19 +5695,28 @@
                                                 height: circleBillboard.height,
                                                 width: circleBillboard.width,
                                                 image: circleBillboard.canvasDataUri,
-                                                color: new Cesium.CallbackProperty(function () { return undefined; }, true),
+                                                color: new Cesium.CallbackProperty(function () {
+                                                    var color = animateColorIn_2.GetColor();
+                                                    if (animateColorIn_2.IsDone() && (cEntity === null || cEntity === void 0 ? void 0 : cEntity.billboard)) {
+                                                        cEntity.billboard.color = new Cesium.CallbackProperty(function () { return color; }, true);
+                                                    }
+                                                    return color;
+                                                }, false),
                                                 heightReference: heightRef_2,
                                                 distanceDisplayCondition: getDisplayCondition(params.minDistance, params.maxDistance),
                                                 disableDepthTestDistance: disableDepthTest ? Number.POSITIVE_INFINITY : undefined
                                             },
-                                            position: new Cesium.CallbackProperty(function () { return exports.EntityUtils.GetPos({
-                                                viewer: params.viewer,
-                                                entity: entity,
-                                                recordHeightRef: heightRef_2,
-                                                returnHeightRef: heightRef_2
-                                            }); }, true),
+                                            position: position,
                                             show: true
                                         });
+                                        exports.CesiumEntityStyler.BakeDefaultColor({
+                                            entity: cEntity,
+                                            viewer: params.viewer,
+                                            colors: {
+                                                "billboard": cColor
+                                            },
+                                            refresh: false
+                                        });
                                     }
                                     else {
                                         prepareExistingGraphic(params.rendered);
@@ -5516,21 +5731,31 @@
                                         cEntity.billboard.heightReference = new Cesium.ConstantProperty(heightRef_2);
                                         cEntity.billboard.distanceDisplayCondition = new Cesium.ConstantProperty(getDisplayCondition(params.minDistance, params.maxDistance));
                                         cEntity.billboard.disableDepthTestDistance = new Cesium.ConstantProperty(disableDepthTest ? Number.POSITIVE_INFINITY : undefined);
-                                        pos3d = exports.EntityUtils.GetPos({
-                                            viewer: params.viewer,
-                                            entity: entity,
-                                            recordHeightRef: heightRef_2,
-                                            returnHeightRef: heightRef_2
-                                        });
-                                        prevPos3d = getValue$1(params.viewer, cEntity.position);
-                                        if (!prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d)) {
-                                            animatePosition_2 = new CesiumAnimatedProperty.AnimatePosition({
-                                                durationMs: 200,
-                                                targetPos3d: pos3d,
+                                        series = getSeriesPossesForHistoricEntity(params.viewer, heightRef_2, params.entityHistoric);
+                                        if (series.length > 1) {
+                                            animatePosition_5 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                                                posses: series,
+                                                viewer: params.viewer
+                                            });
+                                            cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_5.GetValue(); }, false);
+                                        }
+                                        else {
+                                            pos3d = exports.EntityUtils.GetPos({
                                                 viewer: params.viewer,
-                                                startPos3d: prevPos3d
+                                                entity: entity,
+                                                recordHeightRef: heightRef_2,
+                                                returnHeightRef: heightRef_2
                                             });
-                                            cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_2.GetValue(); }, false);
+                                            prevPos3d = getValue$1(params.viewer, cEntity.position);
+                                            if (!prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d)) {
+                                                animatePosition_6 = new CesiumAnimatedProperty.AnimatePosition({
+                                                    durationMs: 200,
+                                                    targetPos3d: pos3d,
+                                                    viewer: params.viewer,
+                                                    startPos3d: prevPos3d
+                                                });
+                                                cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_6.GetValue(); }, false);
+                                            }
                                         }
                                         // We'll use "SetDefaultColor" to updating the internal reference and to allow for an animation.
                                         exports.CesiumEntityStyler.SetDefaultColor({
@@ -5555,16 +5780,16 @@
             }
             Point.Render = Render;
             function RenderGroup(params) {
-                var _a, _b, _c, _d;
+                var _a, _b, _c, _d, _e;
                 return __awaiter(this, void 0, void 0, function () {
-                    var api, cEntities, i, entity, zoomItem, style, _e, tagIds, tags, pStyle, cEntity, name_2;
-                    return __generator(this, function (_f) {
-                        switch (_f.label) {
+                    var api, cEntities, i, entity, zoomItem, style, _f, tagIds, tags, pStyle, cEntity, name_2;
+                    return __generator(this, function (_g) {
+                        switch (_g.label) {
                             case 0:
                                 api = params.apiGetter.getApi();
                                 cEntities = new Map();
                                 i = 0;
-                                _f.label = 1;
+                                _g.label = 1;
                             case 1:
                                 if (!(i < params.entities.length)) return [3 /*break*/, 11];
                                 entity = params.entities[i];
@@ -5572,13 +5797,13 @@
                                 if (!(zoomItem.StyleID != -1)) return [3 /*break*/, 3];
                                 return [4 /*yield*/, getStyle(api, entity, zoomItem.StyleID)];
                             case 2:
-                                _e = (_a = (_f.sent())) === null || _a === void 0 ? void 0 : _a.Settings;
+                                _f = (_a = (_g.sent())) === null || _a === void 0 ? void 0 : _a.Settings;
                                 return [3 /*break*/, 4];
                             case 3:
-                                _e = zoomItem.Style;
-                                _f.label = 4;
+                                _f = zoomItem.Style;
+                                _g.label = 4;
                             case 4:
-                                style = _e;
+                                style = _f;
                                 tagIds = entity.Bruce["Layer.ID"];
                                 tags = [];
                                 if (!(tagIds && tagIds.length > 0)) return [3 /*break*/, 6];
@@ -5587,8 +5812,8 @@
                                         tagIds: tagIds
                                     })];
                             case 5:
-                                tags = (_f.sent()).tags;
-                                _f.label = 6;
+                                tags = (_g.sent()).tags;
+                                _g.label = 6;
                             case 6:
                                 pStyle = (_b = style === null || style === void 0 ? void 0 : style.pointStyle) !== null && _b !== void 0 ? _b : {};
                                 return [4 /*yield*/, Render({
@@ -5600,20 +5825,21 @@
                                         apiGetter: params.apiGetter,
                                         maxDistance: zoomItem.MaxZoom,
                                         minDistance: zoomItem.MinZoom,
-                                        rendered: (_c = params.rendered) === null || _c === void 0 ? void 0 : _c.get(entity.Bruce.ID)
+                                        rendered: (_c = params.rendered) === null || _c === void 0 ? void 0 : _c.get(entity.Bruce.ID),
+                                        entityHistoric: (_d = params.entitiesHistoric) === null || _d === void 0 ? void 0 : _d[entity.Bruce.ID]
                                     })];
                             case 7:
-                                cEntity = _f.sent();
+                                cEntity = _g.sent();
                                 if (!cEntity) return [3 /*break*/, 9];
                                 return [4 /*yield*/, getName(api, entity)];
                             case 8:
-                                name_2 = _f.sent();
+                                name_2 = _g.sent();
                                 cEntity.name = name_2;
-                                cEntity._renderGroup = getRenderGroupId(zoomItem, (_d = params.viewer) === null || _d === void 0 ? void 0 : _d.terrainProvider);
-                                _f.label = 9;
+                                cEntity._renderGroup = getRenderGroupId(zoomItem, (_e = params.viewer) === null || _e === void 0 ? void 0 : _e.terrainProvider);
+                                _g.label = 9;
                             case 9:
                                 cEntities.set(entity.Bruce.ID, cEntity);
-                                _f.label = 10;
+                                _g.label = 10;
                             case 10:
                                 i++;
                                 return [3 /*break*/, 1];
@@ -6184,6 +6410,9 @@
             function Render(params) {
                 var _this = this;
                 var entity = params.entity;
+                if (!params.entityHistoric) {
+                    params.entityHistoric = [];
+                }
                 var transform = entity === null || entity === void 0 ? void 0 : entity.transform;
                 var heading = EnsureNumber(transform === null || transform === void 0 ? void 0 : transform.heading);
                 heading = (heading + 90) % 360;
@@ -6230,29 +6459,38 @@
                         color = colorToCColor(bColor);
                     }
                 }
-                /*
-                const cEntity: ICesiumEntityExt = new Cesium.Entity({
-                    id: ObjectUtils.UId(10),
-                    model: {
-                        uri: params.lodUrl,
-                        heightReference: heightRef,
-                        scale: scale * styleScale,
-                        shadows: Cesium.ShadowMode.ENABLED,
-                        colorBlendAmount: blendAmount,
-                        colorBlendMode: blendMode,
-                        color: new Cesium.CallbackProperty(() => color, true),
-                        distanceDisplayCondition: getDisplayCondition(params.minDistance, params.maxDistance)
-                    },
-                    orientation: new Cesium.ConstantProperty(orientation),
-                    position: pos,
-                    show: true
-                });
-                */
                 var animateScale = null;
                 var cEntity = params.rendered;
                 if (!cEntity || !cEntity.model) {
                     var hpr = new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(heading), Cesium.Math.toRadians(pitch), Cesium.Math.toRadians(roll));
                     var orientation_1 = Cesium.Transforms.headingPitchRollQuaternion(pos3d, hpr);
+                    if (!color) {
+                        color = Cesium.Color.WHITE.clone();
+                    }
+                    var animateColor_1 = new CesiumAnimatedProperty.AnimateColor({
+                        durationMs: 1500,
+                        targetColor: color,
+                        startColor: color.clone().withAlpha(0.001),
+                        viewer: params.viewer
+                    });
+                    var position = null;
+                    // If we have a series of time-based positions then we'll animate as time changes.
+                    var series = getSeriesPossesForHistoricEntity(params.viewer, heightRef, params.entityHistoric);
+                    if (series.length > 1) {
+                        var animatePosition_7 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                            posses: series,
+                            viewer: params.viewer
+                        });
+                        position = new Cesium.CallbackProperty(function () { return animatePosition_7.GetValue(); }, false);
+                    }
+                    else {
+                        position = new Cesium.CallbackProperty(function () { return exports.EntityUtils.GetPos({
+                            viewer: params.viewer,
+                            entity: entity,
+                            recordHeightRef: heightRef,
+                            returnHeightRef: heightRef
+                        }); }, true);
+                    }
                     cEntity = new Cesium.Entity({
                         id: bruceModels.ObjectUtils.UId(10),
                         model: {
@@ -6262,17 +6500,27 @@
                             shadows: Cesium.ShadowMode.ENABLED,
                             colorBlendAmount: blendAmount,
                             colorBlendMode: blendMode,
-                            color: new Cesium.CallbackProperty(function () { return color; }, true),
+                            color: new Cesium.CallbackProperty(function () {
+                                var color = animateColor_1.GetColor();
+                                if (animateColor_1.IsDone() && (cEntity === null || cEntity === void 0 ? void 0 : cEntity.model)) {
+                                    cEntity.model.color = new Cesium.CallbackProperty(function () { return color; }, true);
+                                }
+                                return color;
+                            }, false),
                             distanceDisplayCondition: getDisplayCondition(params.minDistance, params.maxDistance)
                         },
                         orientation: new Cesium.CallbackProperty(function () { return orientation_1; }, true),
-                        position: new Cesium.CallbackProperty(function () { return pos3d; }, true),
+                        position: position,
                         show: true
                     });
                     exports.CesiumEntityStyler.BakeDefaultColor({
                         entity: cEntity,
                         viewer: params.viewer,
-                        override: true
+                        override: true,
+                        colors: {
+                            "model": color
+                        },
+                        refresh: false
                     });
                 }
                 else {
@@ -6302,17 +6550,28 @@
                     cEntity.model.colorBlendAmount = new Cesium.ConstantProperty(blendAmount);
                     cEntity.model.colorBlendMode = new Cesium.ConstantProperty(blendMode);
                     cEntity.model.distanceDisplayCondition = new Cesium.ConstantProperty(getDisplayCondition(params.minDistance, params.maxDistance));
-                    var prevPos3d = getValue$1(params.viewer, cEntity.position);
-                    var posChanged = !prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d);
-                    var animatePosition_3 = null;
-                    if (posChanged) {
-                        animatePosition_3 = new CesiumAnimatedProperty.AnimatePosition({
-                            durationMs: 200,
-                            targetPos3d: pos3d,
-                            viewer: params.viewer,
-                            startPos3d: prevPos3d
+                    // If we have a series of time-based positions then we'll animate as time changes.
+                    var series = getSeriesPossesForHistoricEntity(params.viewer, heightRef, params.entityHistoric);
+                    if (series.length > 1) {
+                        var animatePosition_8 = new CesiumAnimatedProperty.AnimatePositionSeries({
+                            posses: series,
+                            viewer: params.viewer
                         });
-                        cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_3.GetValue(); }, false);
+                        cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_8.GetValue(); }, false);
+                    }
+                    else {
+                        var prevPos3d = getValue$1(params.viewer, cEntity.position);
+                        var posChanged = !prevPos3d || !Cesium.Cartesian3.equals(prevPos3d, pos3d);
+                        var animatePosition_9 = null;
+                        if (posChanged) {
+                            animatePosition_9 = new CesiumAnimatedProperty.AnimatePosition({
+                                durationMs: 200,
+                                targetPos3d: pos3d,
+                                viewer: params.viewer,
+                                startPos3d: prevPos3d
+                            });
+                            cEntity.position = new Cesium.CallbackProperty(function () { return animatePosition_9.GetValue(); }, false);
+                        }
                     }
                     // cEntity.orientation = new Cesium.ConstantProperty(orientation);
                     var prevHeading = cEntity.model._heading;
@@ -6461,16 +6720,16 @@
             }
             Model3d.Render = Render;
             function RenderGroup(params) {
-                var _a, _b, _c, _d, _e, _f;
+                var _a, _b, _c, _d, _e, _f, _g;
                 return __awaiter(this, void 0, void 0, function () {
-                    var api, cEntities, reqBody, i, entity, zoomItem, style, _g, tagIds, tags, mStyle, group, level, catId, lodData, _loop_2, i;
-                    return __generator(this, function (_h) {
-                        switch (_h.label) {
+                    var api, cEntities, reqBody, i, entity, zoomItem, style, _h, tagIds, tags, mStyle, group, level, catId, lodData, _loop_2, i;
+                    return __generator(this, function (_j) {
+                        switch (_j.label) {
                             case 0:
                                 api = params.apiGetter.getApi();
                                 return [4 /*yield*/, api.Loading];
                             case 1:
-                                _h.sent();
+                                _j.sent();
                                 cEntities = new Map();
                                 reqBody = {
                                     "strict": false,
@@ -6478,7 +6737,7 @@
                                     "Items": []
                                 };
                                 i = 0;
-                                _h.label = 2;
+                                _j.label = 2;
                             case 2:
                                 if (!(i < params.entities.length)) return [3 /*break*/, 9];
                                 entity = params.entities[i];
@@ -6486,13 +6745,13 @@
                                 if (!(zoomItem.StyleID != -1)) return [3 /*break*/, 4];
                                 return [4 /*yield*/, getStyle(api, entity, zoomItem.StyleID)];
                             case 3:
-                                _g = (_a = (_h.sent())) === null || _a === void 0 ? void 0 : _a.Settings;
+                                _h = (_a = (_j.sent())) === null || _a === void 0 ? void 0 : _a.Settings;
                                 return [3 /*break*/, 5];
                             case 4:
-                                _g = zoomItem.Style;
-                                _h.label = 5;
+                                _h = zoomItem.Style;
+                                _j.label = 5;
                             case 5:
-                                style = _g;
+                                style = _h;
                                 tagIds = entity.Bruce["Layer.ID"];
                                 tags = [];
                                 if (!(tagIds && tagIds.length > 0)) return [3 /*break*/, 7];
@@ -6501,8 +6760,8 @@
                                         tagIds: tagIds
                                     })];
                             case 6:
-                                tags = (_h.sent()).tags;
-                                _h.label = 7;
+                                tags = (_j.sent()).tags;
+                                _j.label = 7;
                             case 7:
                                 mStyle = (_b = style === null || style === void 0 ? void 0 : style.modelStyle) !== null && _b !== void 0 ? _b : {};
                                 group = mStyle.lodGroup ? bruceModels.Calculator.GetString(mStyle.lodGroup, entity, tags) : null;
@@ -6523,7 +6782,7 @@
                                     "group": group,
                                     "level": level
                                 });
-                                _h.label = 8;
+                                _j.label = 8;
                             case 8:
                                 i++;
                                 return [3 /*break*/, 2];
@@ -6532,24 +6791,24 @@
                                     filter: reqBody
                                 })];
                             case 10:
-                                lodData = (_h.sent()).lods;
+                                lodData = (_j.sent()).lods;
                                 _loop_2 = function (i) {
-                                    var entity, zoomItem, style, _j, tagIds, tags, lod, mStyle, cEntity, name_5;
-                                    return __generator(this, function (_k) {
-                                        switch (_k.label) {
+                                    var entity, zoomItem, style, _k, tagIds, tags, lod, mStyle, cEntity, name_5;
+                                    return __generator(this, function (_l) {
+                                        switch (_l.label) {
                                             case 0:
                                                 entity = params.entities[i];
                                                 zoomItem = params.zoomItems[entity.Bruce.ID];
                                                 if (!(zoomItem.StyleID != -1)) return [3 /*break*/, 2];
                                                 return [4 /*yield*/, getStyle(api, entity, zoomItem.StyleID)];
                                             case 1:
-                                                _j = (_c = (_k.sent())) === null || _c === void 0 ? void 0 : _c.Settings;
+                                                _k = (_c = (_l.sent())) === null || _c === void 0 ? void 0 : _c.Settings;
                                                 return [3 /*break*/, 3];
                                             case 2:
-                                                _j = zoomItem.Style;
-                                                _k.label = 3;
+                                                _k = zoomItem.Style;
+                                                _l.label = 3;
                                             case 3:
-                                                style = _j;
+                                                style = _k;
                                                 tagIds = entity.Bruce["Layer.ID"];
                                                 tags = [];
                                                 if (!(tagIds && tagIds.length > 0)) return [3 /*break*/, 5];
@@ -6558,8 +6817,8 @@
                                                         tagIds: tagIds
                                                     })];
                                             case 4:
-                                                tags = (_k.sent()).tags;
-                                                _k.label = 5;
+                                                tags = (_l.sent()).tags;
+                                                _l.label = 5;
                                             case 5:
                                                 lod = lodData.find(function (x) { return x.entityId == entity.Bruce.ID; });
                                                 if (!(lod === null || lod === void 0 ? void 0 : lod.clientFileId)) {
@@ -6569,6 +6828,7 @@
                                                 cEntity = Render({
                                                     rendered: (_e = params.rendered) === null || _e === void 0 ? void 0 : _e.get(entity.Bruce.ID),
                                                     entity: entity,
+                                                    entityHistoric: (_f = params.entitiesHistoric) === null || _f === void 0 ? void 0 : _f[entity.Bruce.ID],
                                                     style: mStyle,
                                                     tags: tags,
                                                     viewer: params.viewer,
@@ -6584,23 +6844,23 @@
                                                 if (!cEntity) return [3 /*break*/, 7];
                                                 return [4 /*yield*/, getName(api, entity)];
                                             case 6:
-                                                name_5 = _k.sent();
+                                                name_5 = _l.sent();
                                                 cEntity.name = name_5;
-                                                cEntity._renderGroup = getRenderGroupId(zoomItem, (_f = params.viewer) === null || _f === void 0 ? void 0 : _f.terrainProvider);
+                                                cEntity._renderGroup = getRenderGroupId(zoomItem, (_g = params.viewer) === null || _g === void 0 ? void 0 : _g.terrainProvider);
                                                 cEntities.set(entity.Bruce.ID, cEntity);
-                                                _k.label = 7;
+                                                _l.label = 7;
                                             case 7: return [2 /*return*/];
                                         }
                                     });
                                 };
                                 i = 0;
-                                _h.label = 11;
+                                _j.label = 11;
                             case 11:
                                 if (!(i < params.entities.length)) return [3 /*break*/, 14];
                                 return [5 /*yield**/, _loop_2(i)];
                             case 12:
-                                _h.sent();
-                                _h.label = 13;
+                                _j.sent();
+                                _j.label = 13;
                             case 13:
                                 i++;
                                 return [3 /*break*/, 11];
@@ -7823,6 +8083,165 @@
         EntityLabel.GetLabel = GetLabel;
     })(exports.EntityLabel || (exports.EntityLabel = {}));
 
+    function getColor$2(viewer, obj) {
+        var value = null;
+        if (obj === null || obj === void 0 ? void 0 : obj.getValue) {
+            var date = viewer.scene.lastRenderTime;
+            if (!date) {
+                date = viewer.clock.currentTime;
+            }
+            value = obj.getValue(date);
+        }
+        else {
+            value = obj;
+        }
+        if (value && value instanceof Cesium.ColorMaterialProperty) {
+            value = value.color;
+        }
+        return value;
+    }
+    var CesiumAnimatedInOut;
+    (function (CesiumAnimatedInOut) {
+        /**
+         * Animates an Entity out of the scene.
+         * Removes it from the scene at the end of the animation.
+         * @param params
+         */
+        function AnimateOut(params) {
+            var viewer = params.viewer, entity = params.entity;
+            if (entity instanceof Cesium.Entity) {
+                var pieces = exports.EntityUtils.GatherEntity({
+                    entity: entity,
+                });
+                var leaderSet = false;
+                var removed_1 = false;
+                var doRemove_1 = function () {
+                    if (removed_1) {
+                        return;
+                    }
+                    removed_1 = true;
+                    var removal = viewer.scene.postRender.addEventListener(function () {
+                        removal();
+                        exports.EntityRenderEngine.Remove({
+                            viewer: viewer,
+                            entity: entity
+                        });
+                    });
+                };
+                var _loop_1 = function (i) {
+                    var piece = pieces[i];
+                    if (piece instanceof Cesium.Entity) {
+                        var animateColor_1;
+                        var thing_1;
+                        var colorPropKey_1;
+                        if (piece.model) {
+                            var curColor = getColor$2(viewer, piece.model.color);
+                            if (!curColor) {
+                                curColor = Cesium.Color.WHITE.clone();
+                            }
+                            animateColor_1 = new CesiumAnimatedProperty.AnimateColor({
+                                durationMs: 500,
+                                targetColor: curColor.withAlpha(0.01),
+                                startColor: curColor,
+                                viewer: viewer
+                            });
+                            thing_1 = piece.model;
+                            colorPropKey_1 = "color";
+                        }
+                        else if (piece.point) {
+                            var curColor = getColor$2(viewer, piece.point.color);
+                            if (!curColor) {
+                                curColor = Cesium.Color.WHITE.clone();
+                            }
+                            animateColor_1 = new CesiumAnimatedProperty.AnimateColor({
+                                durationMs: 500,
+                                targetColor: curColor.withAlpha(0.01),
+                                startColor: curColor,
+                                viewer: viewer
+                            });
+                            thing_1 = piece.point;
+                            colorPropKey_1 = "color";
+                        }
+                        else if (piece.billboard) {
+                            var curColor = getColor$2(viewer, piece.billboard.color);
+                            if (!curColor) {
+                                curColor = Cesium.Color.WHITE.clone();
+                            }
+                            animateColor_1 = new CesiumAnimatedProperty.AnimateColor({
+                                durationMs: 200,
+                                targetColor: curColor.withAlpha(0.0),
+                                startColor: curColor,
+                                viewer: viewer
+                            });
+                            thing_1 = piece.billboard;
+                            colorPropKey_1 = "color";
+                        }
+                        // Other graphic types don't support colour animation.
+                        if (thing_1 && colorPropKey_1 && animateColor_1) {
+                            var isLeader_1 = !leaderSet;
+                            leaderSet = true;
+                            var callback = function () {
+                                var color = animateColor_1.GetColor();
+                                if (isLeader_1 && animateColor_1.IsDone()) {
+                                    doRemove_1();
+                                    thing_1[colorPropKey_1] = new Cesium.ConstantProperty(color);
+                                }
+                                return color;
+                            };
+                            if (thing_1[colorPropKey_1] instanceof Cesium.CallbackProperty) {
+                                thing_1[colorPropKey_1].setCallback(callback, false);
+                            }
+                            else {
+                                thing_1[colorPropKey_1] = new Cesium.CallbackProperty(callback, false);
+                            }
+                        }
+                    }
+                };
+                for (var i = 0; i < pieces.length; i++) {
+                    _loop_1(i);
+                }
+                // Nothing animated, so just remove the entity.
+                if (!leaderSet) {
+                    exports.EntityRenderEngine.Remove({
+                        viewer: viewer,
+                        entity: entity
+                    });
+                }
+            }
+            else if (entity instanceof Cesium.Primitive) {
+                if (viewer.scene.primitives.contains(entity)) {
+                    viewer.scene.primitives.remove(entity);
+                }
+            }
+            else if (entity instanceof Cesium.Cesium3DTileFeature) {
+                try {
+                    CesiumAnimatedProperty.AnimateTFeatureColor({
+                        durationMs: 500,
+                        feature: entity,
+                        targetColor: Cesium.Color.WHITE.withAlpha(0.0),
+                        startColor: entity.color ? entity.color : Cesium.Color.WHITE.clone(),
+                        viewer: viewer,
+                        onDone: function () {
+                            var tileset = entity === null || entity === void 0 ? void 0 : entity.tileset;
+                            if (tileset && viewer.scene.primitives.contains(tileset)) {
+                                entity.show = false;
+                            }
+                        }
+                    });
+                }
+                catch (e) {
+                    console.error(e);
+                    // If an error occurs, just hide the feature.
+                    var tileset = entity === null || entity === void 0 ? void 0 : entity.tileset;
+                    if (tileset && viewer.scene.primitives.contains(tileset)) {
+                        entity.show = false;
+                    }
+                }
+            }
+        }
+        CesiumAnimatedInOut.AnimateOut = AnimateOut;
+    })(CesiumAnimatedInOut || (CesiumAnimatedInOut = {}));
+
     /**
      * Returns if a given visual is alive and in the scene.
      * @param viewer
@@ -7853,28 +8272,10 @@
     }
     function removeEntity(viewer, visual) {
         unmarkEntity(visual, false);
-        if (visual instanceof Cesium.Entity) {
-            exports.EntityRenderEngine.Remove({
-                viewer: viewer,
-                entity: visual
-            });
-        }
-        else if (visual instanceof Cesium.Primitive) {
-            if (viewer.scene.primitives.contains(visual)) {
-                viewer.scene.primitives.remove(visual);
-            }
-        }
-        else if (visual instanceof Cesium.Cesium3DTileFeature) {
-            try {
-                var tileset = visual === null || visual === void 0 ? void 0 : visual.tileset;
-                if (tileset && viewer.scene.primitives.contains(tileset)) {
-                    visual.show = false;
-                }
-            }
-            catch (e) {
-                console.error(e);
-            }
-        }
+        CesiumAnimatedInOut.AnimateOut({
+            entity: visual,
+            viewer: viewer
+        });
     }
     var MAX_SHOW_DEPTH = 10;
     function updateCEntityShow(viewer, visual, rego, show, ignoreParent, depth) {
@@ -8617,6 +9018,7 @@
                                 rego: rego
                             });
                             removeEntity(this.viewer, rego.visual);
+                            rego.visual = null;
                             var doesInclude = this.rego[entityId_4].find(function (r) { return r.menuItemId === menuItemId; });
                             if (doesInclude) {
                                 this.rego[entityId_4] = entityRegos.filter(function (r) { return r.menuItemId !== menuItemId; });
@@ -8648,6 +9050,7 @@
                             rego: rego
                         });
                         removeEntity(this_2.viewer, rego.visual);
+                        rego.visual = null;
                         (_b = this_2.onUpdate) === null || _b === void 0 ? void 0 : _b.Trigger({
                             type: EVisualUpdateType.Remove,
                             entityId: rego.entityId,
@@ -8678,6 +9081,7 @@
                                 rego: rego
                             });
                             removeEntity(this.viewer, rego.visual);
+                            rego.visual = null;
                             this.rego[entityId_5] = entityRegos.filter(function (r) { return r.menuItemId !== menuItemId; });
                             (_c = this.onUpdate) === null || _c === void 0 ? void 0 : _c.Trigger({
                                 type: EVisualUpdateType.Remove,
@@ -10462,33 +10866,55 @@
                 var _a, _b, _c, _d, _e, _f, _g, _h, _j;
                 if (force === void 0) { force = false; }
                 return __awaiter(this, void 0, void 0, function () {
-                    var toRemove, i, entity, _k, updated, cEntities, i, entity, id, cEntity, rego, visual, wasClustered, tagIds, rego_1;
+                    var entitiesHistoric, toRemove, i, entity, startTmp, stopTmp, startStr, stopStr, historicData, _k, updated, cEntities, i, entity, id, cEntity, rego, visual, wasClustered, tagIds, rego_1;
                     return __generator(this, function (_l) {
                         switch (_l.label) {
                             case 0:
-                                if ((_a = this.item.BruceEntity) === null || _a === void 0 ? void 0 : _a.historicAttrKey) {
-                                    toRemove = entities.filter(function (x) { var _a; return !((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.historicAttrKey); });
-                                    for (i = 0; i < toRemove.length; i++) {
-                                        entity = toRemove[i];
-                                        this.visualsManager.RemoveRegos({
-                                            entityId: entity.Bruce.ID,
-                                            menuItemId: this.item.id,
-                                            requestRender: false
-                                        });
-                                        (_b = this.clustering) === null || _b === void 0 ? void 0 : _b.RemoveEntity(entity.Bruce.ID, false);
-                                    }
-                                    entities = entities.filter(function (x) { var _a; return !!((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.historicAttrKey); });
-                                }
-                                return [4 /*yield*/, exports.EntityRenderEngine.Render({
-                                        viewer: this.viewer,
-                                        apiGetter: this.apiGetter,
-                                        entities: entities,
+                                entitiesHistoric = {};
+                                if (!((_a = this.item.BruceEntity) === null || _a === void 0 ? void 0 : _a.historicAttrKey)) return [3 /*break*/, 2];
+                                toRemove = entities.filter(function (x) { var _a; return !((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.historicAttrKey); });
+                                for (i = 0; i < toRemove.length; i++) {
+                                    entity = toRemove[i];
+                                    this.visualsManager.RemoveRegos({
+                                        entityId: entity.Bruce.ID,
                                         menuItemId: this.item.id,
-                                        visualRegister: this.visualsManager,
-                                        zoomControl: this.item.CameraZoomSettings,
-                                        force: force
+                                        requestRender: false
+                                    });
+                                    (_b = this.clustering) === null || _b === void 0 ? void 0 : _b.RemoveEntity(entity.Bruce.ID, false);
+                                }
+                                entities = entities.filter(function (x) { var _a; return !!((_a = x.Bruce) === null || _a === void 0 ? void 0 : _a.historicAttrKey); });
+                                if (!this.item.historicInterpolation) return [3 /*break*/, 2];
+                                if (!entities.length) return [3 /*break*/, 2];
+                                startTmp = Cesium.JulianDate.toDate(this.viewer.clock.startTime);
+                                stopTmp = Cesium.JulianDate.toDate(this.viewer.clock.stopTime);
+                                startStr = new Date(startTmp.getTime() - 1000).toISOString();
+                                stopStr = new Date(stopTmp.getTime() + 1000).toISOString();
+                                return [4 /*yield*/, bruceModels.EntityHistoricData.GetList({
+                                        attrKey: this.item.BruceEntity.historicAttrKey,
+                                        dateTimeFrom: startStr,
+                                        dateTimeTo: stopStr,
+                                        entityIds: entities.map(function (x) { return x.Bruce.ID; }),
+                                        api: this.apiGetter.getApi()
                                     })];
                             case 1:
+                                historicData = _l.sent();
+                                if (this.disposed) {
+                                    this.doDispose();
+                                    return [2 /*return*/];
+                                }
+                                entitiesHistoric = historicData.recordsByIds;
+                                _l.label = 2;
+                            case 2: return [4 /*yield*/, exports.EntityRenderEngine.Render({
+                                    viewer: this.viewer,
+                                    apiGetter: this.apiGetter,
+                                    entities: entities,
+                                    menuItemId: this.item.id,
+                                    visualRegister: this.visualsManager,
+                                    zoomControl: this.item.CameraZoomSettings,
+                                    entitiesHistoric: entitiesHistoric,
+                                    force: force
+                                })];
+                            case 3:
                                 _k = _l.sent(), updated = _k.updated, cEntities = _k.entities;
                                 if (this.disposed) {
                                     this.doDispose();
@@ -23598,7 +24024,7 @@
         ViewRenderEngine.Render = Render;
     })(exports.ViewRenderEngine || (exports.ViewRenderEngine = {}));
 
-    var VERSION = "3.8.2";
+    var VERSION = "3.8.4";
 
     exports.VERSION = VERSION;
     exports.CesiumParabola = CesiumParabola;