You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
1.When initialized, it cannot be moved when the moving object is larger than other objects.
2.When a moving object jumps, it can overlap with other objects.
<script type="module">
import * as THREE from 'three';
import * as MW from '../dist/meshwalk.module.js';
// See demo/2_keyboardInput.html first
const world = new MW.World();
const octree = new MW.Octree();
world.add( octree );
const width = window.innerWidth;
const height = window.innerHeight;
const clock = new THREE.Clock();
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 40, width / height, 1, 1000 );
camera.position.set( 0, 0, 8 );
const renderer = new THREE.WebGLRenderer();
renderer.setSize( width, height );
document.body.appendChild( renderer.domElement );
const ground = new THREE.Mesh(
new THREE.PlaneGeometry( 30, 30, 10, 10 ),
new THREE.MeshBasicMaterial( { color: 0xffffff, wireframe: true } )
);
ground.rotation.x = - 90 * THREE.MathUtils.DEG2RAD;
scene.add( ground );
octree.addGraphNode( ground );
const wall = new THREE.Mesh(
new THREE.BoxGeometry( .5, .5, .5 ),
new THREE.MeshNormalMaterial( { wireframe: true } )
);
wall.position.set( 0, .5, 0 );
scene.add( wall );
octree.addGraphNode( wall );
const playerRadius = .75;
const playerObjectHolder = new THREE.Object3D();
scene.add( playerObjectHolder );
const sphere = new THREE.Mesh(
new THREE.SphereGeometry( playerRadius, 16, 16 ),
new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true} )
);
sphere.position.y = playerRadius;
playerObjectHolder.add( sphere );
const playerController = new MW.CharacterController( playerObjectHolder, playerRadius );
playerController.teleport( 0, 10, 0 );
world.add( playerController );
const keyInputControl = new MW.KeyInputControl();
const tpsCameraControls = new MW.TPSCameraControls(
camera, // three.js camera
playerObjectHolder, // tracking object
world,
renderer.domElement
);
// bind events
keyInputControl.addEventListener( 'movekeyon', () => playerController.isRunning = true );
keyInputControl.addEventListener( 'movekeyoff', () => playerController.isRunning = false );
keyInputControl.addEventListener( 'jumpkeypress', () => playerController.jump() );
// synk with keybord input and camera control input
keyInputControl.addEventListener( 'movekeychange', () => {
const cameraFrontAngle = tpsCameraControls.frontAngle;
const characterFrontAngle = keyInputControl.frontAngle;
playerController.direction = cameraFrontAngle + characterFrontAngle;
} );
// the 'updated' event is fired by `tpsCameraControls.update()`
tpsCameraControls.addEventListener( 'update', () => {
if ( ! playerController.isRunning ) return;
const cameraFrontAngle = tpsCameraControls.frontAngle;
const characterFrontAngle = keyInputControl.frontAngle;
playerController.direction = cameraFrontAngle + characterFrontAngle;
} );
( function update () {
const delta = clock.getDelta();
requestAnimationFrame( update );
world.fixedUpdate();
tpsCameraControls.update( delta );
renderer.render( scene, camera );
} )();
</script>
The text was updated successfully, but these errors were encountered:
https://threejs.org/examples/?q=games#games_fps
I noticed that this example also uses an octree for collision detection, and the effect is excellent, and I have found no problems so far, I don't know if it helps this bug.
Collision detection anomalies
1.When initialized, it cannot be moved when the moving object is larger than other objects.
2.When a moving object jumps, it can overlap with other objects.
The text was updated successfully, but these errors were encountered: