Webworker

Sources/Interaction/Widgets/PiecewiseGaussianWidget/ComputeHistogram.worker.js

@@ -0,0 +1,17 @@
+import registerWebworker from 'webworker-promise/lib/register';
+
+registerWebworker(async ({ array, min, max, numberOfBins }, emit) => {
+  const delta = max - min;
+  const histogram = new Float32Array(numberOfBins);
+  histogram.fill(0);
+  for (let i = 0, len = array.length; i < len; i++) {
+    const idx = Math.floor(
+      (numberOfBins - 1) * (Number(array[i]) - min) / delta
+    );
+    histogram[idx] += 1;
+  }
+
+  return new registerWebworker.TransferableResponse(histogram, [
+    histogram.buffer,
+  ]);
+});

Sources/Interaction/Widgets/PiecewiseGaussianWidget/index.js

@@ -1,6 +1,10 @@
 import macro from 'vtk.js/Sources/macro';
 import vtkMath from 'vtk.js/Sources/Common/Core/Math';
 
+import WebworkerPromise from 'webworker-promise';
+
+import ComputeHistogramWorker from './ComputeHistogram.worker';
+
 /* eslint-disable no-continue */
 
 // ----------------------------------------------------------------------------
@@ -438,39 +442,63 @@ function vtkPiecewiseGaussianWidget(publicAPI, model) {
     numberOfBinToConsider = 1,
     numberOfBinsToSkip = 1
   ) => {
+    model.histogram = null;
     model.histogramArray = array;
     const max = vtkMath.arrayMax(array);
     const min = vtkMath.arrayMin(array);
-
-    const delta = max - min;
     model.dataRange = [min, max];
-    model.histogram = [];
-    while (model.histogram.length < model.numberOfBins) {
-      model.histogram.push(0);
-    }
-    for (let i = 0, len = array.length; i < len; i++) {
-      const idx = Math.floor(
-        (model.numberOfBins - 1) * (Number(array[i]) - min) / delta
+
+    const maxNumberOfWorkers = 4;
+    const arrayStride = Math.floor(array.length / maxNumberOfWorkers) || 1;
+    let arrayIndex = 0;
+    const workers = [];
+    while (arrayIndex < array.length) {
+      const worker = new ComputeHistogramWorker();
+      const workerPromise = new WebworkerPromise(worker);
+      const arrayStart = arrayIndex;
+      const arrayEnd = Math.min(arrayIndex + arrayStride, array.length - 1);
+      const subArray = new array.constructor(
+        array.slice(arrayStart, arrayEnd + 1)
+      );
+      workers.push(
+        workerPromise.postMessage(
+          { array: subArray, min, max, numberOfBins: model.numberOfBins },
+          [subArray.buffer]
+        )
       );
-      model.histogram[idx] += 1;
+      arrayIndex += arrayStride;
     }
+    Promise.all(workers).then((workerResults) => {
+      model.histogram = new Float32Array(model.numberOfBins);
+      model.histogram.fill(0);
+      workerResults.forEach((subHistogram) => {
+        for (let i = 0, len = subHistogram.length; i < len; ++i) {
+          model.histogram[i] += subHistogram[i];
+        }
+      });
 
-    // Smart Rescale Histogram
-    const sampleSize = Math.min(
-      numberOfBinToConsider,
-      model.histogram.length - numberOfBinsToSkip
-    );
-    const sortedArray = [].concat(model.histogram);
-    sortedArray.sort((a, b) => Number(a) - Number(b));
-    for (let i = 0; i < numberOfBinsToSkip; i++) {
-      sortedArray.pop();
-    }
-    while (sortedArray.length > sampleSize) {
-      sortedArray.shift();
-    }
-    const mean = sortedArray.reduce((a, b) => a + b, 0) / sampleSize;
+      // Smart Rescale Histogram
+      const sampleSize = Math.min(
+        numberOfBinToConsider,
+        model.histogram.length - numberOfBinsToSkip
+      );
+      const sortedArray = Array.from(model.histogram);
+      sortedArray.sort((a, b) => Number(a) - Number(b));
+      for (let i = 0; i < numberOfBinsToSkip; i++) {
+        sortedArray.pop();
+      }
+      while (sortedArray.length > sampleSize) {
+        sortedArray.shift();
+      }
+      const mean = sortedArray.reduce((a, b) => a + b, 0) / sampleSize;
+
+      for (let i = 0, len = model.histogram.length; i < len; ++i) {
+        model.histogram[i] /= mean;
+      }
+      publicAPI.modified();
+      setTimeout(publicAPI.render, 0);
+    });
 
-    model.histogram = model.histogram.map((v) => v / mean);
     publicAPI.modified();
   };
 
@@ -824,11 +852,13 @@ function vtkPiecewiseGaussianWidget(publicAPI, model) {
     }
 
     // Draw histogram
-    drawChart(ctx, graphArea, model.histogram, {
-      lineWidth: 1,
-      strokeStyle: model.style.histogramColor,
-      fillStyle: model.style.histogramColor,
-    });
+    if (model.histogram) {
+      drawChart(ctx, graphArea, model.histogram, {
+        lineWidth: 1,
+        strokeStyle: model.style.histogramColor,
+        fillStyle: model.style.histogramColor,
+      });
+    }
 
     // Draw gaussians
     drawChart(ctx, graphArea, model.opacities, {

Sources/Rendering/OpenGL/Texture/ComputeGradients.worker.js

@@ -0,0 +1,77 @@
+import { vec3 } from 'gl-matrix';
+import registerWebworker from 'webworker-promise/lib/register';
+
+import vtkMath from 'vtk.js/Sources/Common/Core/Math';
+
+registerWebworker(
+  async (
+    { width, height, depth, spacing, data, haveWebgl2, depthStart, depthEnd },
+    emit
+  ) => {
+    // have to compute the gradient to get the normal
+    // and magnitude
+    const depthLength = depthEnd - depthStart + 1;
+    const gradients = new Float32Array(width * height * depthLength * 4);
+    const gradientMagnitudes = new Float32Array(width * height * depthLength);
+
+    const sliceSize = width * height;
+    let inPtr = 0;
+    let outPtr = 0;
+    const grad = vec3.create();
+    vec3.set(
+      grad,
+      (data[inPtr + 1] - data[inPtr]) / spacing[0],
+      (data[inPtr + width] - data[inPtr]) / spacing[1],
+      (data[inPtr + sliceSize] - data[inPtr]) / spacing[2]
+    );
+    let minMag = vec3.length(grad);
+    let maxMag = -1.0;
+    for (let z = depthStart; z < depthEnd + 1; ++z) {
+      let zedge = 0;
+      if (z === depth - 1) {
+        zedge = -sliceSize;
+      }
+      for (let y = 0; y < height; ++y) {
+        let yedge = 0;
+        if (y === height - 1) {
+          yedge = -width;
+        }
+        for (let x = 0; x < width; ++x) {
+          let edge = inPtr + zedge + yedge;
+          if (x === width - 1) {
+            edge--;
+          }
+          vec3.set(
+            grad,
+            (data[edge + 1] - data[edge]) / spacing[0],
+            (data[edge + width] - data[edge]) / spacing[1],
+            (data[edge + sliceSize] - data[edge]) / spacing[2]
+          );
+
+          const mag = vec3.length(grad);
+          vec3.normalize(grad, grad);
+          gradients[outPtr++] = grad[0];
+          gradients[outPtr++] = grad[1];
+          gradients[outPtr++] = grad[2];
+          gradients[outPtr++] = mag;
+          gradientMagnitudes[inPtr] = mag;
+          inPtr++;
+        }
+      }
+    }
+    const arrayMinMag = vtkMath.arrayMin(gradientMagnitudes);
+    const arrayMaxMag = vtkMath.arrayMax(gradientMagnitudes);
+    minMag = Math.min(arrayMinMag, minMag);
+    maxMag = Math.max(arrayMaxMag, maxMag);
+
+    const result = {
+      subGradients: gradients,
+      subMinMag: minMag,
+      subMaxMag: maxMag,
+      subDepthStart: depthStart,
+    };
+    return new registerWebworker.TransferableResponse(result, [
+      gradients.buffer,
+    ]);
+  }
+);