Three.js - OrbitControls doesn't work

Question

If I run the script, the console displays me "THREE.OrbitControls is not a constructor".

What did I wrong? I used the same code from a manual.

var controls;     controls = new THREE.OrbitControls( camera );     controls.addEventListener( 'change', render );  var render = function () {     requestAnimationFrame( render );     renderer.render(scene, camera);                 //Hier wird die Größe des Fensters manipuliert!     renderer.setSize(window.innerWidth - 20, window.innerHeight - 20);                   

};

    var animate = function () {         requestAnimationFrame( animate );         controls.update();                       };   var geometry1 = new THREE.BoxGeometry( 10, 10, 10); var material = new THREE.MeshPhongMaterial( {specular: "#fdfb57", color: "#d8d613", emissive: "#6b6a0d", side: THREE.DoubleSide} ); var box = new THREE.Mesh(geometry1, material);   scene.add(box);     camera.position.z = 50;   render();    animate(); 

Answer 1

You must explicitly include OrbitControls in your application.

<script src="js/controls/OrbitControls.js"></script> 

Also, read the comments in the three.js OrbitControls example carefully so you understand when to use

controls.addEventListener( 'change', render ); // add this only if there is no animation loop (requestAnimationFrame) 

and when to use

controls.update(); // required if controls.enableDamping = true, or if controls.autoRotate = true 

http://threejs.org/examples/misc_controls_orbit.html

three.js r.72