feat(STLReader): use locator-based vertex merging

Replace STLReader duplicate-vertex removal logic with locator-based
merging and improve the example.

fixes #3052

Author: daker

Data/stl/suzanne.stl

@@ -2,6 +2,7 @@ import '@kitware/vtk.js/favicon';
 
 // Load the rendering pieces we want to use (for both WebGL and WebGPU)
 import '@kitware/vtk.js/Rendering/Profiles/Geometry';
+import GUI from 'lil-gui';
 
 import vtkActor from '@kitware/vtk.js/Rendering/Core/Actor';
 import vtkFullScreenRenderWindow from '@kitware/vtk.js/Rendering/Misc/FullScreenRenderWindow';
@@ -13,7 +14,6 @@ import vtkPolyDataNormals from '@kitware/vtk.js/Filters/Core/PolyDataNormals';
 // ----------------------------------------------------------------------------
 
 const reader = vtkSTLReader.newInstance();
-reader.setRemoveDuplicateVertices(5);
 const mapper = vtkMapper.newInstance({ scalarVisibility: false });
 const actor = vtkActor.newInstance();
 
@@ -24,49 +24,91 @@ mapper.setInputConnection(normals.getOutputPort());
 
 // ----------------------------------------------------------------------------
 
-function update() {
-  const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance();
-  const renderer = fullScreenRenderer.getRenderer();
-  const renderWindow = fullScreenRenderer.getRenderWindow();
-
-  const resetCamera = renderer.resetCamera;
-  const render = renderWindow.render;
+const fullScreenRenderer = vtkFullScreenRenderWindow.newInstance();
+const renderer = fullScreenRenderer.getRenderer();
+const renderWindow = fullScreenRenderer.getRenderWindow();
+renderer.addActor(actor);
 
-  renderer.addActor(actor);
-  resetCamera();
-  render();
+function update() {
+  renderer.resetCamera();
+  renderWindow.render();
 }
 
 // ----------------------------------------------------------------------------
-// Use a file reader to load a local file
+// File handling
 // ----------------------------------------------------------------------------
 
-const myContainer = document.querySelector('body');
-const fileContainer = document.createElement('div');
-fileContainer.innerHTML = '<input type="file" class="file"/>';
-myContainer.appendChild(fileContainer);
+let lastLoadedArrayBuffer = null;
+
+function parseCurrentBuffer() {
+  if (!lastLoadedArrayBuffer) {
+    return;
+  }
+  reader.parseAsArrayBuffer(lastLoadedArrayBuffer.slice(0));
+  update();
+}
 
-const fileInput = fileContainer.querySelector('input');
+const hiddenFileInput = document.createElement('input');
+hiddenFileInput.type = 'file';
+hiddenFileInput.accept = '.stl';
+hiddenFileInput.style.display = 'none';
+document.body.appendChild(hiddenFileInput);
 
 function handleFile(event) {
   event.preventDefault();
   const dataTransfer = event.dataTransfer;
   const files = event.target.files || dataTransfer.files;
   if (files.length === 1) {
-    myContainer.removeChild(fileContainer);
     const fileReader = new FileReader();
     fileReader.onload = function onLoad(e) {
-      reader.parseAsArrayBuffer(fileReader.result);
-      update();
+      lastLoadedArrayBuffer = fileReader.result;
+      parseCurrentBuffer();
     };
     fileReader.readAsArrayBuffer(files[0]);
   }
 }
 
-fileInput.addEventListener('change', handleFile);
+hiddenFileInput.addEventListener('change', handleFile);
+
+// ----------------------------------------------------------------------------
+// GUI
+// ----------------------------------------------------------------------------
+
+const settings = {
+  merging: true,
+  removeDuplicateVertices: -1,
+  openFile() {
+    hiddenFileInput.click();
+  },
+};
+
+reader.setMerging(settings.merging);
+reader.setRemoveDuplicateVertices(settings.removeDuplicateVertices);
+
+const gui = new GUI({ title: 'Controls' });
+gui
+  .add(settings, 'merging')
+  .name('merging')
+  .onChange((value) => {
+    reader.setMerging(value);
+    parseCurrentBuffer();
+  });
+gui
+  .add(settings, 'removeDuplicateVertices', -1, 12, 1)
+  .name('removeDuplicateVertices')
+  .onChange((value) => {
+    reader.setRemoveDuplicateVertices(value);
+    parseCurrentBuffer();
+  });
+gui.add(settings, 'openFile').name('Open STL...');
 
 // ----------------------------------------------------------------------------
 // Use the reader to download a file
 // ----------------------------------------------------------------------------
 
-// reader.setUrl(`${__BASE_PATH__}/data/stl/segmentation.stl`, { binary: true }).then(update);
+fetch(`${__BASE_PATH__}/data/stl/suzanne.stl`)
+  .then((response) => response.arrayBuffer())
+  .then((arrayBuffer) => {
+    lastLoadedArrayBuffer = arrayBuffer;
+    parseCurrentBuffer();
+  });

Sources/IO/Geometry/STLReader/example/index.js

@@ -13,7 +13,34 @@ interface ISTLReaderOptions {
 /**
  *
  */
-export interface ISTLReaderInitialValues {}
+export interface ISTLReaderInitialValues {
+  /**
+   * Data access helper used for loading remote resources.
+   */
+  dataAccessHelper?:
+    | HtmlDataAccessHelper
+    | HttpDataAccessHelper
+    | JSZipDataAccessHelper
+    | LiteHttpDataAccessHelper;
+
+  /**
+   * Point locator used for vertex merging.
+   */
+  locator?: any;
+
+  /**
+   * Enable/disable point merging.
+   * Default is true.
+   */
+  merging?: boolean;
+
+  /**
+   * Merge tolerance power.
+   * If >= 0, points within 10^-tolerance are merged.
+   * Default is -1 (disabled).
+   */
+  removeDuplicateVertices?: number;
+}
 
 type vtkSTLReaderBase = vtkObject &
   Omit<
@@ -41,6 +68,16 @@ export interface vtkSTLReader extends vtkSTLReaderBase {
     | JSZipDataAccessHelper
     | LiteHttpDataAccessHelper;
 
+  /**
+   * Get the point locator used for vertex merging.
+   */
+  getLocator(): any;
+
+  /**
+   * Get whether point merging is enabled.
+   */
+  getMerging(): boolean;
+
   /**
    * Get the url of the object to load.
    */
@@ -74,6 +111,7 @@ export interface vtkSTLReader extends vtkSTLReaderBase {
    * @param {String} content The content to parse.
    */
   parseAsText(content: string): void;
+
   /**
    *
    * @param inData
@@ -93,6 +131,16 @@ export interface vtkSTLReader extends vtkSTLReaderBase {
       | LiteHttpDataAccessHelper
   ): boolean;
 
+  /**
+   * Set a point locator used for vertex merging.
+   */
+  setLocator(locator: any): boolean;
+
+  /**
+   * Enable/disable point merging.
+   */
+  setMerging(merging: boolean): boolean;
+
   /**
    * Set the url of the object to load.
    * @param {String} url the url of the object to load.