STL rendering with threejs

Question

I have created a 3D model for printing in 3D an industrial layout. Because I am not used in playing with professional 3D modeler software, I used SketchUp and the result was fine !

Now, I want to reuse the 3D models to make a dynamic visit of the "to-be" installation.

I exported each object in Collada format (DAE), and then try to used the collada importer in Threejs. I have around 130 objects that I want to be able to select interactively, but I manage only to load one ...

I then get a try with STL loader (after having converting objects with MESHLAB from DAE to STL).

And then it works without any problem... but rendering problems.

In the linked picture (sorry, not enough reputation to insert image !), you can see that some parts of the objects seem the be "transparency", even if they have not this property set ! (only the ground is).

While moving with the TrackBallControl, some parts of the objects disappear from time to time....

I try with only one object, with or without the ground,...

I took snapshots of the problem I get :

• fig 1, inside the red circle, the errors appears
• fig 2, without the ground, it is the same : some parts that should be hidden are not
• fig 3, the wireframe rendering shows not pb in the exported model...

link >> http://stackoverflow.legrandcondor.com/photo.html

link >> http://stackoverflow.legrandcondor.com/

Any ideas ? Suggestions before I get crazy ?! (Everything else works fine!)

Thankx in advance,

Answer 1

Your camera near plane is 0.1 and far plane is 1000000. Small values of the near plane can lead to depth-sorting precision problems.

In your case, set your near plane to, say, 100.

ref: http://www.opengl.org/wiki/Depth_Buffer_Precision

Also consider using OrbitControls so your model remains right-side-up.

three.js r.69