Creating 3D viewer similar to mixedRealityviewer or sketchFab

I am trying to create a common viewer, for obj-mtl/gltf/fbx. Users can upload any of the types of 3d models. I am not able to render the 3d models similar to any reputed viewer. Quality-wise it is looking flat. sometimes color differs. sometimes light to bright for a model. how to make every model look good, using a single code. Any suggestions would help.

Hi Thunder_Bird,

There is no one solution does all here, and each use-case has to be handled separately.

To start with, after importing the files into your viewer, you could try using (force-use) certain materials like MeshStandardMaterial/MeshPhysicalMaterial/MeshPhongMaterial depending upon your use-case on certain Meshes.

Also, setup lights to the scene (DirectionalLight,Spotlight etc) and see if it helps you to begin with.

Thanks
Srinivas

thanks for the reply.
After setting lights which looks good on one 3Dmodel, it does not work on other 3Dmodels. so there is no way to handle this?

Is it possible for you to share the model here ?

sorry. won’t be able to share the 3d models.

hi Srinivas,
regarding force-use of certain material.

object.traverse(child => {
      if (child instanceof THREE.Mesh) {
        child.geometry.computeFaceNormals();
        child.geometry.computeVertexNormals();
        child.material.side = THREE.DoubleSide;
        child.material=new THREE.MeshStandardMaterial();
      }
    });

I am trying the above code. But the .obj model lost all its color and textures and looking all white. Can u pls help me, how to force-use material for .obj/.gltf

I would try a viewer like https://gltf-viewer.donmccurdy.com/ with your glTF files, first. You can adjust the lighting settings there, and inspect the code to see how to reproduce that lighting. Good lighting — and especially an environment map — are critical.

I would do everything you can to get good lighting before you resort to replacing materials: changing materials would get complicated very fast.

okk thanks for the reply. Any suggestion for .obj? I am facing issue mostly in .obj files.

The first thing to try is improving lighting, regardless of the format.

But note that there are reasons we recommend glTF over other formats: OBJ and FBX do not give as good of results in many cases. This can’t be automatically “fixed” for arbitrary models, or we would have fixed the all the issues in OBJLoader and FBXLoader already. The formats themselves are: (a) ancient, in the case of OBJ, or (b) proprietary, in the case of FBX.

1 Like

Viewers like the one of Sketchfab use post processing effects, have a implementation for refraction and well looking/working transparency. You also see some extra antialiasing going on when there is no motion. They’ve put quite some effort into their viewer so it won’t be simple as settting up a basic scene to archive the same quality.

1 Like