Three.js - OrbitControls doesn't work

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


I had the same issue with a webpack build of the three library

var THREE = require('three')
THREE.OrbitControls === undefined  // true

Solution, install a 3rd party orbit control

npm install three-orbit-controls

details here: https://github.com/mattdesl/three-orbit-controls

then change the above code fragment to

var THREE = require('three')
var OrbitControls = require('three-orbit-controls')(THREE)
OrbitControls === undefined  // false

ok, not the best example, but when applied in place of THREE.OrbitControls, it works just fine ;)


https://github.com/nicolaspanel/three-orbitcontrols-ts :

npm install --save three-orbitcontrols-ts
import { OrbitControls } from 'three-orbitcontrols-ts'

orbitcontrols should be installed separately in angular, this issue bothers me for several days.