Question: I have code on JavaScript that uses node and three.js to make an interactive game. The issue I ' m encountering right now is I
I have code on JavaScript that uses node and three.js to make an interactive game. The issue Im encountering right now is I want to make it so that when the main character touches a wall the camera and the character rotate as can be seen when touching the right wall. However I want to add holes in the walls and the roof but to do that i wanted to change the way collision detection works so I started working on the right wall first and for some reason, I can't get it to work at all. Can you help me find out the error to make it so that if there are no walls the character goes through?
Here's the code:
main.js:
const startMaterial new THREE.MeshPhongMaterial color: xff flatShading: false ;
function createStartx y z
const startGeo new THREE.BoxGeometry;
const start new THREE.MeshstartGeo startMaterial;
scene.addstart;
return start;
const wallMaterial new THREE.MeshPhongMaterial color: xff flatShading: false ;
const wallGeo new THREE.BoxGeometry;
Function to create walls
function createRWallx y z
const wall new THREE.MeshwallGeo wallMaterial;
wall.position.setx y z;
scene.addwall;
return wall;
function createLWallx y z
const wall new THREE.MeshwallGeo wallMaterial;
wall.position.setx y z;
scene.addwall;
return wall;
const playerLight new THREE.PointLightxFFFFFF;
player.addplayerLight;
playerLight.position.set; Center of the player
const lightHelper new THREE.PointLightHelperplayerLight; Visual helper with a radius of
scene.addlightHelper;
const roofMaterial new THREE.MeshPhongMaterial
color: xff Swampy greenblue color
shininess: Moderate shininess for specular highlights
specular: xffffff White specular highlight
;
function createRoofx y z
const roofGeometry new THREE.BoxGeometry;
const roof new THREE.MeshroofGeometry roofMaterial;
roof.position.setx y z;
scene.addroof;
return roof;
Generate platforms and walls
const platforms ;
const rWall ;
const lWall ;
const roofs ;
const start ;
start.pushcreateStart
for let i ; i ; i
platforms.pushcreatePlatformi ;
platforms.pushcreatePlatformMathrandomi ;
rWall.pushcreateRWalli ;
lWall.pushcreateLWalli ;
roofs.pushcreateRoofi ;
Raycaster for detecting platforms below player
const raycaster new THREE.Raycaster;
const leftRaycaster new THREE.Raycaster;
const rightRaycaster new THREE.Raycaster;
const downVector new THREE.Vector; Downward direction
const rightVector new THREE.Vector; Right direction
const leftVector new THREE.Vector; Left direction
Player movement variables
let velocityY ;
const gravity ;
const jumpStrength ;
let isJumping false;
let forwardSpeed ;
const endPositionZ ; Define end position where player stops
const gravityDirection new THREE.Vector; Gravity pulls toward the wall
let side null;
Track if the game has started
let gameStarted false;
Check start platform
function checkStartBelow
raycaster.setplayerposition, downVector;
const intersects raycaster.intersectObjectsstart;
Return true if a platform is detected close below the player
return intersects.length && intersectsdistance ;
Check if there's a platform below the player
function checkPlatformBelow
raycaster.setplayerposition, downVector;
const intersects raycaster.intersectObjectsplatforms;
Return true if a platform is detected close below the player
return intersects.length && intersectsdistance ;
Function to check for wall collisions on the right
function checkPlatformRight
raycaster.setplayerposition, rightVector;
const intersects raycaster.intersectObjectsrWall;
Return true if a platform is detected close below the player
return intersects.length && intersectsdistance ;
Function to check for wall collisions on the left
function checkPlatformLeft
raycaster.setplayerposition, leftVector;
const intersects raycaster.intersectObjectsplatforms;
Return true if a platform is detected close below the player
return intersects.length && intersectsdistance ;
Step by Step Solution
There are 3 Steps involved in it
1 Expert Approved Answer
Step: 1 Unlock
Question Has Been Solved by an Expert!
Get step-by-step solutions from verified subject matter experts
Step: 2 Unlock
Step: 3 Unlock
