Control Earth rotation

CesiumJS
1

Hi Guys,

Is it possible to control earth rotation ?

I am trying to rotate the earth at 180 at every button click.

Thanks,
Kulvinder

2

The Earth does rotate in CesiumJS, based on the time. By default the camera is fixed to the Earth as it rotates. You can fix the camera in space by applying a transform, see the “View in ICRF” dropdown here: https://sandcastle.cesium.com/index.html?src=Camera.html.

Then you can make your button click advance the clock by 12 hours to rotate the Earth 180 degrees.

3

Thanks for replying, I am trying the same camera function. On first button click earth rotates 180 degree. And on proceeding button click nothing happens, can you please guide me in which code line should I set the time ?

Thanks
Kulvinder

4

I’m not sure why it would work for the first click and not for any subsequent clicks. Can you share a Sandcastle example reproducing this issue? See How to share custom Sandcastle examples

5

Thanks for responding.

Actually i am trying to rotate the earth 180 degree half way around when a button is clicked. I works for first click as i am timing out the spin rotation time after few seconds. But when i click the button again, it rotate with double speed. What i am trying to achieve is when i click the button, it should rotate the earth 180 degree halfway around the earth, and no succeeding clicks to other 180 degree.
Here is the example:

Thanks,
Kulvinder

6

It’s because each time you click you add a new event listener without removing the previous one, so it runs twice (and then 3x etc).

7

I suppose rotate the Earth meaning in relation to the camera. It would be weird rotating the Earth relative to the Sun and Moon (with time stopped) so that what would should be noon turns into midnight!

8

Hi Guys,
Thanks for responding to this post.

Yes, your are right Omar.
@Hyper_Sonic Is there a way that i can destroy its previous state or i can achieve this functionality like when i click a button, earth rotates half way and on second click it rotates another half way to complete 360 degree rotation?

Thanks,
Kulvinder Singh

9

I was checking out your sandcastle. Just clicking once I noticed that spinGlobe just keeps executing. However the addeventlistener only executed once, and the timeout executed once. Over time after just clicking once the delta slowly builds in value. It builds even faster with multiple clicks.

Still trying to figure out why it keeps executing. EDIT: oh wait, didn’t see the other addeventlistener inside of spinGlobe, just noticed the one on the bottom of the code. Now I see what Omar was referring to. viewer.scene.postRender executes end of every render, that’s causing it to execute all the time.

Ya, where you do the timeout function, put removeeventlistener there, that should fix it.

viewer.scene.postRender.removeEventListener()

Though even when giving the anonymous function a name, I had trouble identify it. I mean there’s no type like click, just the handler.

10

Hi @Hyper_Sonic

Thanks for responding.

Removing event listener did not help: https://sandcastle.cesium.com/index.html#c=jVPbattAEP2VQU9SUVdySyFg2ZS6oQRCCnHahyIoa2mSLlntmt2RjBvy7x3JkSxHLq2eZmfOmetRIx00CnfoYAEGd7BCr+pKfO98YR4U3XtlDUll0OVBNM9NwyxnSZKy6y1iydxUpBccyc19bQr2G/BbZb5ou8HwUCB6yg2MvjaJlp5u7I75nyWhMHYXtvnhBNexhS/QoNhaT7doSnbIsrxs0NC18sQhFw6Vww4bA6kKI3hV9lDY/KNoB2onuGUII8fTzpPkZdoppURNkvFhW+BtP18ECczSNJ1QjvMzfhI9Hb2QFTopuk4wfLnTSjpiS5r34tvN1d3PH/Gx6zeHbqazATyfdbbna43SFnXFmxUPSJcaW/PT/qpkNbS5Zxcpq2C6ftaKVsVjHsRwvMS5/Q/f68B4yYt3YrquiaSmCKQ7vrqtaZBDGD2dZubjzeE5htmHNI37BH9TmcPKNng66dBGBOf2+B+TDjcI4iDztNe47CEfVbW1jqB2OhQiIay2mq/pk01dPCKJwvu+aJaMqVmpGlDl4sw/CwULzXPkvtZ6rX5jHiyzhPETqrayVObha4NOy30L+zVbXh+cQogs4ed5JlmrN5KL9ZFNTcQS6IKDboZOBs9yzRawmSUHxrKX4bjOHw

Can you please edit this sandcastle to put the removeEventListner, or can check above if i put it right ?
Thanks,
Kulvinder

11

Messing around with it a bit I managed to get it to work as intended

var viewer = new Cesium.Viewer("cesiumContainer");
var rotatioSpeed;
var lastNow;

function spinIt(scene, time) {
              var now = Date.now();
              var spinRate = rotatioSpeed;//0.08;
              var delta = (now - lastNow) / 1000;
              lastNow = now;
               viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, spinRate * delta);
                }
function spinGlobe(viewer){
            lastNow = Date.now();
             viewer.scene.postRender.addEventListener(spinIt);
                }
    document.getElementById("spin180").addEventListener("click", function (e) {
              rotatioSpeed=2.0;
              spinGlobe(viewer);
              setTimeout(function(){ rotatioSpeed=0.0;viewer.scene.postRender.removeEventListener(spinIt);
                                   }, 1800);    
                  });

Made lastNow a global, but it could be modified to pass by parameter. Separated spinIt to get a named function that remove can identify. Not exactly 180deg each time though, not sure why. Slight variations in framerate I suppose.EDIT: ya I put console.log(delta); right after delta is set and noticed some fluctuations between 16 and 17 millisecond frametime, sometimes even more here and there.

1 Like
12

Hi @Hyper_Sonic

Awesome!!! You nailed it.

Much appreciate.

Thanks,
Kulvinder Singh

13

Thanks, glad I could help! I suppose you could put a longitude check in spinIT, and just return if the camera has already arrived at the desired longitude (180 from where it was.)

Heck, could even rewrite it, just stop spinning (remove eventlistener) when 180 is met, don’t need the timeout function anymore. You get there when you get there. viewer.scene.camera.positionCartographic I believe is a good way to get longitude.

1 Like
14

Awesome!!

I will give it a shot!!

Thanks both of you on guiding me on this.

Thanks,
Kulvinder

15

You’re welcome I learned something new as well, apparently for somethings you don’t need to specify an event type, just the handler for it. I suppose because viewer.scene.postRender doesn’t have event types, other than just executing.

2 Likes