# Camera fly to rectangle on terrain **URL:** \ **Category:** CesiumJS\ **Created:** [July 4, 2017, 12:12pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748 "2017-07-04T12:12:48Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![jan.vybiral1](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jan.vybiral1](https://community.cesium.com/u/jan.vybiral1)\ **Post date:** [July 4, 2017, 12:12pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/1 "2017-07-04T12:12:48Z")
Hello, I'm having trouble with moving camera to show some rectangle. I have rectangle/polygon coordinates and would like to move camera so that it shows the entire rectangle on screen. Consider the following sandcastle example: var viewer = new Cesium.Viewer('cesiumContainer'); Sandcastle.addToolbarButton('Fly to', function(){     var rectangle = new Cesium.Rectangle(0.1485961502596944, 0.823228424579245, 0.1486927730733333, 0.8232981854516427);     viewer.camera.flyTo({         destination: rectangle     }); }); It works well on WGS84 ellipsoid (pressing the button zooms to target rectagle), but when I switch to STK World terrain mesh the camera crashes through the ground. Is there a way to display rectangle on terrain when I only know its coordinates and not height? ---
**Author:** ![Rachel\_Hwang](https://avatars.discourse-cdn.com/v4/letter/r/d78d45/32.png) [@Rachel\_Hwang](https://community.cesium.com/u/Rachel_Hwang)\ **Post date:** [July 5, 2017, 1:21am UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/2 "2017-07-05T01:21:25Z")
Hi there, Fortunately, Cesium has direct support for this! Take a look at this function: [http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates](http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates) getRecatngleCameraCoordinates will give the camera parameters necessary to view the desired rectangle. hope that helps, - Rachel ---
**Author:** ![jan.vybiral1](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jan.vybiral1](https://community.cesium.com/u/jan.vybiral1)\ **Post date:** [July 5, 2017, 2:09pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/3 "2017-07-05T14:09:08Z")
Dne středa 5. července 2017 3:21:25 UTC+2 Rachel Hwang napsal(a): > Hi there, > > Fortunately, Cesium has direct support for this! Take a look at this function: [http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates](http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates) > > getRecatngleCameraCoordinates will give the camera parameters necessary to view the desired rectangle. > > hope that helps, > - Rachel > > On Tuesday, July 4, 2017 at 8:12:48 AM UTC-4, jan.vy...@gmail.com wrote:Hello, > I'm having trouble with moving camera to show some rectangle. I have rectangle/polygon coordinates and would like to move camera so that it shows the entire rectangle on screen. Consider the following sandcastle example: > var viewer = new Cesium.Viewer('cesiumContainer'); > Sandcastle.addToolbarButton('Fly to', function(){ > var rectangle = new Cesium.Rectangle(0.1485961502596944, 0.823228424579245, 0.1486927730733333, 0.8232981854516427); > viewer.camera.flyTo({ > destination: rectangle > }); > }); > It works well on WGS84 ellipsoid (pressing the button zooms to target rectagle), but when I switch to STK World terrain mesh the camera crashes through the ground. > Is there a way to display rectangle on terrain when I only know its coordinates and not height? Hi, thanks for the reply, but it doesn't seem to work for me, maybe I'm using it wrong? If I try this piece of code in the sandcastle: var viewer = new Cesium.Viewer('cesiumContainer'); Sandcastle.addToolbarButton('Fly to', function(){     var rectangle = new Cesium.Rectangle(0.14864258869032076,                                          0.8232505706843248,                                          0.14865195136604184,                                          0.8232689020789328);     var target = viewer.camera.getRectangleCameraCoordinates(rectangle);     viewer.camera.flyTo({         destination: target     }); }); clicking 'Fly to' button works fine with WGS84 ellipsoid, if I switch on terrain the camera crashesh through the ground. It seems like the function ignores terrain and resulting camera position ends up being under it (if the rectangle is small enough). My problem is that I only have these four coordinates, I don't know what altitude the terrain around that rectangle is at. ---
**Author:** ![Rachel\_Hwang](https://avatars.discourse-cdn.com/v4/letter/r/d78d45/32.png) [@Rachel\_Hwang](https://community.cesium.com/u/Rachel_Hwang)\ **Post date:** [July 5, 2017, 8:24pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/4 "2017-07-05T20:24:48Z")
Hi there, What terrain provider are you using? Here’s a working example: [http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=31851ea4e2e77c8175d924d467a7e96e](http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=31851ea4e2e77c8175d924d467a7e96e) You can use sampleTerrainMostDetailed to get the terrain height at a given location, and you can use this to correct the camera position to prevent it from going under the terrain. Hope that helps, - Rachel ---
**Author:** ![jan.vybiral1](https://avatars.discourse-cdn.com/v4/letter/j/6a8cbe/32.png) [@jan.vybiral1](https://community.cesium.com/u/jan.vybiral1)\ **Post date:** [July 5, 2017, 10:51pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/5 "2017-07-05T22:51:24Z")
Dne středa 5. července 2017 22:24:48 UTC+2 Rachel Hwang napsal(a): > Hi there, > > What terrain provider are you using? Here's a working example: [http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=31851ea4e2e77c8175d924d467a7e96e](http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=31851ea4e2e77c8175d924d467a7e96e) > > You can use sampleTerrainMostDetailed to get the terrain height at a given location, and you can use this to correct the camera position to prevent it from going under the terrain. > > Hope that helps, > - Rachel > > On Wednesday, July 5, 2017 at 10:09:08 AM UTC-4, jan.vy...@gmail.com wrote:Dne středa 5. července 2017 3:21:25 UTC+2 Rachel Hwang napsal(a): > > \> Hi there, > > \> > > \> > > \> Fortunately, Cesium has direct support for this! Take a look at this function: [http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates](http://cesiumjs.org/Cesium/Build/Documentation/Camera.html?classFilter=camera#getRectangleCameraCoordinates) > > \> > > \> > > \> getRecatngleCameraCoordinates will give the camera parameters necessary to view the desired rectangle. > > \> > > \> > > \> hope that helps, > > \> - Rachel > > \> > > \> On Tuesday, July 4, 2017 at 8:12:48 AM UTC-4, jan.vy...@gmail.com wrote:Hello, > > \> I'm having trouble with moving camera to show some rectangle. I have rectangle/polygon coordinates and would like to move camera so that it shows the entire rectangle on screen. Consider the following sandcastle example: > > \> var viewer = new Cesium.Viewer('cesiumContainer'); > > \> Sandcastle.addToolbarButton('Fly to', function(){ > > \> var rectangle = new Cesium.Rectangle(0.1485961502596944, 0.823228424579245, 0.1486927730733333, 0.8232981854516427); > > \> viewer.camera.flyTo({ > > \> destination: rectangle > > \> }); > > \> }); > > \> It works well on WGS84 ellipsoid (pressing the button zooms to target rectagle), but when I switch to STK World terrain mesh the camera crashes through the ground. > > \> Is there a way to display rectangle on terrain when I only know its coordinates and not height? > > Hi, > > thanks for the reply, but it doesn't seem to work for me, maybe I'm using it wrong? If I try this piece of code in the sandcastle: > > var viewer = new Cesium.Viewer('cesiumContainer'); > > Sandcastle.addToolbarButton('Fly to', function(){ > > ``` > var rectangle = new Cesium\.Rectangle\(0\.14864258869032076, > > 0\.8232505706843248, > > 0\.14865195136604184, > > 0\.8232689020789328\); > > var target = viewer\.camera\.getRectangleCameraCoordinates\(rectangle\); > > viewer\.camera\.flyTo\(\{ > > destination: target > > \}\); > > ``` > > }); > > clicking 'Fly to' button works fine with WGS84 ellipsoid, if I switch on terrain the camera crashesh through the ground. > > It seems like the function ignores terrain and resulting camera position ends up being under it (if the rectangle is small enough). My problem is that I only have these four coordinates, I don't know what altitude the terrain around that rectangle is at. Thanks but unfortunately that example doesn't work for me - [Cesium zoom problem - Album on Imgur](https://imgur.com/a/prBp0) So if I understand that correctly Camera.flyTo with rectangle won't work with terrain, instead I shoud do: - query terrain provider for height of some point inside rectangle using sampleTerrainMostDetailed - get position to view that rectangle using getRectangleCameraCoordinates - move that poit up by height computed from sampleTerrainMostDetailed Is there some easy way to move point in ECEF by X meters UP (in a direction perpendicular to ellipsoid) or should I just convert it to local frame, move it up and then transform it back to fixed frame? ---
**Author:** ![Rachel\_Hwang](https://avatars.discourse-cdn.com/v4/letter/r/d78d45/32.png) [@Rachel\_Hwang](https://community.cesium.com/u/Rachel_Hwang)\ **Post date:** [July 6, 2017, 1:06pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/6 "2017-07-06T13:06:43Z")
Hi there, You can move the camera up relative to the ground like this: [http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=623217139324f5bc3b1a0e0fa345fdd4](http://cesiumjs.org/Cesium/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=623217139324f5bc3b1a0e0fa345fdd4) Hope that helps, - Rachel ---
**Author:** ![anneg](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/anneg/32/11217_2.png) [@anneg](https://community.cesium.com/u/anneg)\ **Post date:** [June 11, 2025, 12:47pm UTC](https://community.cesium.com/t/camera-fly-to-rectangle-on-terrain/5748/7 "2025-06-11T12:47:41Z")
I stumpled upon this today and this was very helpful! In case somebody else needs this: Here is the repaired sandcastle link Rachel posted: [Cesium Sandcastle](http://sandcastle.cesium.com/?src=Hello%20World.html&label=Showcases&gist=623217139324f5bc3b1a0e0fa345fdd4) [Here a Sandcastle](https://sandcastle.cesium.com/#c=lVNNj9owEP0rFheCipwY8gG7AVVF6qlSpV20veTidYZg1djInrCiaP97nYSg0PbQ9cHKvJl5M/MmFkY7JCcJb2DJimh4Ixtwsj7QlxYLxqI1N0YjlxrseEouhSYEwVoPPPTh286mO2sOP4xV5RUIJtNCv08eC13oZ65LwR0qoLwst8aoV26/1IhGB+Ov6kzQePpdrQVKD00upKlEyIlbYkEg15WC+y6fejhgNGFZxBibJTFbpkmaTK/p/3UiGi8WcRQlbJFm82XGFh9Kb6vP0lm2jFk8S9Plx4sn80W0nGezZJ4kaTZ5HAyP3FaAfvJuUdQJ0EAFP4Dl1HtuKmxaaGOMLaXmCC646dasoOcT3KKpLD/upfCsVy03A7TdYwN4F9dB10BPMUyne5DVHsmnFWGRP9eQW8cD7pZq3jI/8dJ/u+COSRldSaxLmN5XUBz/BXeFb2N1ylw12anz1gSXwQ5KcNhI4n+sh767zvveSt3co+kod3hWsO48n+XhaCyS2qqA0hDhcFSNqOFrLX4CUuFcUz4P+6S8lCciy1Ux+uPVFCMiFHfOe3a1Us/yFxSjdR76+Ls0Zbwwuvp+Aqv4uQnZs/W3DqSU5qE3/87C7iUNGH8D) with working world terrain, flying to the Mount Everest.