Splash screen for pointer lock controls

Shange · April 22, 2021, 3:00pm

I’m trying to recreate the Pointer Lock Controls from three.js examples but having trouble getting the controls to work, I have added a splash screen but the controls still aren’t working, see my code here: Glitch :･ﾟ✧ any help would be appreciated

Mugen87 · April 22, 2021, 8:20pm

Your code was a bit incomplete since the actual update in the animation loop was missing. Try it with the below code.

Updated demo: https://paper-steep-winter.glitch.me/

Since the link to glitch will expire at some point, I’m referring to the following code section which was missing in your app:

github.com

mrdoob/three.js/blob/e48fc94dfeaecfcbfa977ba67549e6108b370cbf/examples/misc_controls_pointerlock.html#L289-L337


				const time = performance.now();


				if ( controls.isLocked === true ) {


					raycaster.ray.origin.copy( controls.getObject().position );
					raycaster.ray.origin.y -= 10;


					const intersections = raycaster.intersectObjects( objects );


					const onObject = intersections.length > 0;


					const delta = ( time - prevTime ) / 1000;


					velocity.x -= velocity.x * 10.0 * delta;
					velocity.z -= velocity.z * 10.0 * delta;


					velocity.y -= 9.8 * 100.0 * delta; // 100.0 = mass


					direction.z = Number( moveForward ) - Number( moveBackward );
					direction.x = Number( moveRight ) - Number( moveLeft );

This file has been truncated. show original

Shange · April 22, 2021, 9:26pm

Thanks but for some reason I am able to jump through the boxes, see my code here: Glitch :･ﾟ✧ why is this?

Mugen87 · April 23, 2021, 7:57am

Similar to the official example, a full collision detection is not implemented. You can only jump on boxes.

Shange · April 25, 2021, 12:35pm

how would I implement a full collision detection?

Mugen87 · April 25, 2021, 3:32pm

Sorry, I can’t provide an answer on such a broad topic. I suggest you study existing topics and read related literature.

Shange · April 25, 2021, 7:05pm

Ok Thanks for your help

Topic		Replies	Views
How would I add collision to this? Questions pointerlockcontrols	0	633	March 19, 2021
Problem in preventing pointer lock controls from moving through meshes in React.js Questions collision-detection	5	1927	July 15, 2020
No errors and not showing anything on screen Questions getting-started	3	1495	September 18, 2020
PointerLockControls Bug? pls help Questions	1	258	September 6, 2020
How to do hit detection of mouse in Three.js using PointerLockControls? Questions camera-controls , pointer-controls	10	2457	February 28, 2018

Splash screen for pointer lock controls

Related Topics