toggle timeline/animation visibility and relocate credit line

CesiumJS
1
  1. What is the recommended technique to toggle the visibility of both the timeline and the animation control? We would like to switch between animation views and “aggregate” views that do not rely upon entity availability for visibility. The following works, but is there a better method?

if ($scope.timelineContainer == null) {
$scope.timelineContainer = viewer._timeline.container;
$scope.animationContainer = viewer._animation.container;

}

if (showClock && $scope.timelineContainer.parentNode != viewer._element) {
viewer._element.appendChild($scope.timelineContainer);
viewer._element.appendChild($scope.animationContainer);
} else if (!showClock && $scope.timelineContainer.parentNode == viewer._element) {
viewer._element.removeChild($scope.timelineContainer);
viewer._element.removeChild($scope.animationContainer);
}

  1. When hiding the Timeline and Animation controls, what is the recommended technique for “refreshing” the CreditDisplay so that it redraws at the bottom of the Viewer screen? (And vice versa when restoring the Timeline and Animation controls.)
2

Hello Kirk,

That solution seems fine. Instead of adding/removing the DOM element, I would personally just toggle the css style of the container to display:none, display: block. I’m not sure it matters though.

You’ll have to update the position of the credit display manually when you toggle the elements on and off like this:

viewer.cesiumWidget.creditContainer.parentElement.style.bottom = ‘0px’;

``

There’s a problem with this method where the credit will pop back to it’s default position when you resize the window. I’m going to look into a better way to do this in the near future.

Best,

Hannah

3

Thank you, Hannah.