# Displaying the Earth's Rotation

**URL:** <https://community.cesium.com/t/displaying-the-earths-rotation/55>\
**Category:** CesiumJS\
**Created:** [July 12, 2012, 4:49pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55 "2012-07-12T16:49:12Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![Eric\_Miller](https://avatars.discourse-cdn.com/v4/letter/e/848f3c/32.png) [@Eric\_Miller](https://community.cesium.com/u/Eric_Miller)\
**Post date:** [July 12, 2012, 4:49pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/1 "2012-07-12T16:49:12Z")

</div>

Is there a way to display the earth’s inertial rotation, the way Insight3D does by default? I’m not sure if this is a function of central body, camera, scene, etc, but I’ve been looking for a way to set this and haven’t found one.

---

<div class="post-metadata">

**Author:** ![patrick](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/patrick/32/2045_2.png) [@patrick](https://community.cesium.com/u/patrick)\
**Post date:** [July 12, 2012, 9:03pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/2 "2012-07-12T21:03:10Z")

</div>

Hi Eric,

We don’t have this right now; however, below you will find an approximation for converting from TEME to pseudo-fixed. You can use it to set the camera’s transform, and make the globe spin. In the skeleton, replace the scene.setAnimation(…) call with this:

/\*\*

- Computes a rotation matrix to transform a point or vector from True Equator Mean Equinox (TEME) axes to the

- pseudo-fixed axes at a given time. This method treats the UT1 time standard as equivalent to UTC.

---

<div class="post-metadata">

**Author:** ![Eric\_Miller](https://avatars.discourse-cdn.com/v4/letter/e/848f3c/32.png) [@Eric\_Miller](https://community.cesium.com/u/Eric_Miller)\
**Post date:** [July 13, 2012, 4:20pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/3 "2012-07-13T16:20:16Z")

</div>

Patrick,

Thanks for that code. I was able to get that working in the CesiumViewer, and I see what you mean about the camera controls.

Will I need to provide all of my positional data in ECEF? My propagation algorithms currently deal only in ECI and my ECEF conversion code is buried in FORTRAN in a place I can’t get to it, so I will need to do some work to convert. I know this is easy to do in STK Components, and I was just curious what the plan for this is.

Eric

---

<div class="post-metadata">

**Author:** ![patrick](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/patrick/32/2045_2.png) [@patrick](https://community.cesium.com/u/patrick)\
**Post date:** [July 13, 2012, 5:58pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/4 "2012-07-13T17:58:44Z")

</div>

Eric,

Currently, there are not plans for ECI to ECEF in Cesium. However, you could use the function I provided to set the primitive’s model transform as an approximation, e.g.

> polyline.model = computeTemeToPseudoFixedMatrix(time);

> polyline.setPositions(/\* positions in ECI, well, really TEME \*/);

Regards,

Patrick

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 9, 2016, 7:19pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/5 "2016-03-09T19:19:14Z")

</div>

I have not been able to get this code to work in Sandcastle.

Here are the error messages:

- TypeError: viewer.scene.setAnimation is not a function (on line 45)
- TypeError: Cesium.SunPosition is undefined (on line 46)
- TypeError: time.addSeconds is not a function (on line 49)  
Have there been API changes that affects this code?  
Is this code still the way to get the Earth to rotate?

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 10, 2016, 2:11pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/6 "2016-03-10T14:11:13Z")

</div>

The time interval for this space mission visualization is 2014-07-22 T11:00:00Z to 2014-08-12 T22:07:27Z.  
Buttons on the left side of the page enable selection of viewpoints one of the viewpoints is the Earth.  
[http://daoneil.github.io/spacemission/Apps/EarthToMoon\_withNav.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_withNav.html)

An ideal implementation would be to tie the rotation of the Earth to the time widget shuttle ring.  
What code would enable time widget driven Earth rotation?

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 10, 2016, 3:31pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/7 "2016-03-10T15:31:33Z")

</div>

Hello,

This code sample is very old, and the API has changed since then.

Take a look at the camera Sandcastle demo: [http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Camera.html&label=Showcases](http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Camera.html&label=Showcases)

From the menu, select ‘View in ICRF’ and look at that section of the code.

Best,

Hannah

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 14, 2016, 8:01pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/8 "2016-03-14T20:01:50Z")

</div>

I implemented the code from the camera Sandcastle demo. Now, the problem is the trajectories rotate along with the Earth.  
This  
link leads to the version with the camera.transform. Please wait 30 seconds until the buttons are no longer grey then click on the Earth button.  
[http://daoneil.github.io/spacemission/Apps/EarthToMoon\_spinGlobe.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_spinGlobe.html)

I’m wondering whether it’s possible to periodically update the orientation of the viewer.scene.globe.ellipsoid.  
I’ve tried setting the orientation to a Matrix4 and Quaternion and I get type errors.  
What is the data type of an entity’s orientation?

Here is some code that I have attempted in Sandcastle:

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var currentAngle = 0 ;  
// var m = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(currentAngle));

var zAxis = new Cesium.Cartesian3(0, 0, 1) ;  
var rotquat = new Cesium.Quaternion.fromAxisAngle(zAxis,Cesium.Math.toRadians(currentAngle)) ;

viewer.clock.onTick.addEventListener(function(clock) {

// viewer.scene.globe.ellipsoid.orientation = Cesium.Matrix4.fromRotationTranslation(m, Cesium.Cartesian3.ZERO);

```
console.log("ready to set orientation") ;
viewer.scene.globe.ellipsoid.orientation = rotquat ;

currentAngle = currentAngle + 1 ;
if (currentAngle > 360) { currentAngle = 0 ; }

rotquat = Cesium.Quaternion.fromAxisAngle(zAxis,Cesium.Math.toRadians(currentAngle)) ;

```

// m = Cesium.Matrix3.fromRotationZ(Cesium.Math.toRadians(currentAngle)) ;

});

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 14, 2016, 10:07pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/9 "2016-03-14T22:07:58Z")

</div>

Cool demo!  
I see, your coordinates are already in ICRF. That’s why they’re moving.

In your CZML file, you can define the reference frame for your positions.

Try

“position”: {  
“referenceFrame”: “INERTIAL”,  
…

``

Hope this helps!

-Hannah

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 16, 2016, 7:28pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/10 "2016-03-16T19:28:00Z")

</div>

Hannah -

Thanks! adding the inertial reference frame to the CZML files fixed the problem with the trajectories rotating with the Earth.  
Now, the view point buttons no longer work, probably because the camera and the tracked entity are in two different reference frames.

This code snippet is the function called by the view point Moon button:

function showTheMoon() {  
var ourMoon = czmlDataSource2.entities.getById(‘theMoon’) ;  
viewer.trackedEntity = ourMoon ;  
}

In the function called by the Spacecraft button, I attempted to produce a transform based on the lunar probe’s position and use the transform in the camera.looAtTtransform function.

function showSpaceCraft() {  
var spaceCraft = czmlDataSource1.entities.getById(‘lunarProbe’) ;

var center = spaceCraft.position.getValue(Cesium.JulianDate.now()) ;  
center.x = center.x + 10 ;  
center.y = center.y + 10 ; // move center away from the spacecraft

```
  console.log ("center ", center) ; // nothing appears in the console

```

// Get the transform from local east-north-up at the adjusted center.  
var transform = Cesium.Transforms.eastNorthUpToFixedFrame(center);

viewer.camera.lookAtTransform(transform, spaceCraft.position.getValue(Cesium.JulianDate.now()));

}

The current model – [http://daoneil.github.io/spacemission/Apps/EarthToMoon\_spinGlobe.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_spinGlobe.html)

Thanks for your guidance.

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 17, 2016, 2:41pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/11 "2016-03-17T14:41:58Z")

</div>

It looks like there’s a typo in your example that’s throwing an error to the console. I’m not sure if that’s the root of your problem though.

spaceCraft is an entity, correct? To track it, you could set viewer.trackedEntity = spaceCraft; (and viewer.trackedEntity = undefined; to untrack it)

Best,

Hannah

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 18, 2016, 7:17pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/12 "2016-03-18T19:17:49Z")

</div>

Hannah -

Thanks for mentioning the typo; interestingly, the web console in FireFox did not catch it but the web console in Chrome did.

Please look at these two versions of the same demo.

- [http://daoneil.github.io/spacemission/Apps/EarthToMoon\_withCam.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_withCam.html)
- [http://daoneil.github.io/spacemission/Apps/EarthToMoon\_ICRF.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_ICRF.html)  
Within the function called by the spacecraft button is viewer.trackedEntity = spaceCraft ; and  
within the function called by the moon button is viewer.trackedEntity = ourMoon ;

These functions work as desired in the EarthToMoon\_withCam but they don’t work in EarthToMoon\_ICRF.  
In the \_ICRF version, pressing the spacecraft or moon buttons only show an empty star-field.

Both demo versions include the following code:

```
function icrf(scene, time) {
if (scene.mode !== Cesium.SceneMode.SCENE3D) {
    return;
}

var icrfToFixed = Cesium.Transforms.computeIcrfToFixedMatrix(time);
if (Cesium.defined(icrfToFixed)) {
    var camera = viewer.camera;
    var offset = Cesium.Cartesian3.clone(camera.position);
    var transform = Cesium.Matrix4.fromRotationTranslation(icrfToFixed);
    camera.lookAtTransform(transform, offset);
}

```

}  
clock.multiplier = 3 \* 60 \* 60;  
scene.preRender.addEventListener(icrf);

The only difference the is last line, which adds the event listener – it is commented out in the \_withCam version.  
Adding the event listener does cause the Earth to spin while keeping the trajectories still.

Per your previous suggestion, the CZML files include:  
`“position”: {  
“referenceFrame”: “INERTIAL”,

With the camera in ICRF and the trajectories in an Inertial reference frame, wouldn’t we need to  
transform coordinates so the camera and the models are in the same reference frame?  
`  
Thanks.

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 21, 2016, 2:49pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/13 "2016-03-21T14:49:22Z")

</div>

Hello,

Just to make sure I understand, for the EarthToMoon\_ICRF demo, you are using referenceFrame: INERTIAL in the CZML and the scene.preRender event?

-Hannah

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 21, 2016, 6:12pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/14 "2016-03-21T18:12:56Z")

</div>

In the EarthToMoon\_ICRF demo, I have the INERTIAL reference frame specified in the CZML code that specifies the lunar probe and the Moon’s orbit.  
The scene.preRender event is in the JavaScript; here is the script:

In the EarthToMoon\_withCam version, you can see the spacecraft or the Moon when you click the buttons; however the trajectories spin with the Earth.  
In the EarthToMoon\_ICRF version, the Earth spins, the trajectories stay put but you no longer see the spacecraft or the Moon when you click the buttons.

Should the CZML files have something in them about the scene.preRender event or the ICRF?

Thanks,

- Dan

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 24, 2016, 8:48pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/15 "2016-03-24T20:48:46Z")

</div>

Some success!  
This version works, albeit sporadically, [http://daoneil.github.io/spacemission/Apps/EarthToMoon\_Transforms.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_Transforms.html)

Now,  
the Earth spins, the trajectories, stay still, and the buttons work the  
first time. On subsequent clicks of the Spacecraft button there is only  
night-sky; however, if you press the Moon button before pressing the Spacecraft button then the Spacecraft appears.  
The code for the main script as presented in my previous post.  
Here are the functions that are called by the buttons:

function bigPicture() {  
viewer.trackedEntity = undefined  
scene.preRender.  
addEventListener(icrf);  
viewer.camera.setView({  
destination : Cesium.Cartesian3.fromDegrees(-117.16, 32.0, 1500000000.0)  
});  
viewer.trackedEntity = earthCore ;  
console.log (“big picture”) ;  
}

function showSpaceCraft() {  
viewer.trackedEntity = undefined  
scene.preRender.removeEventListener(icrf);

```
var spaceCraft = czmlDataSource1.entities.getById('lunarProbe') ;   
  viewer.trackedEntity = spaceCraft ;

```

}  
function showTheMoon() {  
viewer.trackedEntity = undefined  
scene.preRender.removeEventListener(icrf);

```
var ourMoon = czmlDataSource2.entities.getById('theMoon') ;   
viewer.trackedEntity = ourMoon ;

```

}  
function showTheEarth() {  
viewer.trackedEntity = undefined  
scene.preRender.addEventListener(icrf);  
// Set position with a top-down view  
viewer.camera.setView({  
destination : Cesium.Cartesian3.fromDegrees(-117.16, 32.0, 150000000.0)  
});  
viewer.trackedEntity = earthCore ;  
}

What  
has changed? The functions called by the Spacecraft and Moon buttons removes the event listener that was added in the main script.  
The buttons for the big picture and the Earth add the event listener for ICRF. If someone could let me know how to make the program a little more  
robust regarding the spacecraft as a tracked entity, I would appreciate  
it.

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 24, 2016, 10:21pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/16 "2016-03-24T22:21:24Z")

</div>

Sorry I never got back to you. Glad you were able to figure out a solution!  
What is the problem you were seeing now? I wasn’t able to reproduce it. I clicked the spacecraft button multiple times and switched back and forth between the spacecraft and moon views and everything seemed to work fine.

By the way, we do add a moon ellipsoid to the scene (which I’m sure you’ve noticed). You can turn off our moon by doing viewer.scene.moon.show = false;

And you can add our texture to your moon with

```
"ellipsoid" : {
  "radii" : {
    "cartesian" : [...]
  },
  "material" : {
    "image" : {
      "image" : { "uri" : "path/to/Cesium/Source/Assets/Textures/moonSmall.jpg" }
    }
  }
}

```

``

I’m not sure which version of Cesium you’re using, but the hole in the top of the moon should have be fixed if you use the latest version, 1.19

Best,

Hannah

---

<div class="post-metadata">

**Author:** ![Daniel\_Oneil](https://avatars.discourse-cdn.com/v4/letter/d/e79b87/32.png) [@Daniel\_Oneil](https://community.cesium.com/u/Daniel_Oneil)\
**Post date:** [March 25, 2016, 8:05pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/17 "2016-03-25T20:05:01Z")

</div>

Hannah -

Thanks for the suggested alternative approaches, I chose to turn off the default Moon and texture map an ellipsoid.  
I added a Boolean flag to check before adding or removing the ICRF event listener.  
The CZML now sets the clock multiplier to 2100x.

- Here is the demo -\> [http://daoneil.github.io/spacemission/Apps/EarthToMoon\_Demo.html](http://daoneil.github.io/spacemission/Apps/EarthToMoon_Demo.html)
- Here is the source code for the EarthToMoon\_demo.html and associated CZML files -\> [https://github.com/daoneil/spacemission](https://github.com/daoneil/spacemission)
- Dan

---

<div class="post-metadata">

**Author:** ![hannah](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hannah/32/4509_2.png) [@hannah](https://community.cesium.com/u/hannah)\
**Post date:** [March 28, 2016, 2:32pm UTC](https://community.cesium.com/t/displaying-the-earths-rotation/55/18 "2016-03-28T14:32:24Z")

</div>

Thanks for sharing, Dan! That demo looks really great!

-Hannah