orbitcontrols

[martunta]

I am using react-three with meteor 1.4, that means having all the libraries imported and no global variables. How to get orbitcontrols to work with react-three in this case? Just thwoing OrbitControls.js in the mix does not work, as it requires global THREE object.

Using npm package three-orbit-controls do not work as well, as that requires camera passed to construct controls, and if camera and scene are defined in react-three then I can't really take it out and pass to some external library.

any suggestions how to deal with orbitcontrols in such a non-global-variable environment?

[Izzimach]

The OrbitControls you get back from from three-orbit-controls looks to be equivalent to the global one specified in OrbitControls.js, so I guess you should do something like

// at top of code/module/whatever

let THREE = require('three.js');
let OrbitControls = require('orbit-three-controls')(THREE)

//
// pass OrbitControls in as the scene prop 'orbitControls' instead of THREE.OrbitControls
//

react-three will pass the camera and canvas into the OrbitControls constructor so you shouldn't have to worry about that.

[martunta]

this doesn't seem to work. In their page they also state that there is extra constructor needed. And how to pass camera that comes from react-three I don't know.

OrbitControls = require('three-orbit-controls')(THREE)

controls = new OrbitControls(camera[, domElement])

[martunta]

overall it seems that it is not drop in replacement and I can not just use it as a prop in Scene :/

[Izzimach]

When you pass in an orbitControls prop to the scene it will call it as a constructor with the camera, shown here.

So that should work. If it doesn't can you post up a sample repository or gist or something with the example code that fails? I'm sure what else could be going wrong.

[martunta]

and now it works ... I don't know what I did differently before. Thanks!