converting & loading models in three.js

0
votes

I'm using Autodesk Fusion 360 to create some assemblies and I'd like to be able to display them using a three.js app.

Fusion can download any of the following formats: F3D (own format), Inventor 2014, IGES, SAT, SMT, STEP, DWG, DXF, STL (binary) & FBX.

My current workflow is Fusion 360 -> STL -> MeshLab -> OBJ & MTL -> three.js

This gives the following results:

  • In Fusion 360: external faces are solid red, internal ones are white (removed this because I can only post two links)
  • In MeshLab: MeshLab - faces are solid blue (actually, I didn't think STL carried any colour information, so I'm not sure how it has worked out that outside faces are one colour and internal faces are a different one) and otherwise it is an accurate representation of what I see in Fusion
  • In three.js: three.js - face colours are now shaded following the triangles.

Based on answers to other questions, I've tried using object.geometry.computeVertexNormals() and mergeVertices() in the onLoad function, but I get the error "cannot read property ... of undefined", which seems to mean there is no geometry object.

So, my questions are:

  1. Is this the best workflow?
  2. Is there a way to get real material info from Fusion to three.js?
  3. How can I smooth out the faces?

Thanks.

1
three.js
The last image looks indeed like wrong or no normals applied. Instead of computeVertexNormals() did you also try computeFaceNormals()? And maybe you don't need to convert it to OBJ. There is also a STLLoader in the examples folder. – Brakebein
That also doesn't work because the geometry object doesn't seem to exist. I have a version that works better in 3dviewer.net, but I created it before I was really noting my workflow and I can't for the life of me remember how it came about! STLLoader is on my list to try, but it creates a geometry without material and I can't see how I will be able to distinguish the different materials. Somehow MeshLab has done this, although it starts from the same STL file. I just don't understand the format well enough to know how that is possible. – Mark Nolan

1 Answers

0
votes

Depending on your needs, you might be able to use the JavaScript viewer available here:

https://developer.autodesk.com/api/view-and-data-api/

It's extensible, uses ThreeJS, and provides full support for viewing Fusion models.