Three JS: Load an OBJ, translate to origin (center in scene), orbit
<p><strong>All I want to do is load an OBJ file and translate its coordinates to the world origins (0,0,0) so that orbit controls work perfectly (no Pivot points please).</strong></p>

<p><strong>I'd like to load random OBJ objects with different geometries/center points and have them translated automatically to the scene origin. In other words, a 'hard coded' translate solution for a specific model won't work</strong></p>

<p>This has got to be one of the most common scenarios for Three JS (basic 3d object viewer), so I'm surprised I can't find a definitive solution on SO. </p>

<p>Unfortunately there are a lot of older answers with deprecated functions, so I would really appreciate a new answer even if there are similar solutions out there.</p>

<p><strong>Things I've tried</strong></p>

<ol>
<li><p>the code below fits the object nicely to the camera, but doesn't solve the translation/orbiting problem.</p>

<pre><code>// fit camera to object
var bBox = new THREE.Box3().setFromObject(scene);
var height = bBox.size().y;
var dist = height / (2 * Math.tan(camera.fov * Math.PI / 360));
var pos = scene.position;

// fudge factor so the object doesn't take up the whole view
camera.position.set(pos.x, pos.y, dist * 0.5); 
camera.lookAt(pos);
</code></pre></li>
<li><p>Apparently the <code>geometry.center()</code> is good for translating an object's coordinates back to the origin, but the <code>THREE.GeometryUtils.center</code> has been replaced by <code>geometry.center()</code> and I keep getting errors when trying to use it.</p></li>
<li><p>when loading OBJs, geometry has now been replaced by bufferGeometry. I can't seem to cast the buffergeometry into geometry in order to use the <code>center()</code> function. do I have to place this in the object traverse > child loop like so? this seems unnecessarily complicated.</p>

<pre><code>geometry = new THREE.Geometry().fromBufferGeometry( child.geometry );
</code></pre></li>
</ol>

<p>My code is just a very simple OBJLoader.</p>

<pre><code>      var objLoader = new THREE.OBJLoader();
      objLoader.setPath('assets/');
      objLoader.load('BasketballNet_Skull.obj', function (object) {


            object.traverse( function ( child ) {

                if ( child instanceof THREE.Mesh ) {

                   child.material = material;

                }

        } );
       scene.add(object);
});
</code></pre>

<p>(BTW first real question on SO so forgive any formatting / noob issues)</p>