Detect if target is behind the camera - bis

Questions
1

Hello,

I made another post earlier, but I didn’t explain myself clearly and it got messy, so I’ll make another one.

The goal is to have an indicator on the UI of the positions of some objects, even when out of screen. Exactly as in the objectives direction indicator in FPS games.

So, what I want to do, in it’s simplest form:
I have a cube moving around, and I want to have a marker on screen indicating it’s position to the user.
When the cube is within the frustum of the camera, the marker should overlap the cube.
When the cube is not within the frustum, the marker should be in the edge of the screen, indicating where the camera should turn to see the cube.

Here is a JSFiddle showing where I am at now:
http://jsfiddle.net/Horsetopus/67q690fg/

The top view on the output shows you the scene from afar, to understand what’s going on.
The cube rotates around the camera.
The white pane is set at the camera position, orthogonal to where it’s looking at. It’s just a visual aid to know when the cube is in front or behind the camera.

The bottom view shows the result, where I expect to see the marker on top of the cube.
As you can see right now it works as long as the cube is in front of the white pane.
But when the cube is behind, everything is inverted.

This problem is expected, and I just need to invert the coordinates. My problem is knowing when to invert the coordinates, therefore knowing when the cube is behind the camera.

In this exemple of doing the same in Unity:


The developer uses the z values of the position projected by the camera. It’s positive when the position is in front, negative when behind. Great.

This doesn’t work with THREE.js. The z value, witch I display at the top of the output in the JSFiddle seems to have a logic of it’s own. Goes shortly under 0 when close to the pane, jumps to over 1 when behind the pane… And it’s not even the same values in my real project.

So if I cannot use this z value, what can I use to know when the cube is behind the camera?

Thanks.

2

Re horsetopus,

To detect if an object is above or below another one in 3D (or behind the camera by rotating the plane for that purpose), you will need an imaginary plane that is as wide as your scene world. Then you can use the following distance to plane equation and determine if the distance is negative (object is below) or positive (object is above):

distance_to_a_plane = point.sub(plane_point).dot(plane_normal);

Here is a post with a JSfiddle that explains it all: https://goo.gl/dj9naA

Hope this is what you were looking for!

3

Hi and thank you for the link, but I found a simplier sotlution:

I kept workinkg on this and reach this solution:

var targetPosition = new THREE.Vector3();
targetPosition = targetPosition.setFromMatrixPosition( cube.matrixWorld );

var lookAt = testCamera.getWorldDirection();
var cameraPos = new THREE.Vector3().setFromMatrixPosition( testCamera.matrixWorld );
var pos = targetPosition.sub( cameraPos );

behind = ( pos.angleTo( lookAt ) ) > ( Math.PI / 2 );

I am sure I tried that before, but failed… not sure why but at least now I get what I want.
I updated the sample and I hope it will be usefull to someone.
http://jsfiddle.net/Horsetopus/67q690fg/

Anyway thank you INF1N1T, for your time.

2 Likes