@kitware/vtk.js 28.10.2 → 28.11.1

package/Interaction/UI/VolumeController.js

@@ -1,5 +1,4 @@
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import macro from '../../macros.js';
+import { m as macro } from '../../macros2.js';
 import vtkColorMaps from '../../Rendering/Core/ColorTransferFunction/ColorMapsLite.js';
 import vtkPiecewiseGaussianWidget from '../Widgets/PiecewiseGaussianWidget.js';
 import { s as svgLogo } from './Icons/Logo.svg.js';
@@ -7,12 +6,13 @@ import { s as svgEdge } from './Icons/Contrast.svg.js';
 import { s as svgSpacing } from './Icons/Spacing.svg.js';
 import { s as style } from './VolumeController/VolumeController.module.css.js';
 
+// ----------------------------------------------------------------------------
 // Global structures
 // ----------------------------------------------------------------------------
 
-var PRESETS_OPTIONS = vtkColorMaps.rgbPresetNames.map(function (name) {
-  return "<option value=\"".concat(name, "\">").concat(name, "</option>");
-}); // ----------------------------------------------------------------------------
+const PRESETS_OPTIONS = vtkColorMaps.rgbPresetNames.map(name => `<option value="${name}">${name}</option>`);
+
+// ----------------------------------------------------------------------------
 // vtkVolumeController methods
 // ----------------------------------------------------------------------------
 
@@ -25,83 +25,94 @@ function vtkVolumeController(publicAPI, model) {
     numberOfBins: 256,
     size: model.size
   });
-
   function updateUseShadow() {
-    var useShadow = !!Number(model.el.querySelector('.js-shadow').value);
+    const useShadow = !!Number(model.el.querySelector('.js-shadow').value);
     model.actor.getProperty().setShade(useShadow);
     model.renderWindow.render();
   }
-
   function updateColorMapPreset() {
-    var sourceDS = model.actor.getMapper().getInputData();
-
+    const sourceDS = model.actor.getMapper().getInputData();
     if (!sourceDS) {
       return;
     }
-
-    var dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
-    var dataRange = model.rescaleColorMap ? model.colorDataRange : dataArray.getRange();
-    var preset = vtkColorMaps.getPresetByName(model.el.querySelector('.js-color-preset').value);
-    var lookupTable = model.actor.getProperty().getRGBTransferFunction(0);
+    const dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
+    const dataRange = model.rescaleColorMap ? model.colorDataRange : dataArray.getRange();
+    const preset = vtkColorMaps.getPresetByName(model.el.querySelector('.js-color-preset').value);
+    const lookupTable = model.actor.getProperty().getRGBTransferFunction(0);
     lookupTable.applyColorMap(preset);
-    lookupTable.setMappingRange.apply(lookupTable, _toConsumableArray(dataRange));
+    lookupTable.setMappingRange(...dataRange);
     lookupTable.updateRange();
     model.renderWindow.render();
   }
-
   function updateSpacing() {
-    var value = Number(model.el.querySelector('.js-spacing').value);
-    var sourceDS = model.actor.getMapper().getInputData();
-    var sampleDistance = 0.7 * Math.sqrt(sourceDS.getSpacing().map(function (v) {
-      return v * v;
-    }).reduce(function (a, b) {
-      return a + b;
-    }, 0));
-    model.actor.getMapper().setSampleDistance(sampleDistance * Math.pow(2, value * 3.0 - 1.5));
+    const value = Number(model.el.querySelector('.js-spacing').value);
+    const sourceDS = model.actor.getMapper().getInputData();
+    const sampleDistance = 0.7 * Math.sqrt(sourceDS.getSpacing().map(v => v * v).reduce((a, b) => a + b, 0));
+    model.actor.getMapper().setSampleDistance(sampleDistance * 2 ** (value * 3.0 - 1.5));
     model.renderWindow.render();
   }
-
   function updateEdgeGradient() {
-    var value = Number(model.el.querySelector('.js-edge').value);
-
+    const value = Number(model.el.querySelector('.js-edge').value);
     if (value === 0) {
       model.actor.getProperty().setUseGradientOpacity(0, false);
     } else {
-      var sourceDS = model.actor.getMapper().getInputData();
-      var dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
-      var dataRange = dataArray.getRange();
+      const sourceDS = model.actor.getMapper().getInputData();
+      const dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
+      const dataRange = dataArray.getRange();
       model.actor.getProperty().setUseGradientOpacity(0, true);
-      var minV = Math.max(0.0, value - 0.3) / 0.7;
+      const minV = Math.max(0.0, value - 0.3) / 0.7;
       model.actor.getProperty().setGradientOpacityMinimumValue(0, (dataRange[1] - dataRange[0]) * 0.2 * minV * minV);
       model.actor.getProperty().setGradientOpacityMaximumValue(0, (dataRange[1] - dataRange[0]) * 1.0 * value * value);
     }
-
     model.renderWindow.render();
   }
-
   publicAPI.setupContent = function (renderWindow, actor, isBackgroundDark) {
-    var useShadow = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '1';
-    var presetName = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'erdc_rainbow_bright';
+    let useShadow = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '1';
+    let presetName = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 'erdc_rainbow_bright';
     publicAPI.setActor(actor);
     publicAPI.setRenderWindow(renderWindow);
-    var sourceDS = model.actor.getMapper().getInputData();
-    var dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
-    var lookupTable = model.actor.getProperty().getRGBTransferFunction(0);
-    var piecewiseFunction = model.actor.getProperty().getScalarOpacity(0);
-    var stylePostFix = isBackgroundDark ? 'DarkBG' : 'BrightBG';
-    var localStyle = {};
-    ['button', 'presets', 'shadow'].forEach(function (name) {
-      localStyle[name] = style["".concat(name).concat(stylePostFix)];
+    const sourceDS = model.actor.getMapper().getInputData();
+    const dataArray = sourceDS.getPointData().getScalars() || sourceDS.getPointData().getArrays()[0];
+    const lookupTable = model.actor.getProperty().getRGBTransferFunction(0);
+    const piecewiseFunction = model.actor.getProperty().getScalarOpacity(0);
+    const stylePostFix = isBackgroundDark ? 'DarkBG' : 'BrightBG';
+    const localStyle = {};
+    ['button', 'presets', 'shadow'].forEach(name => {
+      localStyle[name] = style[`${name}${stylePostFix}`];
     });
-    model.el.innerHTML = "\n      <div class=\"".concat(style.line, "\">\n        <div class=\"").concat(localStyle.button, " js-button\">").concat(svgLogo, "</div>\n        <select class=\"").concat(localStyle.shadow, " js-shadow js-toggle\">\n          <option value=\"1\">Use Shadow</option>\n          <option value=\"0\">No Shadow</option>\n        </select>\n        <select class=\"").concat(localStyle.presets, " js-color-preset js-toggle\">\n          ").concat(PRESETS_OPTIONS, "\n        </select>\n      </div>\n      <div class=\"").concat(style.line, " js-toggle\">\n        <div class=\"").concat(style.sliderEntry, "\">\n          <div class=\"").concat(style.sliderIcon, "\">").concat(svgSpacing, "</div>\n          <input type=\"range\" min=\"0\" max=\"1\" value=\"0.4\" step=\"0.01\" class=\"").concat(style.slider, " js-spacing\" />\n        </div>\n        <div class=\"").concat(style.sliderEntry, "\">\n          <div class=\"").concat(style.sliderIcon, "\">").concat(svgEdge, "</div>\n          <input type=\"range\" min=\"0\" max=\"1\" value=\"0.2\" step=\"0.01\" class=\"").concat(style.slider, " js-edge\" />\n        </div>\n      </div>\n      <div class=\"").concat(style.piecewiseEditor, " js-pwf js-toggle\"></div>\n    "); // DOM elements
-
-    var domToggleButton = model.el.querySelector('.js-button');
-    var domShadow = model.el.querySelector('.js-shadow');
-    var domPreset = model.el.querySelector('.js-color-preset');
-    var domSpacing = model.el.querySelector('.js-spacing');
-    var domEdge = model.el.querySelector('.js-edge');
-    var widgetContainer = model.el.querySelector('.js-pwf'); // Piecewise editor widget
-
+    model.el.innerHTML = `
+      <div class="${style.line}">
+        <div class="${localStyle.button} js-button">${svgLogo}</div>
+        <select class="${localStyle.shadow} js-shadow js-toggle">
+          <option value="1">Use Shadow</option>
+          <option value="0">No Shadow</option>
+        </select>
+        <select class="${localStyle.presets} js-color-preset js-toggle">
+          ${PRESETS_OPTIONS}
+        </select>
+      </div>
+      <div class="${style.line} js-toggle">
+        <div class="${style.sliderEntry}">
+          <div class="${style.sliderIcon}">${svgSpacing}</div>
+          <input type="range" min="0" max="1" value="0.4" step="0.01" class="${style.slider} js-spacing" />
+        </div>
+        <div class="${style.sliderEntry}">
+          <div class="${style.sliderIcon}">${svgEdge}</div>
+          <input type="range" min="0" max="1" value="0.2" step="0.01" class="${style.slider} js-edge" />
+        </div>
+      </div>
+      <div class="${style.piecewiseEditor} js-pwf js-toggle"></div>
+    `;
+
+    // DOM elements
+    const domToggleButton = model.el.querySelector('.js-button');
+    const domShadow = model.el.querySelector('.js-shadow');
+    const domPreset = model.el.querySelector('.js-color-preset');
+    const domSpacing = model.el.querySelector('.js-spacing');
+    const domEdge = model.el.querySelector('.js-edge');
+    const widgetContainer = model.el.querySelector('.js-pwf');
+
+    // Piecewise editor widget
     model.widget.updateStyle({
       backgroundColor: 'rgba(255, 255, 255, 0.6)',
       histogramColor: 'rgba(100, 100, 100, 0.5)',
@@ -125,26 +136,25 @@ function vtkVolumeController(publicAPI, model) {
     model.widget.applyOpacity(piecewiseFunction);
     model.widget.setContainer(widgetContainer);
     model.widget.bindMouseListeners();
-    model.colorDataRange = model.widget.getOpacityRange(); // Attach listeners
+    model.colorDataRange = model.widget.getOpacityRange();
 
+    // Attach listeners
     domToggleButton.addEventListener('click', publicAPI.toggleVisibility);
     domShadow.addEventListener('change', updateUseShadow);
     domPreset.addEventListener('change', updateColorMapPreset);
     domSpacing.addEventListener('input', updateSpacing);
     domEdge.addEventListener('input', updateEdgeGradient);
-    model.widget.onOpacityChange(function () {
+    model.widget.onOpacityChange(() => {
       model.widget.applyOpacity(piecewiseFunction);
       model.colorDataRange = model.widget.getOpacityRange();
-
       if (model.rescaleColorMap) {
         updateColorMapPreset();
       }
-
       if (!model.renderWindow.getInteractor().isAnimating()) {
         model.renderWindow.render();
       }
     });
-    model.widget.onAnimation(function (start) {
+    model.widget.onAnimation(start => {
       if (start) {
         model.renderWindow.getInteractor().requestAnimation(model.widget);
       } else {
@@ -152,59 +162,50 @@ function vtkVolumeController(publicAPI, model) {
         model.renderWindow.render();
       }
     });
-    lookupTable.onModified(function () {
+    lookupTable.onModified(() => {
       model.widget.render();
-
       if (!model.renderWindow.getInteractor().isAnimating()) {
         model.renderWindow.render();
       }
-    }); // Set default values
+    });
 
+    // Set default values
     domShadow.value = Number(useShadow) ? '1' : '0';
-    domPreset.value = presetName; // Apply values
+    domPreset.value = presetName;
 
+    // Apply values
     updateUseShadow();
     updateColorMapPreset();
     updateSpacing();
     updateEdgeGradient();
   };
-
-  publicAPI.setContainer = function (el) {
+  publicAPI.setContainer = el => {
     if (model.container && model.container !== el) {
       model.container.removeChild(model.el);
     }
-
     if (model.container !== el) {
       model.container = el;
-
       if (model.container) {
         model.container.appendChild(model.el);
       }
-
       publicAPI.modified();
     }
   };
-
-  var rescaleColorMap = publicAPI.setRescaleColorMap;
-
-  publicAPI.setRescaleColorMap = function (value) {
+  const rescaleColorMap = publicAPI.setRescaleColorMap;
+  publicAPI.setRescaleColorMap = value => {
     if (rescaleColorMap(value)) {
       updateColorMapPreset();
       return true;
     }
-
     return false;
   };
-
-  publicAPI.toggleVisibility = function () {
+  publicAPI.toggleVisibility = () => {
     publicAPI.setExpanded(!publicAPI.getExpanded());
   };
-
-  publicAPI.setExpanded = function (expanded) {
-    var elements = model.el.querySelectorAll('.js-toggle');
-    var count = elements.length;
+  publicAPI.setExpanded = expanded => {
+    const elements = model.el.querySelectorAll('.js-toggle');
+    let count = elements.length;
     model.expanded = expanded;
-
     if (model.expanded) {
       while (count--) {
         elements[count].style.display = 'flex';
@@ -215,44 +216,50 @@ function vtkVolumeController(publicAPI, model) {
       }
     }
   };
-
-  publicAPI.getExpanded = function () {
-    return model.expanded;
-  };
-
+  publicAPI.getExpanded = () => model.expanded;
   publicAPI.setSize = model.widget.setSize;
   publicAPI.render = model.widget.render;
-  publicAPI.onAnimation = model.widget.onAnimation; // Trigger rendering for any modified event
+  publicAPI.onAnimation = model.widget.onAnimation;
 
+  // Trigger rendering for any modified event
   publicAPI.onModified(publicAPI.render);
-  publicAPI.setSize.apply(publicAPI, _toConsumableArray(model.size));
-} // ----------------------------------------------------------------------------
+  publicAPI.setSize(...model.size);
+}
+
+// ----------------------------------------------------------------------------
 // Object factory
 // ----------------------------------------------------------------------------
 
-
-var DEFAULT_VALUES = {
+const DEFAULT_VALUES = {
   size: [600, 300],
   expanded: true,
   rescaleColorMap: false
-}; // ----------------------------------------------------------------------------
+};
+
+// ----------------------------------------------------------------------------
 
 function extend(publicAPI, model) {
-  var initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  Object.assign(model, DEFAULT_VALUES, initialValues); // Object methods
+  let initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  Object.assign(model, DEFAULT_VALUES, initialValues);
 
+  // Object methods
   macro.obj(publicAPI, model);
   macro.setGet(publicAPI, model, ['actor', 'renderWindow', 'rescaleColorMap']);
-  macro.get(publicAPI, model, ['widget']); // Object specific methods
+  macro.get(publicAPI, model, ['widget']);
 
+  // Object specific methods
   vtkVolumeController(publicAPI, model);
-} // ----------------------------------------------------------------------------
+}
+
+// ----------------------------------------------------------------------------
 
-var newInstance = macro.newInstance(extend, 'vtkVolumeController'); // ----------------------------------------------------------------------------
+const newInstance = macro.newInstance(extend, 'vtkVolumeController');
+
+// ----------------------------------------------------------------------------
 
 var vtkVolumeController$1 = {
-  newInstance: newInstance,
-  extend: extend
+  newInstance,
+  extend
 };
 
 export { vtkVolumeController$1 as default, extend, newInstance };

package/Interaction/UI.js

@@ -5,11 +5,11 @@ import vtkSlider from './UI/Slider.js';
 import vtkVolumeController from './UI/VolumeController.js';
 
 var UI = {
-  vtkCornerAnnotation: vtkCornerAnnotation,
-  vtkFPSMonitor: vtkFPSMonitor,
-  vtkIcons: vtkIcons,
-  vtkSlider: vtkSlider,
-  vtkVolumeController: vtkVolumeController
+  vtkCornerAnnotation,
+  vtkFPSMonitor,
+  vtkIcons,
+  vtkSlider,
+  vtkVolumeController
 };
 
 export { UI as default };

package/Interaction/Widgets/OrientationMarkerWidget/Constants.js

@@ -1,11 +1,11 @@
-var Corners = {
+const Corners = {
   TOP_LEFT: 'TOP_LEFT',
   TOP_RIGHT: 'TOP_RIGHT',
   BOTTOM_LEFT: 'BOTTOM_LEFT',
   BOTTOM_RIGHT: 'BOTTOM_RIGHT'
 };
 var Constants = {
-  Corners: Corners
+  Corners
 };
 
 export { Constants as default };