Build out 3D model viewer (Analysis Page)
Closed this issue · 2 comments
TODO: add more details
Most likely using threejs (https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene)
The initial example can just be to load in a local .stl file and be able to view it and rotate and zoom
Features:
- click and drag to rotate the model
- zoom in and out with a mouse wheel or 2 finger scroll
- Grid under the model
Check out https://www.hubs.com/ for an example of a good 3d part viewer.
Press 'Get Instant Quote' > Select 3D printing as the technology > Drag and drop the file I provided into the upload box > Press 'View DFM analysis'
TODO: setup a test backend route to download an stl file to use for loading into the viewer
This feature will likely be pretty big and complex so lets break this one down into many PRs:
- Load in an stl file from the backend and view it w/ threejs
- Click and drag to rotate the model, zoom in and out with mouse wheel or 2 finger scroll
TODO: build out in pure javascript mostly with just a top level React layer. I don't want too much mingling with React stuff in the logic so that it can eventually be extended to work in non-react / just html,css,javascript sites easily
Threejs STL loader example to load in an stl file and view it:
https://sbcode.net/threejs/loaders-stl/