I've been diving into cannon.js and encountering the following error: Uncaught TypeError: CANNON.NaiveBroadPhase is not a constructor. I've tried numerous solutions but none seem to be working.
Here's a snippet of my script:
var scene, camera, renderer, world, dt, damping, helper;
function init() {
// SCENE
scene = new THREE.Scene();
scene.background = new THREE.Color(0xa8def0);
// CAMERA
camera = new THREE.PerspectiveCamera(50, innerWidth / innerHeight, 0.1, 100);
// RENDERER
renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
initPhysics();
animate();
}
// FUNCTION
function initPhysics() {
world = new CANNON.World();
dt = 1.0/60.0;
damping = 0.01
world.broadphase = new CANNON.NaiveBroadPhase();
world.gravity.set(0, -10, 0);
helper = new CannonHelper(scene, world);
const groundShape = new CANNON.Plane();
var groundMaterial = new CANNON.Material();
const groundBody = new CANNON.Body({ mass:0, material: groundMaterial});
groundBody.quaternion.setFromAxisAngle(new CANNON.Vec3(1, 0, 0) - Math.PI / 2);
groundBody.addShape(groundShape);
world.add(groundBody);
helper.addVisual(groundBody, 0xFFAA00);
}
function windowResize() {
camera.aspect = innerWidth / innerHeight
camera.updateProjectionMatrix();
renderer.setSize(innerWidth, innerHeight);
}
// ANIMATE
function animate() {
requestAnimationFrame(animate);
renderer.render(scene, camera);
}
init();
I would appreciate any insights on why this error is occurring.