CesiumWidget rotation issue

CesiumJS
1

Hi,
I am facing a problem with the CesiumWidget rotation on mobile development.
"new Cesium.CesiumWidget('map3D', options);"

In general it works, really great to be honest.
The problem comes when I rotate the smartphone.

In case of rotation the globe loses its aspect and becomes totally unresponsive.
I am thinking each time I detect a rotation, to destroy the globe and create it again. It is not the best option but honestly I have not found any other so far.

I have tried with no success to change the aspect ratio in case this is the problem:
cesiumGlobe.scene.getCamera().frustum.aspectRatio = width / height;

I am trying to call resize() method from the CesiumWidget prototype with no success.("TypeError: 'undefined' is not an object (evaluating 'canvas.clientWidth')")

Is it an "expected" behaviour or something that has not been considered yet? If so, Do you have guy any idea about which direction should i take to make it work?

Thank you very much for your time and patience

I attach two screenshots to clarify the explanation

PORTRAIT: http://i.imgur.com/d4AoV8p.png
LANDSCAPE (PROBLEM): http://i.imgur.com/g727Ksh.png

2

You shouldn’t need to do anything special. This sounds like a CSS layout issue more than anything else. For example, the example Cesium Viewer application that ships with Cesium works great on mobile: http://cesiumjs.org/Cesium/Build/Apps/CesiumViewer/index.html

All of the code for that app is in the Apps/CesiumViewer directory (Apps/HelloWorld.html works fine on mobile too).

Can you try these out and see if they have the same problem on your device?

3

It happens the same. I am on a BlackBerry10 though. I guess you tested it on Android or iOS right?

4

Yes, unfortunately I don’t have a BlackBerry device to test. That being said, I still think this is a CSS issue or possibly a bug in the BB browser itself.

Can you try this Leaflet example and see if it does the same thing: http://leafletjs.com/examples/mobile-example.html

If that link has the problem; that doesn’t bode well for the BB browser. If the link works, then you could probably use it to figure out what’s the difference between the CSS in that demo and your app.

5

Hi Matthew, thank you very much for answering.
the Leaflet link works fine on the BB10 browser, rotation does not affect at all. Perhaps it is a CSS problem as you pointed out.

I will work on it.

Additionally, I would like to ask you if it is implemented any method to force the CesiumWidget to being redraw. It happens when resuming the app after a pause, the globe disapears, no tiles at all rendered, just a black screen.

6

CesiumWidget has both render() and resize() functions; but these are called automatically for you as part of the default render loop (which I assume you are using since you haven’t explicitly disabled it).

7

Regarding on resume issue, none of those seems to work for this particular purpose, if I find any solution I get you back just in case it may help some other.

Regarding rotation, In the end I have decided to avoid rotation. It is a pitty I dont have more time to fix it.

Thank you again.