Three js move camera

Questions
1

hello friends
I am new to three js and I have a question about collision detection.
I have a scene with perspective camera and I put 20 objects like the spheres, the cubes and the pyramids in this 3D scene. I have made the AWSD for moving my camera through this scene and it works (using event and keycodes). now I want to restrict my camera. it means I want it to not pass through the objects. so I started to use raycaster for finding the collisions but it doesn’t work perfectly for all directions.
any comment can be a great help
thanks

2

If you show us your detection and collision avoiding code we will be able to help you :wink:

3

Instead of using a ray, you might have more success by performing a simple sphere/sphere intersection test via Sphere.intersectsSphere. After defining a bounding sphere for your camera, you can test for an intersections with the bounding volumes of all other objects in your scene. Ensure to perform the intersection test in world space. To transform the bounding sphere of an object into world space, do this:

const sphere = new THREE.Sphere();
sphere.copy( geometry.boundingSphere).applyMatrix4( object.matrixWorld );

if ( boundingSphereCamera.intersectsSphere( sphere ) ) {

    // handle intersection

}

When creating your objects, call object.geometry.computeBoundingSphere() once for each instance in order to prepare the bounding spheres for the upcoming intersection tests.

4

thank you for your attention to my question
i have some other difficulties and questions and it would be very nice of you if you can help me:

1- for simplifying the things for myself, i created a box around all of objects with this command
let boundingBox = new THREE.Box3().fromObject( object );
and after that i tried to detect the collision using:
let collision = boundingBox.containsPoint( camera.position );
do you think it is a good practice or it is recommended to use Sphere.intersectsSphere?? (because i dont know how can i define a bounding sphere for my camera)

2- i cant understand what this part will do for me
sphere.copy( geometry.boundingSphere).applyMatrix4( object.matrixWorld );

3- i tried to create all of the objects at first and push them in an array. afterwards define bounding box3/sphere for all of them by passing them in a loop. but it doesnt work for me. is it impossible or i made a mistake??

thank you

5

Using .containsPoint() is fine however it’s good if you have some space between the camera and the objects in your scene. Using a bounding sphere will allow you to adjust this space with Sphere.radius.

You create an instance of Sphere, assign a radius and the initial center point to it. Each simulation step, you apply the world matrix of the camera to the sphere via Sphere.applyMatrix4().

If an object has a geometry, you can compute the bounding sphere in local space via BufferGeometry.computeBoundingSphere(). When you now apply the current world matrix of the object to the sphere, you can use it for your intersection test. The code copies the sphere so it does not overwrite the bounding sphere in local space.

What do you mean with it does no work. Do you get runtime errors? I think it’s best when you share your current state of work as a live example.