asdf asdf - 1 year ago 429
HTML Question

Using Threejs + OrbitContols in TypeScript

I'm not able to get this example of using the aforementioned combo going in TypeScript.

I have

<script src="lib/three.min.js"></script>
<script src="lib/OrbitControls.js"></script>
in my html
and the typescript file in

/// <reference path="lib\three.d.ts" />
this.controls = new THREE.OrbitControls(; //there's the error
this.controls.addEventListener('change', this.render);



in periodically called
function. For all I know, the setup is identical to the expample, but gives me a huge error (abbreviated) on compilation of the OrbitControls constructor line:

The property 'OrbitControls' does not exist on value of type '{REVISION:string;
CullFace: {[x: number ...

I guess there's whole Threejs in that error, since Visual Studio crashes the moment I click on it :). Thanks for your help.

Answer Source

Feeling kind of silly since the solution (or workaround at least) turns out to be quite simple...

Just declare the OrbitControls variable:

declare var THREE.OrbitControls: any; // even "declare var THREE.OrbitControls;" will do the trick

There are still some compilation errors but it works.