When I run my javascript code. I get the following error "Uncaught ReferenceError: THREE is not defined". The line mentioned is:
var renderer = new THREE.WebGLRenderer();
// I have attached the three.js library in the script tag. I don't know what seems to be problem.
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(45, window.innerWidth/window.innerHeight, 0.1, 1000);
camera.position.set = (0, 0, 10);
camera.lookAt(camera.position);
scene.add(camera);
var geometry = new THREE.Geometry();
geometry.vertices.push(new THREE.Vector3(0.0, 1.0, 0.0));
geometry.vertices.push(new THREE.Vector3(-1.0, -1.0, 0.0));
geometry.vertices.push(new THREE.Vector3(1.0, -1.0, 0.0));
geometry.faces.push(new THREE.Face3(0, 1, 2));
var material = new THREE.BasicMeshMaterial({
color: 0xFFFFFF,
side: THREE.DoubleSide
});
var mesh = new THREE.Mesh(geometry, material);
mesh.position.set(-1.5, 0.0, 4.0);
scene.add(mesh);
function render() {
renderer.render(scene, camera);
}
render();
For anyone checking on this, I had the same problem. Realised I messed up by putting <script src="./libs/three.js"></script>
after the script that actually uses three in my html file.
You need to include three.js before
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r79/three.min.js"></script>
I had similar problem, specifying character encoding in the header worked for me
<head>
<title>Cube by Charden</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
.
.
.
.
</head>
my mistake was including three.js file from /src/Three.js
folder. make sure to use ./build/three.js
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With