THREE.js check if object is in frustum

Question

i've been tinkering around with three.js and i have a canvas i'd like to use as kind of a GUI. for that i have to check if an object is in the camera frustum.

my current code:

camera.updateMatrix(); 
camera.updateMatrixWorld(); 
        
var frustum = new THREE.Frustum();
var projScreenMatrix = new THREE.Matrix4();
projScreenMatrix.multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse );
        
frustum.setFromProjectionMatrix( camera.projectionMatrix );
        
if(frustum.containsPoint( mesh.position )){
    //stuff happens...
};

frustum.containsPoint()keeps returning false. what am i doing wrong here?

A `Frustum` takes 6 `Plane`s as arguments, you're not providing anything. That's probably why it doesn't work. — Leeft, Jul 22 '14 at 07:10
An example of that is in this answer: http://stackoverflow.com/questions/10858599/how-to-determine-if-plane-is-in-three-js-camera-frustum — Leeft, Jul 22 '14 at 07:56

score 8 · Accepted Answer · edited Aug 09 '17 at 12:35

8

Your code is using

frustum.setFromMatrix( camera.projectionMatrix );

But that isn't the matrix you want. Instead use:

frustum.setFromMatrix( new THREE.Matrix4().multiplyMatrices( camera.projectionMatrix, camera.matrixWorldInverse ) );

as answered in How to determine if plane is in Three.js camera Frustum

edited Aug 09 '17 at 12:35

larsmoa

12,098
6
56
85

answered Jul 22 '14 at 09:16

Leeft

3,757
1
15
24

score 0 · Answer 2 · answered Mar 23 '21 at 17:03

Three.js is doing view frustum Culling internally and only rendering when in camera frustum. Assuming that your Boundig Volumes are calculated correct, you can track weather a renderable Object3D is inside the camera view frustum when Object3D.onBeforeRender callback is called in your current frame

THREE.js check if object is in frustum

2 Answers2

Linked