Trouble using the transform matrices

CesiumJS
1

Hi,

I'm having trouble trying to anchor an entity relatively to the camera position, 10 meters to the right side of the camera.

I can get the camera position with viewer.scene.camera.position on the global axes. Which transform matrix and operator should I use to apply a translation of +10 along a local camera axis?

Thanks a lot for your help, I'm still confused with all these possibilities!

Cesium 1.54 on Chrome 72

2

I think the easiest way to do this is to take the camera’s position in world coordinates, and offset that by the camera forward/up/right direction, so the Entity’s position would be a dynamic property like this:

var scratchCartesian3 = new Cesium.Cartesian3();

position : new Cesium.CallbackProperty(function(){
var forwardOffset = Cesium.Cartesian3.multiplyByScalar(viewer.camera.direction, 100, scratchCartesian3);
Cesium.Cartesian3.add(forwardOffset, viewer.camera.positionWC, scratchCartesian3);
return scratchCartesian3;
}, false)

``

Here’s a Sandcastle of that. You can then offset it by the camera.right and camera.up vectors as well.

It looks kind of cool when typing in an address to fly to with the plane model in front of the camera like that! Are you trying to create some kind of HUD display with this?

3

Great, nice implementation!

If I would like to create some kind of HUD display, I would have made it outside of the Cesium framework, directly interacting with an HTML canvas.

I’m rather trying to add a skin for a FPV from a space ship :wink:

Thanks again for your helpful feedback.

Dorian.