Entity viewFrom property example


Can somebody provide an example of what the expected format of setting the viewFrom property of an entity is?

I would like to set the default view to be directly above the entity (like a 2D view), a specified distance above, and a specified rotation.

I'm not sure what the format of setting the property is supposed to be, and I have been unable to find any examples.

Thank you!

lookAt function should work, can read about it here http://cesiumjs.org/Cesium/Build/Documentation/Camera.html

Thanks Hyper, but I think I am really looking for the viewFrom property, not the lookAt function. I want to set the default camera location in relation to the entity, at the time of creating the entity. When the trackedEntity property is set, I want the camera to default to this camera position for this specific entity.

I tried this, but it did not change the camera position at all.

entity.viewFrom = new Cesium.HeadingPitchRange(heading, Cesium.Math.toRadians(-90), 1000.0);

OK, I didn’t know that it was a entity property. Briefly looking through the source I see it here and there, but I don’t see where it’s used to set the camera position, though I didn’t do an exhaustive search.

Briefly looking at the code and the API documentation (‘A suggested initial offset for viewing this object.’), I think it expects a Cartesian3 that defines the offset (defined in the east-north-up reference frame).


Cool thing about looking at the code is that the reference doc is built into it, though it’s not nicely formatted. I was looking through these 2 files:


EntityView.prototype.update has this line
var viewFromProperty = entity.viewFrom;

then later this line

} else if (!defined(viewFromProperty) || !defined(viewFromProperty.getValue(time, offset3D))) {

Does viewFrom value somehow get handed off to offset3D ?

viewFrom hasn’t worked since the Entity API was refactored and the zoomTo and flyTo properties were introduced in the Viewer. I submitted an issue, which I’ll try and look at for 1.9: https://github.com/AnalyticalGraphicsInc/cesium/issues/2628

Flipping the order of the first 2 if/else statments starting at https://github.com/AnalyticalGraphicsInc/cesium/blob/master/Source/DataSources/EntityView.js#L299 so that the sphere is checked second and viewFrom first should get you back to the old behavior.

Thanks Matt, glad to hear it's in the works.

It seems like every new feature I try to use each day doesn't work. :\

Since the viewFrom property isn't working, I tried to alternatively use zoomTo in the interim. While zoomTo went to the correct position of the entity and the correct pitch and range, it did not rotate to the specified heading. Instead, it rotated to a heading of 0 no matter what I provided.

viewer.zoomTo(entity, new Cesium.HeadingPitchRange(heading, Cesium.Math.toRadians(-90), 1000.0));

I even tried explicitly setting the heading again immediately after zoomTo, but again it did not change the heading.

    heading: Cesium.Math.toRadians(90)

If I remove the zoomTo line, the setView does rotate to 90 degrees correctly. It seems like the zoomTo function is permanently breaking the heading for some reason.

What am I doing wrong?

viewer.camera.lookAt has heading, pitch, and range.

Unfortunately, it appears this too is broken (or I am doing something wrong). Both zoomTo and lookAt do not set the heading regardless of what heading you provide it. The heading will always be zero.

With lookAt, I am at least able to set the heading in a separate call to setView afterwards to correctly adjust the heading. With zoomTo, it seems to have a lasting effect and even other requests at changing the heading will not work afterwards.

FYI, I just opened a PR to fix viewFrom: https://github.com/AnalyticalGraphicsInc/cesium/pull/2648

Thanks Matthew!

Now that this bug has been fixed as of 1.9, can an example of this property being set to as D2P asked be provided. As I too am interested to see how this is done.
My attempts to do so have been met with the camera tracking from the side.

entity.viewFrom = new Cesium.Cartesian3(0.0, -Cesium.Math.PI_OVER_TWO, viewer.scene.camera.position.z);
viewer.trackedEntity = entity;


I suppose there’s something wrong with the way I’m attempting to do this.

viewFrom expects a Cartesian3 in East-North-Up coordinates, so for example the below code causes the camera to be placed 0 meters East, 750000 meters south, and 500000 up from the entity position.

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var redBox = viewer.entities.add({

position: Cesium.Cartesian3.fromDegrees(-107.0, 40.0, 300000.0),

box : {

dimensions : new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),

material : Cesium.Color.RED.withAlpha(0.5),

outline : true,

outlineColor : Cesium.Color.BLACK


viewFrom: new Cesium.Cartesian3(0, -750000, 500000)


viewer.trackedEntity = redBox;

This area of the code is due for an overhaul and we will probably switch to a heading/pitch/range style setting or something similar to what KML already does in favor the above, but that’s how it works for now.


How can I calculate the viewFrom (in ENU) if I have Cartesian3 values for the camera- and the entity-position?
Something like this (pseudo-code):
var entityPosition = entity.position.getValue(viewer.clock.currentTime, new Cesium.Cartesian3());

var delta = Cesium.Cartesian3.subtract(entityPosition, viewer.camera.positionWC, new Cesium.Cartesian3());

viewFrom = fixedToEastNorthUp(entityPosition, delta);

I have probably looked at the wrong places, I can only find eastNorthUpToXYZ() functions.

Thanks, Willem

As of 2019/05/06, I am implementing the code that Matthew Amato provided and it's working perfectly. Thanks a lot for your help, Matthew!