# Usage OrbitControls in TypeScript on Playground

**URL:** <https://discourse.threejs.org/t/usage-orbitcontrols-in-typescript-on-playground/5406>\
**Category:** Questions\
**Tags:** typescript\
**Created:** [December 18, 2018, 11:14am UTC](https://discourse.threejs.org/t/usage-orbitcontrols-in-typescript-on-playground/5406 "2018-12-18T11:14:57Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![8Observer8](https://avatars.discourse-cdn.com/v4/letter/8/bbe5ce/32.png) [@8Observer8](https://discourse.threejs.org/u/8Observer8)\
**Post date:** [December 18, 2018, 11:14am UTC](https://discourse.threejs.org/t/usage-orbitcontrols-in-typescript-on-playground/5406/1 "2018-12-18T11:14:57Z")

</div>

Hello,

I am trying to run official [Getting Started Example](https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene) on Playground [Plunker](https://plnkr.co/edit/) with OrbitControls.

The first problem was that official OrbitControls is not friendly with TypeScript and I took: [GitHub - nicolaspanel/three-orbitcontrols-ts: ThreeJS OrbitControls as a standalone and typescript compatible npm module](https://github.com/nicolaspanel/three-orbitcontrols-ts)

But this module does not use AMD by default and I recompiled it to AMD for usage with RequireJS library because I have a few files: Program.ts and Scene.ts and I can run my example on Playground only with AMD compilation. Recompilation requires going in node\_modules folder for recompiling module - it is not a common way.

I created libs folder in my project and copied content of dist to libs/three-orbitcontrols-ts/ it works localy: [GitHub - 8Observer8/usage-orbitcontrols-in-typescript-on-playground](https://github.com/8Observer8/usage-orbitcontrols-in-typescript-on-playground)

I put all files in one directory for usage in Plunker and it works localy: [GitHub - 8Observer8/usage-orbitcontrols-in-typescript-on-playground-one-directory](https://github.com/8Observer8/usage-orbitcontrols-in-typescript-on-playground-one-directory)

But when I upload the files on Plunker it does not work: [Plunker - Usage OrbitControls in TypeScript on Playground](https://plnkr.co/edit/yICv96E7lTK8xu7DohJB?p=preview)

You will see the error in a console:

> Scene.js:11 Uncaught TypeError: three\_orbitcontrols\_ts\_1.OrbitControls is not a constructor

Please, help me to solve this problem.

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [December 19, 2018, 9:42am UTC](https://discourse.threejs.org/t/usage-orbitcontrols-in-typescript-on-playground/5406/2 "2018-12-19T09:42:03Z")

</div>

Crossposting:

> <https://stackoverflow.com/questions/53833090/usage-orbitcontrols-in-typescript-on-playground>

---

<div class="post-metadata">

**Author:** ![8Observer8](https://avatars.discourse-cdn.com/v4/letter/8/bbe5ce/32.png) [@8Observer8](https://discourse.threejs.org/u/8Observer8)\
**Post date:** [January 14, 2019, 11:21pm UTC](https://discourse.threejs.org/t/usage-orbitcontrols-in-typescript-on-playground/5406/3 "2019-01-14T23:21:16Z")

</div>

I made very simple example (just rewrite Getting Started Example) in TypeScript and Three.js. I hope it will be useful for someone. Check: [https://plnkr.co/edit/yICv96E7lTK8xu7DohJB?p=preview](https://vk.com/away.php?to=https%3A%2F%2Fplnkr.co%2Fedit%2FyICv96E7lTK8xu7DohJB%3Fp%3Dpreview&post=-24740426_1569&cc_key=)

This example shows:

- How to compile TS files to AMD modules and load them with Require.js
- How to place your examples in Playground ([https://plnkr.co/edit/](https://vk.com/away.php?to=https%3A%2F%2Fplnkr.co%2Fedit%2F&post=-24740426_1569&cc_key=))
- And how to use OrbitControl with TS on Playground (It does not work now but I will solve it soon)

OrbitControl with TS works locally:

> **[8Observer8/usage-orbitcontrols-in-typescript-on-playground](https://github.com/8Observer8/usage-orbitcontrols-in-typescript-on-playground)**
>
> Contribute to 8Observer8/usage-orbitcontrols-in-typescript-on-playground development by creating an account on GitHub.

  
But it does not want to work on Playground.

P.S. I will be very glad if someone help me and explain me why OrbitControl works locally but does not work on Playground.
