My program was functioning well, but now I'm encountering the "undefined is not a function" error within the three.js file. The problematic line is 10466 in the uncompressed library, specifically within the declaration of THREE.PerspectiveCamera. Where could the issue lie? Appreciate any help!
var assets = {};
var modelLoader = new THREE.JSONLoader(true);
modelLoader.load("assets/horse.js", onLoadedAssets);
var loading = setTimeout(function() {
console.log("loading...");
}, 1000);
var scene, camera, renderer, controls;
var horse, box;
function init() {
scene = new THREE.Scene();
var w = window.innerWidth,
h = window.innerHeight;
camera = THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.y = 0;
camera.target = new THREE.Vector3(0, 0, 0);
var light1 = new THREE.DirectionalLight(0xefefff, 2);
light1.position.set(1, 1, 1).normalize();
scene.add(light1);
var light2 = new THREE.DirectionalLight(0xffefef, 2);
light2.position.set(-1, -1, -1).normalize();
scene.add(light2);
renderer = new THREE.WebGLRenderer({
antialias: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
window.addEventListener('resize', onWindowResize, false);
box = new Box(500, 500, 500);
horse = new Horse();
}
function animate() {
requestAnimationFrame(animate);
render();
}
var prevTime = Date.now();
function render() {
camera.position.x = 560 + Math.random() * 40;
camera.position.z = 560 + Math.random() * 40;
camera.lookAt(camera.target);
if (horse.animation) {
var time = Date.now();
horse.animation.update(time - prevTime);
prevTime = time;
}
renderer.render(scene, camera);
}
function onLoadedAssets(geometry) {
clearTimeout(loading);
console.log("loaded assets.")
geometry.computeFaceNormals();
geometry.computeVertexNormals();
var material = new THREE.MeshLambertMaterial({
color: 0x606060,
morphTargets: true
});
var mesh = new THREE.Mesh(geometry, material);
mesh.scale.set(1, 1, 1);
var animation = new THREE.MorphAnimation(mesh);
animation.play();
animation.isPlaying = false;
assets["horse"] = {
mesh: mesh,
animation: animation
};
init();
animate();
}
function onWindowResize() {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(w, h);
}
function Horse() {
var self;
self = assets["horse"];
scene.add(self.mesh);
self.startMoving = function() {
self.animation.isPlaying = true;
};
self.stopMoving = function() {
self.animation.isPlaying = false;
};
return self;
}
function Box(xidth, yidth, zidth) {
var self = this;
var geometry = new THREE.BoxGeometry(xidth, yidth, zidth);
var material = new THREE.MeshBasicMaterial({
color: 0x666666,
opacity: 0.4,
transparent: true
});
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
self.geometry = geometry;
self.cube = cube;
}