Feedback on a Three.js project (Human Anatomy)!

Hey folks!

I would appreciate any feedback on this project as I’m about to start working with a lot of 3d anatomy models created in Blender and exported as .glb files.

https://codepen.io/grzegorz-rogala/pen/dPGKQgr?editors=1010

Specifically, I will need to hide/reveal groups and individual meshes and toggle opacity so I would be grateful for feedback on how to improve the Three.js code!.

Thanks for your help!

11 Likes

Not much to say about it, is cool feel complete, great job :slight_smile:

1 Like

You can change the opacity value in real time. That seems like it would handle most of which you have in mind.

You set transparency when you define the texture. For each material, you set transparent to true and then set the opacity level. Save the address of each material so you can access it and change the opacity value.

You could run into problems with multiple transparencies, but you can deal with those problems as they arise.

You can also make objects not visible. So, once, again, save the value of each object you want to change, so you can make it visible or not visible.

Thanks for the advice.

I originally wanted to go for ‘toggling visibility’ approach, which doesn’t require traversing the object so many times, but I really like the fade effect when transitioning opacity.

Also, I managed to solve the overlapping mashes transparency issues by using custom renderOrder for these meshes.

Next and final step is adding annotations to the model!

1 Like