hi - newbie user to threejs.
trying to load my rhino obj file but can’t see anything in the scene. It’s a very complex file…
code below…
obj file is here:
… html code is here
<body>
<div id="info">
<a href="http://threejs.org" target="_blank">three.js</a> - OBJLoader test
</div>
<script src="../build/three.min.js"></script>
<script src="js/loaders/OBJLoader.js"></script>
<script src="js/controls/TrackballControls.js"></script>
<script>
var container;
var camera, scene, renderer, controls;
var mouseX = 0, mouseY = 0;
init();
animate();
function init()
{
container = document.createElement( 'div' );
document.body.appendChild( container );
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 2000 );
camera.position.z = 1000;
// scene
scene = new THREE.Scene();
// lights
var ambient = new THREE.AmbientLight( 0x101030 );
scene.add( ambient );
var directionalLight = new THREE.DirectionalLight( 0xffeedd );
directionalLight.position.set( 0, 0, 1 );
scene.add( directionalLight );
// texture
var manager = new THREE.LoadingManager();
manager.onProgress = function ( item, loaded, total ) { };
var texture = new THREE.Texture();
var loader = new THREE.ImageLoader( manager );
loader.load( 'textures/uv_grid_opengl.jpg', function ( image )
{
texture.image = image;
texture.needsUpdate = true;
} );
// model
var loader = new THREE.OBJLoader( manager );
loader.load( 'models/obj/d0d3bf18-2447-4c75-a315-a6bd555e1d16.obj', function ( object )
{
object.traverse( function ( child )
{
if ( child instanceof THREE.Mesh )
{
child.material.map = texture;
child.material.side = THREE.DoubleSide;
}
} );
scene.add( object );
} );
//
renderer = new THREE.WebGLRenderer();
renderer.setPixelRatio( window.devicePixelRatio );
renderer.setSize( window.innerWidth, window.innerHeight );
container.appendChild( renderer.domElement );
// controls
controls = new THREE.TrackballControls (camera, renderer.domElement);
controls.rotateSpeed = 1.0;
controls.zoomSpeed = 1.2;
window.addEventListener( 'resize', onWindowResize, false );
}
function onWindowResize()
{
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize( window.innerWidth, window.innerHeight );
}
function animate()
{
requestAnimationFrame( animate );
controls.update();
renderer.render( scene, camera );
}
</script>
</body>