How can I replicate exocad’s smooth shading for my tooth model in Three.js?

Questions
, ,
1

threejs
threejs1176×1234 91 KB

exocad
exocad1075×683 49.4 KB

Hello everyone,

I’m trying to display the exact same 3D tooth STL model in Three.js that I originally created in exocad. However, while exocad shows the model with a nice, smooth surface, the same model looks faceted/low-poly in my Three.js viewer.

I’ve tried computing vertex normals (geometry.computeVertexNormals()) and using a standard material with flatShading set to false, but the result is still noticeably more angular than in exocad. I’m not sure if I need to modify the geometry or if there’s a specific workflow to ensure smooth shading in Three.js.

Here are some details:

  • The model file is exported from exocad (STL), and it displays perfectly in exocad.
  • In Three.js, the geometry appears more “blocky” with visible facets.
  • I’ve already attempted setting mesh.material.flatShading = false and calling geometry.computeVertexNormals().

Is there a recommended approach for importing dental or complex organic models into Three.js so they appear as smooth as they do in exocad? Do I need to adjust normals manually, increase mesh resolution, or use a specific export setting?

geometry.deleteAttribute('uv');
geometry = BufferGeometryUtils.mergeVertices(geometry);
geometry.computeVertexNormals();
geometry.attributes.position.setUsage(THREE.DynamicDrawUsage);
geometry.attributes.normal.setUsage(THREE.DynamicDrawUsage);
geometry.computeBoundsTree({ setBoundingBox: false });

For a more complete look at how this code fits into a Three.js project, you can check out my entire code in the following GitHub link: my-sculpt-project

Any advice or best practices would be greatly appreciated. Thank you!

2

From limited experience, what would you ask exocad support? Custom dental imaging incurs costly licenses. Trained technicians may wait weeks for a preliminary scan or service contract. Models from records load slow (:cloud_with_snow:) on the CPU!

Ask IMO (:cold_face:):

  • is tooth image preview from patient file, or
  • is tooth image from custom interpreter, or
  • has DPI obscured the facets

Often legacy software has targets for (1) consumer-grade equipment, or (2) intermediary performance calibration. Major revisions to software program versions are also infamous for continued education requirements. Therefore, as you shape your conclusion (:snowman:), ask: (1) is the model’s scale responsive to light decay, or (2) was metalness impacted, or (3) may vertices be joined within a threshold?

Chairs,
Team Sk44+

1 Like
3

Hey, have you tried merging the vertices of the geometry before shading smooth?

const mergedGeo = BufferGeometryUtils.mergeVertices(originalGeo);

mesh.geometry = mergedGeo
1 Like
4

Hello Lawrence3DPK,

Thank you for your suggestion. I have already implemented the following code snippet and reviewed my entire codebase here: my-sculpt-project.

geometry.deleteAttribute('uv');
geometry = BufferGeometryUtils.mergeVertices(geometry);
geometry.computeVertexNormals();
geometry.attributes.position.setUsage(THREE.DynamicDrawUsage);
geometry.attributes.normal.setUsage(THREE.DynamicDrawUsage);
geometry.computeBoundsTree({ setBoundingBox: false });

Despite these changes, the STL model still appears faceted and low-poly in Three.js. Could you suggest any alternative solutions or additional steps to achieve a smooth surface similar to exocad?

Thank you!