lookAt(..) up vector

CesiumJS
1

i am trying to set an initial view by using CameraController.lookAt(

i dont know how to set the up vector

i always end looking straight up into the sky

i have to poins in lat lon

var eyeposition = new Cesium.Cartographic(Cesium.Math.toRadians(-6.7954), Cesium.Math.toRadians(62.0247), 10000);

var eye = Cesium.Ellipsoid.WGS84.cartographicToCartesian(eyeposition);

var targetPos = new Cesium.Cartographic(Cesium.Math.toRadians(-6.7652), Cesium.Math.toRadians(62.1907), 100);

var target = eye.add(Cesium.Ellipsoid.WGS84.cartographicToCartesian(targetPos));

scene.getCamera().controller.lookAt(eye, target,vec);

how do i set the up vector or calculate it

2

I don’t know what up vector exactly means because two points of eye and target could already give the direction of look. I had the similar problem as yours but found that Cesium.Cartesian3.UNIT_Z can be set as up vector to orient the camera’s direction at the right angle relative to Earth’s surface.

var ellipsoid = cesiumWidget.centralBody.getEllipsoid();

var cameraCartographic = new Cesium.Cartographic.fromDegrees(longitude, latitude, elevation);

var cameraCartesian = ellipsoid.cartographicToCartesian(cameraCartographic);

var targetCartographic = new Cesium.Cartographic.fromDegrees(longitude, latitude, 0.0);

var targetCartesian = ellipsoid.cartographicToCartesian(targetCartographic);

var scene = cesiumWidget.scene;

var camera = scene.getCamera();

camera.controller.lookAt(cameraCartesian, targetCartesian, Cesium.Cartesian3.UNIT_Z);
3

I found a good explanation of what the up vector is in OpenGL:

“Look at anything. Now tilt your head 90 degrees. Where you are hasn’t changed, the direction you’re looking at hasn’t changed, but the image in your retina clearly has. What’s the difference? Where the top of your head is pointing to. That’s the up vector.”

The important thing is that up vector cannot affect the direction of look determined by eye and target vectors. It affects only the angle of camera’s rotation about the axis of look direction.

4

thanks that worked for me

5

When I use similar code using the HelloWorld SandCastle it sends near africa when it should show me the united states.

here is my code:
var viewer = new Cesium.Viewer(‘cesiumContainer’);

var scene = viewer.scene

var transitioner = new Cesium.SceneTransitioner(scene);

transitioner.morphToColumbusView(1);

//change to bingmap

var imageryLayers = viewer.scene.imageryLayers;

imageryLayers.remove(imageryLayers[0]);

imageryLayers.addImageryProvider(new Cesium.BingMapsImageryProvider({

url: ‘//dev.virtualearth.net’,

mapStyle: Cesium.BingMapsStyle.ROAD

}));

Sandcastle.addDefaultToolbarButton(‘test’, function() {

var ellipsoid = Cesium.Ellipsoid.WGS84;

var cameraCartographic = new Cesium.Cartographic.fromDegrees(-111, 41, 6000);

var cameraCartesian = ellipsoid.cartographicToCartesian(cameraCartographic);

var targetCartographic = new Cesium.Cartographic.fromDegrees(-111, 41, 0.0);

var targetCartesian = ellipsoid.cartographicToCartesian(targetCartographic);

var camera = scene.camera;

camera.lookAt(cameraCartesian, targetCartesian, Cesium.Cartesian3.UNIT_Z);

});

``

any ideas why?
btw this is all of the code in the whole project, to test just copy paste into https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html java code area.
Could it be because I am in columbus view?

6

I cleaned up my code a bit and attempted it using the tranform to fixed frame method, now it goes to the coordinates I give it but my left mouse click now does the tilt, and I cant move to a different location (probably what fixed frame means…) any ideas how to fix that?

var viewer = new Cesium.Viewer(‘cesiumContainer’, {

sceneMode: Cesium.SceneMode.COLUMBUS_VIEW,

//Hide the base layer picker

baseLayerPicker : false,

//Use BingMaps

imageryProvider : new Cesium.BingMapsImageryProvider({

url: ‘//dev.virtualearth.net’,

mapStyle: Cesium.BingMapsStyle.ROAD

})

});

var scene = viewer.scene;

Sandcastle.addDefaultToolbarButton(‘test’, function() {

var center = Cesium.Cartesian3.fromDegrees(-111, 41);

var transform = Cesium.Transforms.eastNorthUpToFixedFrame(center);

// View in east-north-up frame

var camera = scene.camera;

Cesium.Matrix4.clone(transform, camera.transform);

camera.constrainedAxis = Cesium.Cartesian3.UNIT_Z;

// Zoom in

camera.lookAt(

new Cesium.Cartesian3(-120000.0, -120000.0, 120000.0),

Cesium.Cartesian3.ZERO,

Cesium.Cartesian3.UNIT_Z);

});

``

7

well I never achieved getting the lookAt function to work but the fly to worked
viewer.scene.camera.flyTo({

destination: Cesium.Cartesian3.fromDegrees(longitude-.006, latitude-.015, height),

up: new Cesium.Cartesian3(0.0, 0.0, 1),

direction: new Cesium.Cartesian3(0.3, 0.5, -.5)

});

``

8

I submitted an issue here: https://github.com/AnalyticalGraphicsInc/cesium/issues/2031 We definitely have plans to make the camera more consistent/easier to use; but unfortunately it wasn’t ready in time for 1.0. Hopefully in the next release or two.

9

Thanks for your work, Cesium is amazing.