I am encountering a similar issue to the one discussed in this question: Three.js - Uncaught TypeError: undefined is not a function -- and unfortunately, the solutions provided there did not work for me.
My journey with three.js began on the Getting Started page (). As I followed the instructions to create a scene using the library, I encountered an error related to the core code snippet:
<script src="js/three.js"></script>
<script>
// Javascript will go here
var scene = new THREE.Scene();
var camera = THREE.PerspectiveCamera( 75,
window.innerWidth / window.innerHeight, 1, 10000 );
var renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight);
document.body.appendChild( renderer.domElement );
var geometry = new THREE.BoxGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );
camera.position.z = 1000;
function render() {
requestAnimationFrame( render );
renderer.render( scene, camera );
}
render();
</script>
Upon attempting to use either the minimized 'three.min.js' or the unminimized 'three.js' from the mr.doob build folder, I consistently ran into the same error referencing line 10614. This particular error points to an issue with this.updateProjectionMatrix() accompanied by several instances of undefined in the preceding lines within the code snippet:
THREE.PerspectiveCamera = function ( fov, aspect, near, far ) {
THREE.Camera.call( this );
this.type = 'PerspectiveCamera';
this.zoom = 1;
this.fov = fov !== undefined ? fov : 50;
this.aspect = aspect !== undefined ? aspect : 1;
this.near = near !== undefined ? near : 0.1;
this.far = far !== undefined ? far : 2000;
this.updateProjectionMatrix();
};
Despite deploying a MAMP Web server setup on both my iMac and Windows 8 PC, the expected page fails to load in Chrome and Firefox, consistently presenting the same diagnostic message.
It seems like I'm missing something fundamental here. Any assistance would be greatly appreciated!