2

I was looking on Three.js API and I found that the Frustum is used for the camera visible area. I was wondering if I can access the view frustum of my PerspectiveCamera and declare the frustum as an object. Basically, my goal is to color the frustum of the camera.

Image

Loizos Vasileiou
  • 674
  • 10
  • 37

1 Answers1

1

If you want to visualize the frustum of your camera, you can use a THREE.CameraHelper. It essentially does what you're describing in the question: it lets you color the frustum so you can visualize it.

To implement it, you simply need to initiate it with your camera as a parameter, then add it to the scene:

var camera = new THREE.PerspectiveCamera( 75, camRatio, 0.1, 1000 );
var helper = new THREE.CameraHelper( camera );
scene.add( helper );

You can read more about it in the docs and you can see it in action on the right side of this example

Update:

If you want to read the data used to build the helper, you can access its .pointmap property. It's got lots of points that determine the position of the near plane (n1, n2, n3...), far plane (f1, f2, f3...), target, etc. To get better acquainted with what each key means, you can look at its constructor from line 38 to 83. The code is very well-documented in there.

Community
  • 1
  • 1
M -
  • 26,908
  • 11
  • 49
  • 81
  • As shown in the figure I already have it. the problem is that i dont know what the values of it (near plane positions, far plane positions, distance, ...etc) – Loizos Vasileiou Feb 20 '19 at 22:29
  • Ah, my mistake! Bad answer. I thought you were asking how to visualize the frustum as demonstrated in the screenshot. – M - Feb 20 '19 at 22:41
  • Great this works and returns pointmap will return `{n1: Array(4), n2: Array(4), n4: Array(4), n3: Array(4), f1: Array(3), …}`. However, can I return the geometry of that array or do I have to create it myself (e.g THREE.BoxGeometry)?? – Loizos Vasileiou Feb 21 '19 at 00:37
  • 1
    Yeah, you should be able to access its geometry with `helper.geometry`. You could also change its material with `helper.material = new THREE.MeshBasicMaterial()` or whatever else you want. – M - Feb 21 '19 at 00:46
  • Just created another question in more detail about this. Here is the [link](https://stackoverflow.com/questions/54808325/accessing-perspectivecamera-geometry-to-generate-rays-inside-its-buffergeometry) – Loizos Vasileiou Feb 21 '19 at 13:33
  • the answer does not show code that returns the frustrum of the camera, it just shows how to add the camera helper – John Miller Sep 04 '22 at 19:15