[SOLVED] How to show a colored STL file in React app

How to show a colored STL file in React app

I’m using React and want to show STL files in my app, more specifically, colored STL files. I have a binary STL colored file. Take for example a colored STL file from the three.js official website: https://threejs.org/examples/models/stl/binary/colored.stl. You can see the colored file properly in http://www.viewstl.com/. I saw that there are some packages like stl-viewer that shows very nicely STL files, but the color for the file needs to be added within the app.

I tried using stl-viewer using modelColor with unset.

<STLViewer
   url='https://threejs.org/examples/models/stl/binary/colored.stl'
   width={800}
   modelColor='unset'
   backgroundColor='#EAEAEA'
   rotate={false}
/>

I expect the viewer to show me the file with its colors, but the model got a basic color and didn't use its binary set of colors.

Maybe someone here encountered the same issue? Does anyone here know a way that I can show my binary STL colored file in my React app?? Any help would be much appreciated!

Solution

I ended up contributing to stl-viewer package and managed to support colored STL files.

So if this issue is relevant for someone here, I encourage you to check react-stl-viewer.

I'll update here when my contribution has been merged.

Update: merged :)