Resize of CesiumWidget

[Scott Haynes]

When I load my web app with the CesiumWidget, or occasionally one of the cesium sandtable apps, the widget isn't rendering correct.  It looks like the height and width are wrong(too small), so the pixels are stretched out and the aspect ratio is wrong.  A resize of the browser fixes the issue.  Is this a known issue, or is there a work around?  I've tried adding an eventListener for resize and/or setting the aspect ratio on creation. 

[Scott Hunter]

I've seen that issue as well, most often on Firefox, but sometimes in Chrome.  I think the issue is that the CesiumWidget is constructed before the DOM is completely laid out, so the browser gives us the wrong size from clientWidth/clientHeight is incorrect, and we never get a resize event, since the window size hasn't changed.

I had a similar issue in the 2012 NORAD Tracks Santa app, which I worked around by basically forcing a resize periodically during the render loop after some number of frames, milliseconds, I forget which.  The reason we don't resize on every frame is that accessing clientWidth/clientHeight forces a layout, lowering performance.

At the least, we should make the resize method public to allow client code to call it after changing the DOM.

Scott

On Thu, Jun 13, 2013 at 4:06 PM, Scott Haynes <scottn...@gmail.com> wrote:

When I load my web app with the CesiumWidget, or occasionally one of the cesium sandtable apps, the widget isn't rendering correct.  It looks like the height and width are wrong(too small), so the pixels are stretched out and the aspect ratio is wrong.  A resize of the browser fixes the issue.  Is this a known issue, or is there a work around?  I've tried adding an eventListener for resize and/or setting the aspect ratio on creation. 

--
You received this message because you are subscribed to the Google Groups "cesium-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cesium-dev+...@googlegroups.com.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

[Matthew Amato]

I believe the resize method is public, but I think having a periodic resize built into the render loop sounds like a good idea.  I can make the change if you agree, Scott.

[Scott Hunter]

I came across this technique for detecting element resize (which is what we really want instead of window resize):

http://www.backalleycoder.com/2013/03/18/cross-browser-event-based-element-resize-detection/

Like most things in a web browser, it's a ludicrous hack, but it seems like it might work.

[Matthew Amato]

I just opened #870 to address the resize issue.  I took a simpler approach for now, rather than the hack Scott linked to.  If we are unhappy with the results, we can implement the hack.

[Scott Haynes]

I'm still having some problems with initialization of the CesiumWidget(resizing issue), but check out the following cesium-vwf demos.  Once you've joined in one browser instance, copy the full url to another tab or window.  

http://development.virtualworldframework.com/agi/cesium

and 

http://development.virtualworldframework.com/cesium-webrtc

Thanks to all here who helped me out over the last couple of weeks, 

Scott

[Matthew Amato]

I've opened pull request #870 to address sizing issues with our widgets.  This will be part of the next release (July 1st).  In the mean time, one thing you can try doing is setting a timeout event that forces a resize of the widget once a second.