Wanted to get some input on how to improve the procedures I followed to get this result. What I’m mostly after is improving the texturing on the outside wheel an overall realism [Just applied diffuse material to get the ball rolling, planned on adding at least specular later, but could use advice on that as well]. Figure closing the gap between the different lights will shore up some of the shading irregularities on the inwards of the outside wheel, but more interested in those areas in between.
Also want to add dimensions (researched that using a Canvas texture would probably be best), hide/unhide different parts, and also add a wireframe viewing option. Please advice anything that might help.
Here are the steps
Modeled parts in Inventor
Import into 3ds Max as Body Objects, Mesh Resolution in the Middle
Group objects together, center the pivot in the middle of the group, and center group to origin
Apply Unwrap UVW Modifier
Apply VRayMat materials
Add VRay Light Setup with Softbox applied to them
Baked Materials following this tutorial [changed a few of the Render Setup values]
Applied the baked .png files to Standard 3ds Max materials
Used Babylon Exporter to GLTF
Wrote the Code
Let me know any details that I could add, or whatever else.
Thanks for your time and the contribution to a framework I plan to get a lot out of…!
When you use script type="module" you don’t need to use window.addEventListener( 'load', init ) - the script is automatically deferred.
Regarding the render quality, try setting up a PMREM (type of environment map). See this example for details: three.js examples
Apply VRayMat materials
I haven’t used the Babylonjs exporter. But are you sure that it exports this type of material correctly? It’s usually best to use the built-in 3DS Max materials when prepping a model for export. Same for Vray lights - anything fancy you do with these lights/materials cannot be supported in three.js and probably won’t even export. Just use normal targeted point/spot/direct lights, or set up the lights in three.js.
The exception is if you’re using the lights to bake texture maps. But it may be harder to match the baked maps well to the lighting setup within three.js. Some experimentation is required here to figure out a good workflow.
For adding dimensions, do you mean as annotations? See my example here, and the rest of this thread:
In regards to PMREM, is there a way to use an environment map, but without it displaying as a background. This would ultimately be used to display parts for a store, and a solid color background would be prefered.
I baked the VRay material and lights into a Standard material. Could most likely improve on that process and will research more and then ask over at the Chaos Group forums in a minute.
I tried following your example code. Did not change the init suggestion, because I was just trying to lessen the confusion. Need to get an overall better conceptualization with everything, but hey it’s a start.
