How to translate perspective position into orthographic camera?

Hey everyone,
Was hoping somebody could shed some light with this problem I have.

I have 2 cameras 1 is perspective and the 2nd one is orthographic

The reason for this is to have 3d objects as menus (irregular shapes etc) which cannot be handled in a 2D screen, because it does not ignore transparency when clicking (clicking on transparent area fire the click event).

I have a right click menu I want to position on top of an object in the perspective camera.

I have used this code in the past and it works:

this.mainCamera.worldToScreen(entityPosition, screenPos);
const pixelRatio =;
screenPos.x *= pixelRatio;
screenPos.y *= pixelRatio;
const screenEntity =‘UI’) as pc.Entity;
const scale = screenEntity.screen.scale;
const device =;
this.uiRightClickMenu.setLocalPosition(screenPos.x / scale, (device.height - screenPos.y) / scale, -10);

How do I translate the position relative to the perspective camera into the orthographic camera?
in order to position my 3d/orthographically rendered objects in the correct position beside the object I clicked in my perspective camera?

if anybody is interested this is how I did it:

const mainCameraFinalPosition = new pc.Vec3();
this.mainCamera.worldToScreen(this.TargetPosition, mainCameraFinalPosition);

const finalPosition = new pc.Vec3();

this.uiCamera.screenToWorld(mainCameraFinalPosition.x, mainCameraFinalPosition.y, -10, finalPosition);

finalPosition.z = -10;


1 Like