danwild
danwild

Reputation: 2046

How to zoom/move camera to display a polygon in Cesium.js (fit viewport to polygon bounds)

Ok, maybe I'm blind because clearly this is not advanced functionality.. but I'm looking at the Camera docs for Cesium.js, and I can't seem to find how you simply zoom/move the view to show a polygon?

I can position the camera to show the poly using the mean lat/lon values, like:

viewer.camera.setView({
    position : Cesium.Cartesian3.fromDegrees(lonMean, latMean, 45000.0)
});

But that's rubbish; I don't get the zoom...I want the zoom/viewport to be adjusted to fit the polygon.

Can anybody point out what I must be overlooking...

Upvotes: 2

Views: 4528

Answers (2)

Matthew Amato
Matthew Amato

Reputation: 2022

Assuming you have a polygon defined in the Entity API, then you can simply call viewer.zoomTo(entity) or viewer.flyTo(entity). This works with any type of entity visualization, not just polygons, and is discussed in Cesium's Creating Entities tutorial.

Upvotes: 3

emackey
emackey

Reputation: 12418

Take a look at the Sandcastle Camera Demo. Pull-down the "Camera options" drop box, and select either "Fly to Rectangle" or "View a rectangle." The camera will fly or snap to the rectangle, and the code editor shows how this is done. Take a look through the other Sandcastle demos too, they contain lots of sample code for common actions in Cesium.

Here's the FlyTo code:

var west = -90.0;
var south = 38.0;
var east = -87.0;
var north = 40.0;
var rectangle = Cesium.Rectangle.fromDegrees(west, south, east, north);

viewer.camera.flyTo({
    destination : rectangle
});

Upvotes: 2

Related Questions