# Look at position from another position

**URL:** https://community.cesium.com/t/look-at-position-from-another-position/2565
**Category:** CesiumJS
**Created:** [May 28, 2015, 12:53pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565 "2015-05-28T12:53:24Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [May 28, 2015, 12:53pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/1 "2015-05-28T12:53:24Z")

</div>

Hey,

i have a question about the camera, because i cant find any solution 😕

I have two Cartesian3 positions, one for the eye/camera and one for the object i want to look at.

But i cant find any function to set the camera, lookAt(eye, target, up) did not work and is deprecated.

Can anyone tell me how to do this ? 😕

Thanks

---

<div class="post-metadata">

### Author: ![Willem](https://avatars.discourse-cdn.com/v4/letter/w/898d66/32.png) [@Willem](https://community.cesium.com/u/Willem)
#### Post date: [May 29, 2015, 7:30am UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/2 "2015-05-29T07:30:55Z")

</div>

Method lookAt(target, offset) supports a Cartesian3 for the offset, I would expect that is what you need (i.e. target is the object you want to look at, offset is the camera/eye position).  
See [https://cesiumjs.org/Cesium/Build/Documentation/Camera.html](https://cesiumjs.org/Cesium/Build/Documentation/Camera.html)

Regards, Willem

---

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [May 29, 2015, 12:06pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/3 "2015-05-29T12:06:45Z")

</div>

I tried this, but it isent working. The camera is up in space and looks on the target.

I think this is because the offset is relative to the target.

---

<div class="post-metadata">

### Author: ![Willem](https://avatars.discourse-cdn.com/v4/letter/w/898d66/32.png) [@Willem](https://community.cesium.com/u/Willem)
#### Post date: [May 29, 2015, 2:28pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/4 "2015-05-29T14:28:28Z")

</div>

In that case you could use Cartesian3.subtract() to get the relative offset. See [https://cesiumjs.org/Cesium/Build/Documentation/Cartesian3.html](https://cesiumjs.org/Cesium/Build/Documentation/Cartesian3.html) .

---

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [May 29, 2015, 3:26pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/5 "2015-05-29T15:26:24Z")

</div>

mhm sounds good, i will try it next week 🙂

thanks

---

<div class="post-metadata">

### Author: ![Robert](https://avatars.discourse-cdn.com/v4/letter/r/e95f7d/32.png) [@Robert](https://community.cesium.com/u/Robert)
#### Post date: [May 30, 2015, 9:18pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/6 "2015-05-30T21:18:07Z")

</div>

I’m trying to do the same thing but can’t seem to get this to work. Can someone post an example?

Thanks!

Previous Cesium Code:  
var eye = …//A Cartesian3 position  
var target = …//A Cartesian3 position  
var normalizedEye = Cesium.Cartesian3.clone(eye);  
Cesium.Cartesian3.normalize(eye,normalizedEye);  
this.cesiumWidget.scene.camera.lookAt(eye, target, normalizedEye);

---

<div class="post-metadata">

### Author: ![Robert](https://avatars.discourse-cdn.com/v4/letter/r/e95f7d/32.png) [@Robert](https://community.cesium.com/u/Robert)
#### Post date: [May 31, 2015, 1:49am UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/7 "2015-05-31T01:49:27Z")

</div>

I ended up making my own lookAt function that was based on the previous Cesium function using the following code:

//This is code from the previous lookAt function of Cesium v1.5  
this.cesiumWidget.scene.camera.position = Cesium.Cartesian3.clone(eye, this.cesiumWidget.scene.camera.position);  
this.cesiumWidget.scene.camera.direction = Cesium.Cartesian3.normalize(Cesium.Cartesian3.subtract(target, eye, this.cesiumWidget.scene.camera.direction), this.cesiumWidget.scene.camera.direction);  
this.cesiumWidget.scene.camera.right = Cesium.Cartesian3.normalize(Cesium.Cartesian3.cross(this.cesiumWidget.scene.camera.direction, up, this.cesiumWidget.scene.camera.right), this.cesiumWidget.scene.camera.right); this.cesiumWidget.scene.camera.up = Cesium.Cartesian3.cross(this.cesiumWidget.scene.camera.right, this.cesiumWidget.scene.camera.direction, this.cesiumWidget.scene.camera.up);

---

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [June 1, 2015, 10:37am UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/8 "2015-06-01T10:37:31Z")

</div>

Both solutions don't realy work for me 😕

If i use Cartesian3.subtract(), the Camera follows my object and don't stay on the eye position.

Also i tried this one:

var direction = new Cesium.Cartesian3((target.x - eye.x), (target.y - eye.y), (target.z - eye.z));  
viewer.camera.position = eye;  
viewer.camera.direction = direction;  
viewer.camera.up = Cesium.Cartesian3.clone(Cesium.Cartesian3.UNIT\_Z);

but here is the problem, that the camera rolls to the left and to the right if the object flies over.

settingt the viewer.camera.roll = 0.0; does not help.

---

<div class="post-metadata">

### Author: ![Willem](https://avatars.discourse-cdn.com/v4/letter/w/898d66/32.png) [@Willem](https://community.cesium.com/u/Willem)
#### Post date: [June 1, 2015, 7:11pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/9 "2015-06-01T19:11:57Z")

</div>

You could try adding lookAtTransform(Cesium.Matrix4.IDENTITY) after the lookAt() call. This is also done in the Terrain Sandcastle ([http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Terrain.html&label=Showcases](http://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=Terrain.html&label=Showcases)).  
Search this forum for “lookAtTransform(Cesium.Matrix4.IDENTITY)” for background, I don’t understand it fully, but it has effect!

---

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [June 1, 2015, 7:44pm UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/10 "2015-06-01T19:44:38Z")

</div>

I think i already tried this, but i will check tomorrow.

But i guess my UP vector is wrong (i tried UNIT\_Z and UNIT\_Y) because if the target is above the eye it looks good, but if the target is on the left or right side it looks like the camera rolls only to the left and right from the position where it looks to the sky.

I hope you understand what i mean, english is not my nativ language 🙂  
I can send some screenshots tomorrow if i found the function to add them here.

Here is an short example for the situation:  
[http://www.directupload.net/file/d/4005/b5g7n6ia\_png.htm](http://www.directupload.net/file/d/4005/b5g7n6ia_png.htm)

All i want to do is to follow the target from the eye position on the ground.  
(I'm updating the camera ervery frame)

Thanks 🙂

---

<div class="post-metadata">

### Author: ![peter.upsel](https://avatars.discourse-cdn.com/v4/letter/p/c6cbf5/32.png) [@peter.upsel](https://community.cesium.com/u/peter.upsel)
#### Post date: [June 2, 2015, 9:11am UTC](https://community.cesium.com/t/look-at-position-from-another-position/2565/11 "2015-06-02T09:11:04Z")

</div>

Finally i got it working...

If anyone have the same problem or some ideas to improve the code, here it is:

var sPosition = Cesium.Cartesian3.fromDegrees(station[1], station[0], station[2]);  
var pPosition = viewer.dataSources.get(0).entities.getById("CesiumPlane").position.getValue(time);  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
var target = Cesium.Ellipsoid.WGS84.cartesianToCartographic(pPosition);  
target.latitude = target.latitude \* (180 / Math.PI);  
target.longitude = target.longitude \* (180 / Math.PI);

var eye = Cesium.Ellipsoid.WGS84.cartesianToCartographic(Cesium.Cartesian3.fromDegrees(station[1], station[0], station[2]));  
eye.latitude = eye.latitude \* (180 / Math.PI);  
eye.longitude = eye.longitude \* (180 / Math.PI);

var bearing = bearingDegrees(target.latitude, target.longitude, eye.latitude, eye.longitude);  
bearing = (bearing-180) \* (Math.PI / 180);  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;  
var distance = Cesium.Cartesian3.distance(sPosition, pPosition);  
var diff = target.height - eye.height;  
var tilt = Math.atan(diff / distance);

var camera = viewer.camera;  
camera.setView({  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;position: Cesium.Cartesian3.fromDegrees(station[1], station[0], station[2]),  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;heading: bearing,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;pitch: tilt,  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;roll: 0.0  
});  
viewer.camera.lookAtTransform(Cesium.Matrix4.IDENTITY);

function bearingDegrees(lat1, long1, lat2, long2) {  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var degToRad = Math.PI / 180.0;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var phi1 = lat1 \* degToRad;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var phi2 = lat2 \* degToRad;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var lam1 = long1 \* degToRad;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var lam2 = long2 \* degToRad;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return Math.atan2(Math.sin(lam2 - lam1) \* Math.cos(phi2),  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Math.cos(phi1) \* Math.sin(phi2) - Math.sin(phi1) \* Math.cos(phi2) \* Math.cos(lam2 - lam1)  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;) \* 180 / Math.PI;  
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}
