Merge branch 'master' into 2434-vtkPolyDataNormals-add-computeCellNor…

…mals

Documentation/content/docs/intro_vtk_as_es6_dependency.md

@@ -4,7 +4,7 @@ title: Using vtk.js as an ES dependency
 This guide illustrates how to consume vtk.js as an ES dependency.
 
 This document was last updated with the following package versions:
-- `@kitware/vtk.js@v19`
+- `@kitware/vtk.js@v28`
 - `webpack@v5`
 
 ## Starting a new vtk.js project
@@ -56,6 +56,12 @@ Furthermore, you no longer need to require and add `vtkRules` into your webpack
  }
 ```
 
+### ES5 Support
+
+`@kitware/vtk.js` targets ES6+, which means projects consuming `@kitware/vtk.js` must use babel, swc, or another transpiler to target ES5 output. If you are using existing frontend tooling such as vite or create-react-app, you are already covered.
+
+Adding ES5 support is out of the scope for this documentation. Instead, please visit [babel's documentation](https://babeljs.io/) or [SWC's documentation](https://swc.rs/) to get started.
+
 ## Using vtk.js
 
 vtk.js is comprised of many different modules that are organized in several different folders. Below is an overview of where you can find certain classes.

Documentation/content/examples/index.md

@@ -52,6 +52,44 @@ This will allow you to see the some live code running in your browser. Just pick
 [VolumeContour]: ../docs/gallery/VolumeContour.jpg
 [ZipHttpReader]: ../docs/gallery/ZipHttpReader.jpg
 
+## Rendering
+
+<div class="gallery">
+
+[![ImageMapper Example][ImageMapper]](./ImageMapper.html "2D orthogonal axis image mapper")
+[![ImageResliceMapper Example][ImageResliceMapper]](./ImageResliceMapper.html "GPU 2D reslice/oblique/MPR mapper")
+[![ImageCPRMapper Example][ImageCPRMapper]](./ImageCPRMapper.html "Curved Planar Reformat GPU mapper, stretched and straightened")
+[![SphereMapper Example][SphereMapper]](./SphereMapper.html "GPU sphere mapper")
+[![StickMapper Example][StickMapper]](./StickMapper.html "GPU stick/cylinder/column mapper")
+[![Glyph3DMapper Example][Glyph3DMapper]](./Glyph3DMapper.html "Glyph mapper to render the same object multiple times")
+[![ScalarBarActor Example][ScalarBarActor]](./ScalarBarActor.html "Scalar bar/color legend/LUT actor")
+[![VolumeMapper Example][VolumeMapper]](./VolumeMapper.html "3D volume ray cast mapper witch volumetric scattering")
+[![SurfaceLICMapper Example][SurfaceLICMapper]](./SurfaceLICMapper.html "Surface Line Integral Convolution (LIC) mapper")
+
+
+</div>
+
+[Glyph3DMapper]: ../docs/gallery/Glyph3DMapper.jpg
+[ImageCPRMapper]: ../docs/gallery/ImageCPRMapper.jpg
+[ImageMapper]: ../docs/gallery/ImageMapper.jpg
+[ImageResliceMapper]: ../docs/gallery/ImageResliceMapper.gif
+[ScalarBarActor]: ../docs/gallery/ScalarBarActor.jpg
+[SphereMapper]: ../docs/gallery/SphereMapper.jpg
+[StickMapper]: ../docs/gallery/StickMapper.jpg
+[VolumeMapper]: ../docs/gallery/VolumeMapper.jpg
+[SurfaceLICMapper]: ../docs/gallery/SurfaceLICMapper.jpg
+
+## Picking/Selecting
+
+<div class="gallery">
+
+[![CellPicker Example][CellPicker]](./CellPicker.html "CPU cell picker/selector")
+[![PointPicker Example][PointPicker]](./PointPicker.html "CPU point picker/selector")
+[![HardwareSelector Example][HardwareSelector]](./HardwareSelector.html "GPU point/cell picker/selector with properties")
+
+[CellPicker]: ../docs/gallery/CellPicker.jpg
+[PointPicker]: ../docs/gallery/PointPicker.jpg
+[HardwareSelector]: ../docs/gallery/HardwareSelector.jpg
 
 ## Widgets
 

Sources/Common/Core/Math/index.d.ts

@@ -878,6 +878,19 @@ export function createUninitializedBounds(): Bounds;
  */
 export function getMajorAxisIndex(vector: number[]): number;
 
+/**
+ * Return the closest orthogonal matrix of 1, -1 and 0
+ * It works for both column major and row major matrices
+ * This function iteratively associate a column with a row by choosing
+ * the greatest absolute value from the remaining row and columns
+ * For each association, a -1 or a 1 is set in the output, depending on
+ * the sign of the value in the original matrix
+ * 
+ * @param {Number[]} matrix The matrix of size nxn
+ * @param {Number[]} n The size of the square matrix, defaults to 3
+ */
+export function getSparseOrthogonalMatrix(matrix: number[], n: number): number[];
+
 /**
  *
  * @param {Number} value The value to convert.
@@ -1028,6 +1041,7 @@ export declare const vtkMath: {
 	isInf: typeof isInf;
 	createUninitializedBounds: typeof createUninitializedBounds;
 	getMajorAxisIndex: typeof getMajorAxisIndex;
+	getSparseOrthogonalMatrix: typeof getSparseOrthogonalMatrix;
 	floatToHex2: typeof floatToHex2;
 	floatRGB2HexCode: typeof floatRGB2HexCode;
 	float2CssRGBA: typeof float2CssRGBA;

Sources/Common/Core/Math/index.js

@@ -2146,6 +2146,56 @@ export function getMajorAxisIndex(vector) {
   return axisIndex;
 }
 
+// Return the closest orthogonal matrix of 1, -1 and 0
+// It works for both column major and row major matrices
+// This function iteratively associate a column with a row by choosing
+// the greatest absolute value from the remaining row and columns
+// For each association, a -1 or a 1 is set in the output, depending on
+// the sign of the value in the original matrix
+export function getSparseOrthogonalMatrix(matrix, n = 3) {
+  // Initialize rows and columns to available indices
+  const rows = new Array(n);
+  const cols = new Array(n);
+  for (let i = 0; i < n; ++i) {
+    rows[i] = i;
+    cols[i] = i;
+  }
+  // No need for the last iteration: i = 0
+  for (let i = n - 1; i > 0; i--) {
+    // Loop invariant:
+    // rows[0:i] and cols[0:i] contain the remaining rows and columns
+    // rows]i:n[ and cols]i:n[ contain the associations found (rows[k] is associated with cols[k])
+    let bestValue = -Infinity;
+    let bestRowI = 0;
+    let bestColI = 0;
+    for (let rowI = 0; rowI <= i; ++rowI) {
+      const row = rows[rowI];
+      for (let colI = 0; colI <= i; ++colI) {
+        const col = cols[colI];
+        const absVal = Math.abs(matrix[row + n * col]);
+        if (absVal > bestValue) {
+          bestValue = absVal;
+          bestRowI = rowI;
+          bestColI = colI;
+        }
+      }
+    }
+    // Found an association between rows[bestRowI] and cols[bestColI]
+    // Put both at the end of their array by swapping with i
+    [rows[i], rows[bestRowI]] = [rows[bestRowI], rows[i]];
+    [cols[i], cols[bestColI]] = [cols[bestColI], cols[i]];
+  }
+
+  // Convert row/column association to a matrix
+  const output = new Array(n * n).fill(0);
+  for (let i = 0; i < n; ++i) {
+    const matIdx = rows[i] + n * cols[i];
+    output[matIdx] = matrix[matIdx] < 0 ? -1 : 1;
+  }
+
+  return output;
+}
+
 export function floatToHex2(value) {
   const integer = Math.floor(value * 255);
   if (integer > 15) {
@@ -2284,6 +2334,7 @@ export default {
   // JS add-on
   createUninitializedBounds,
   getMajorAxisIndex,
+  getSparseOrthogonalMatrix,
   floatToHex2,
   floatRGB2HexCode,
   float2CssRGBA,

Sources/Common/Core/Math/test/testMath.js

@@ -754,3 +754,47 @@ test('Test singularValueDecomposition', (t) => {
   }
   t.end();
 });
+
+test('Test getSparseOrthogonalMatrix', (t) => {
+  const successMsg = 'Row/column association is correct';
+  const tests = [
+    {
+      matrix: [
+        0.702, 0.7025, -0.1163, -0.2856, 0.1281, -0.9497, -0.6523, 0.7, 0.2906,
+      ],
+      expected: [0, 1, 0, 0, 0, -1, -1, 0, 0],
+    },
+  ];
+
+  // Test all matrices of size 3x3 which are orthogonal and contain only -1, 1 and 0
+  // There are 6 x 8 = 54 matrices to test
+  const permutation = [0, 1, 2];
+  for (let permutationIdx = 0; permutationIdx < 6; ++permutationIdx) {
+    for (let signBitField = 0; signBitField < 8; ++signBitField) {
+      const matrix = new Array(9).fill(0);
+      for (let row = 0; row < permutation.length; ++row) {
+        const col = permutation[row];
+        // eslint-disable-next-line no-bitwise
+        matrix[row + 3 * col] = signBitField & (1 << row) ? -1 : 1;
+      }
+      tests.push({ matrix, expected: matrix });
+    }
+    // Next permutation
+    if (permutationIdx % 2 === 0) {
+      [permutation[0], permutation[1]] = [permutation[1], permutation[0]];
+    } else {
+      [permutation[1], permutation[2]] = [permutation[2], permutation[1]];
+    }
+  }
+
+  tests.forEach(({ matrix, expected }) => {
+    const outputMatrix = vtkMath.getSparseOrthogonalMatrix(matrix);
+    const testResult = vtkMath.areEquals(expected, outputMatrix, 0);
+    const msg = testResult
+      ? successMsg
+      : `Bad row/column association with matrix ${matrix}\nExpected: ${expected}\nGot: ${outputMatrix}`;
+    t.ok(testResult, msg);
+  });
+
+  t.end();
+});

Sources/Filters/General/ImageMarchingSquares/api.md

@@ -12,10 +12,15 @@ algorithm).
 
 Set/Get an array of isocontour values.
 
-### sliceNumber
+### slice
 
-Set/Get the k-slice number of the input volume. By default the
-sliceNumber = 0.
+Set/Get the IJK slice number of the input volume. By default the
+slice = 0.
+
+### slicingMode
+
+Set/Get the slicing mode (IJK) which determines the direction to slice. By
+default the slicingMode = 2.
 
 ### mergePoints
 

Sources/Filters/General/ImageMarchingSquares/example/controller.html

@@ -1,20 +1,44 @@
 <table>
+  <tr>
+    <td>Slicing mode</td>
+    <td>
+      <select class="slicingMode">
+        <option value="0">I</option>
+        <option value="1">J</option>
+        <option value="2" selected>K</option>
+      </select>
+    </td>
+  </tr>
   <tr>
     <td>Volume resolution</td>
     <td>
-      <input class='volumeResolution' type="range" min="10" max="100" step="1" value="50" />
+      <input
+        class="volumeResolution"
+        type="range"
+        min="10"
+        max="100"
+        step="1"
+        value="50"
+      />
     </td>
   </tr>
   <tr>
     <td>Radius</td>
     <td>
-      <input class='sphereRadius' type="range" min="0.01" max="1.0" step="0.01" value="0.025" />
+      <input
+        class="sphereRadius"
+        type="range"
+        min="0.01"
+        max="1.0"
+        step="0.01"
+        value="0.025"
+      />
     </td>
   </tr>
   <tr>
     <td>Merge Points</td>
     <td>
-      <input class='mergePoints' type="checkbox" unchecked />
+      <input class="mergePoints" type="checkbox" unchecked />
     </td>
   </tr>
 </table>

Sources/Filters/General/ImageMarchingSquares/example/index.js

@@ -50,6 +50,7 @@ const sample = vtkSampleFunction.newInstance({
 
 // Isocontour
 const mSquares = vtkImageMarchingSquares.newInstance({ slice: 1 });
+mSquares.setSlicingMode(2);
 
 // Connect the pipeline proper
 mSquares.setInputConnection(sample.getOutputPort());
@@ -82,6 +83,13 @@ renderer.addActor(outlineActor);
 // ----------------------------------------------------------------------------
 fullScreenRenderer.addController(controlPanel);
 
+// Define the slicing mode
+document.querySelector('.slicingMode').addEventListener('input', (e) => {
+  const value = Number(e.target.value);
+  mSquares.setSlicingMode(value);
+  renderWindow.render();
+});
+
 // Define the volume resolution
 document.querySelector('.volumeResolution').addEventListener('input', (e) => {
   const value = Number(e.target.value);