@kitware/vtk.js 19.7.3 → 19.8.1

package/README.md

@@ -48,8 +48,8 @@ In general VTK tries to be as portable as possible; the specific configurations
 
 vtk.js supports the following development environments:
 
-- Node 12+
-- NPM 6+
+- Node 14+
+- NPM 7+
 
 and we use [@babel/preset-env](https://www.npmjs.com/package/@babel/preset-env) with the [defaults](https://github.com/Kitware/vtk-js/blob/master/.browserslistrc) set of [browsers target](https://browserl.ist/?q=defaults).
 But when built from source this could be adjusted to support any browser as long they provide WebGL.

package/Rendering/Core/RenderWindow.js

@@ -1,6 +1,6 @@
 import macro from '../../macros.js';
 
-var DEFAULT_VIEW_API = navigator.gpu ? 'WebGPU' : 'WebGL';
+var DEFAULT_VIEW_API = 'WebGL';
 var VIEW_CONSTRUCTORS = Object.create(null); // ----------------------------------------------------------------------------
 // static methods
 // ----------------------------------------------------------------------------

package/Rendering/Profiles/All.js

@@ -20,6 +20,9 @@ import '../WebGPU/Actor.js';
 import '../WebGPU/PolyDataMapper.js';
 import '../WebGPU/Texture.js';
 import '../WebGPU/Glyph3DMapper.js';
+import '../WebGPU/ImageMapper.js';
+import '../WebGPU/ImageSlice.js';
+import '../WebGPU/Volume.js';
 import '../WebGPU/PixelSpaceCallbackMapper.js';
 import '../WebGPU/SphereMapper.js';
 import '../WebGPU/StickMapper.js';

package/Rendering/Profiles/Volume.js

@@ -7,5 +7,7 @@ import '../OpenGL/VolumeMapper.js';
 import '../OpenGL/PixelSpaceCallbackMapper.js';
 import '../WebGPU/Camera.js';
 import '../WebGPU/Renderer.js';
+import '../WebGPU/ImageMapper.js';
+import '../WebGPU/ImageSlice.js';
 import '../WebGPU/Volume.js';
 import '../WebGPU/PixelSpaceCallbackMapper.js';

package/Rendering/WebGPU/ImageMapper.js

@@ -0,0 +1,421 @@
+import Constants from '../Core/ImageMapper/Constants.js';
+import { newInstance as newInstance$1, obj } from '../../macros.js';
+import vtkWebGPUShaderCache from './ShaderCache.js';
+import vtkWebGPUStorageBuffer from './StorageBuffer.js';
+import vtkWebGPUFullScreenQuad from './FullScreenQuad.js';
+import vtkWebGPUUniformBuffer from './UniformBuffer.js';
+import vtkWebGPUSampler from './Sampler.js';
+import vtkViewNode from '../SceneGraph/ViewNode.js';
+import { InterpolationType } from '../Core/ImageProperty/Constants.js';
+import { registerOverride } from './ViewNodeFactory.js';
+import { i as identity, t as translate, j as transpose, g as invert, m as multiply, s as scale } from '../../vendor/gl-matrix/esm/mat4.js';
+import { t as transformMat4, s as subtract } from '../../vendor/gl-matrix/esm/vec4.js';
+
+var SlicingMode = Constants.SlicingMode;
+var imgFragTemplate = "\n//VTK::Renderer::Dec\n\n//VTK::Mapper::Dec\n\n//VTK::TCoord::Dec\n\n//VTK::Image::Dec\n\n//VTK::RenderEncoder::Dec\n\n//VTK::IOStructs::Dec\n\n[[stage(fragment)]]\nfn main(\n//VTK::IOStructs::Input\n)\n//VTK::IOStructs::Output\n{\n  var output: fragmentOutput;\n\n  //VTK::Image::Sample\n  computedColor.g = computedColor.r;\n  computedColor.b = computedColor.r;\n  computedColor.a = 1.0;\n\n  // var computedColor: vec4<f32> = vec4<f32>(1.0,0.7, 0.5, 1.0);\n\n//VTK::RenderEncoder::Impl\n\n  return output;\n}\n"; // ----------------------------------------------------------------------------
+// helper methods
+// ----------------------------------------------------------------------------
+
+function computeFnToString(property, fn, numberOfComponents) {
+  var pwfun = fn.apply(property);
+
+  if (pwfun) {
+    var iComps = property.getIndependentComponents();
+    return "".concat(property.getMTime(), "-").concat(iComps, "-").concat(numberOfComponents);
+  }
+
+  return '0';
+} // ----------------------------------------------------------------------------
+// vtkWebGPUImageMapper methods
+// ----------------------------------------------------------------------------
+
+
+var tmpMat4 = new Float64Array(16);
+var tmp2Mat4 = new Float64Array(16);
+var tmp3Mat4 = new Float64Array(16);
+var ptsArray1 = new Float64Array(4);
+var ptsArray2 = new Float64Array(4);
+
+function vtkWebGPUImageMapper(publicAPI, model) {
+  // Set our className
+  model.classHierarchy.push('vtkWebGPUImageMapper');
+
+  publicAPI.buildPass = function (prepass) {
+    if (prepass) {
+      model.WebGPUImageSlice = publicAPI.getFirstAncestorOfType('vtkWebGPUImageSlice');
+      model.WebGPURenderer = model.WebGPUImageSlice.getFirstAncestorOfType('vtkWebGPURenderer');
+      model.WebGPURenderWindow = model.WebGPURenderer.getParent();
+      model.device = model.WebGPURenderWindow.getDevice();
+      var ren = model.WebGPURenderer.getRenderable(); // is slice set by the camera
+
+      if (model.renderable.getSliceAtFocalPoint()) {
+        model.renderable.setSliceFromCamera(ren.getActiveCamera());
+      }
+    }
+  }; // Renders myself
+
+
+  publicAPI.translucentPass = function (prepass) {
+    if (prepass) {
+      publicAPI.render();
+    }
+  };
+
+  publicAPI.opaquePass = function (prepass) {
+    if (prepass) {
+      publicAPI.render();
+    }
+  };
+
+  publicAPI.render = function () {
+    model.renderable.update();
+    model.currentInput = model.renderable.getInputData();
+    model.renderEncoder = model.WebGPURenderer.getRenderEncoder();
+    publicAPI.build(model.renderEncoder, model.device); // update descriptor sets
+
+    publicAPI.updateUBO(model.device);
+  };
+
+  publicAPI.computePipelineHash = function () {
+    var ext = model.currentInput.getExtent();
+
+    if (ext[0] === ext[1] || ext[2] === ext[3] || ext[4] === ext[5]) {
+      model.dimensions = 2;
+      model.pipelineHash = 'img2';
+    } else {
+      model.dimensions = 3;
+      model.pipelineHash = 'img3';
+    }
+  };
+
+  publicAPI.updateUBO = function (device) {
+    var utime = model.UBO.getSendTime();
+    var actor = model.WebGPUImageSlice.getRenderable();
+    var volMapr = actor.getMapper();
+
+    if (publicAPI.getMTime() > utime || model.renderable.getMTime() > utime || actor.getProperty().getMTime() > utime) {
+      // compute the SCTCMatrix
+      var image = volMapr.getInputData();
+      var center = model.WebGPURenderer.getStabilizedCenterByReference();
+      identity(tmpMat4);
+      translate(tmpMat4, tmpMat4, center); // tmpMat4 is now SC->World
+
+      var mcwcmat = actor.getMatrix();
+      transpose(tmp2Mat4, mcwcmat);
+      invert(tmp2Mat4, tmp2Mat4); // tmp2Mat4 is now world to model
+
+      multiply(tmpMat4, tmp2Mat4, tmpMat4); // tmp4Mat is now SC->Model
+      // the method on the data is world to index but the volume is in
+      // model coordinates so really in this context it is model to index
+
+      var modelToIndex = image.getWorldToIndex();
+      multiply(tmpMat4, modelToIndex, tmpMat4); // tmpMat4 is now SC -> Index, save this as we need it later
+
+      invert(tmp3Mat4, tmpMat4);
+      var dims = image.getDimensions();
+      identity(tmp2Mat4);
+      scale(tmp2Mat4, tmp2Mat4, [1.0 / dims[0], 1.0 / dims[1], 1.0 / dims[2]]);
+      multiply(tmpMat4, tmp2Mat4, tmpMat4); // tmpMat4 is now SC -> Tcoord
+
+      model.UBO.setArray('SCTCMatrix', tmpMat4); // need to compute the plane here in world coordinates
+      // then pass that down in the UBO
+
+      var ext = model.currentInput.getExtent(); // Find what IJK axis and what direction to slice along
+
+      var _model$renderable$get = model.renderable.getClosestIJKAxis(),
+          ijkMode = _model$renderable$get.ijkMode; // Find the IJK slice
+
+
+      var nSlice = model.renderable.getSlice();
+
+      if (ijkMode !== model.renderable.getSlicingMode()) {
+        // If not IJK slicing, get the IJK slice from the XYZ position/slice
+        nSlice = model.renderable.getSliceAtPosition(nSlice);
+      }
+
+      var axis0 = 2;
+      var axis1 = 0;
+      var axis2 = 1;
+
+      if (ijkMode === SlicingMode.I) {
+        axis0 = 0;
+        axis1 = 1;
+        axis2 = 2;
+      } else if (ijkMode === SlicingMode.J) {
+        axis0 = 1;
+        axis1 = 2;
+        axis2 = 0;
+      }
+
+      ptsArray1[axis0] = nSlice;
+      ptsArray1[axis1] = ext[axis1 * 2];
+      ptsArray1[axis2] = ext[axis2 * 2];
+      ptsArray1[3] = 1.0;
+      transformMat4(ptsArray1, ptsArray1, tmp3Mat4);
+      model.UBO.setArray('Origin', ptsArray1);
+      ptsArray2[axis0] = nSlice;
+      ptsArray2[axis1] = ext[axis1 * 2 + 1];
+      ptsArray2[axis2] = ext[axis2 * 2];
+      ptsArray2[3] = 1.0;
+      transformMat4(ptsArray2, ptsArray2, tmp3Mat4);
+      subtract(ptsArray2, ptsArray2, ptsArray1);
+      ptsArray2[3] = 1.0;
+      model.UBO.setArray('Axis1', ptsArray2);
+      ptsArray2[axis0] = nSlice;
+      ptsArray2[axis1] = ext[axis1 * 2];
+      ptsArray2[axis2] = ext[axis2 * 2 + 1];
+      ptsArray2[3] = 1.0;
+      transformMat4(ptsArray2, ptsArray2, tmp3Mat4);
+      subtract(ptsArray2, ptsArray2, ptsArray1);
+      ptsArray2[3] = 1.0;
+      model.UBO.setArray('Axis2', ptsArray2); // three levels of shift scale combined into one
+      // for performance in the fragment shader
+
+      var cScale = [1, 1, 1, 1];
+      var cShift = [0, 0, 0, 0];
+      var tView = model.helper.getTextureViews()[0];
+      var tScale = tView.getTexture().getScale();
+      var numComp = tView.getTexture().getNumberOfComponents();
+      var iComps = false; // todo handle independent?
+
+      for (var i = 0; i < numComp; i++) {
+        var cw = actor.getProperty().getColorWindow();
+        var cl = actor.getProperty().getColorLevel();
+        var target = iComps ? i : 0;
+        var cfun = actor.getProperty().getRGBTransferFunction(target);
+
+        if (cfun) {
+          var cRange = cfun.getRange();
+          cw = cRange[1] - cRange[0];
+          cl = 0.5 * (cRange[1] + cRange[0]);
+        }
+
+        cScale[i] = tScale / cw;
+        cShift[i] = -cl / cw + 0.5;
+      }
+
+      model.UBO.setArray('cScale', cScale);
+      model.UBO.setArray('cShift', cShift);
+      model.UBO.sendIfNeeded(device);
+    }
+  };
+
+  publicAPI.updateLUTImage = function (device) {
+    var actorProperty = model.WebGPUImageSlice.getRenderable().getProperty();
+    var tView = model.helper.getTextureViews()[0];
+    tView.getTexture().getNumberOfComponents();
+
+    var numIComps = 1;
+    var cfunToString = computeFnToString(actorProperty, actorProperty.getRGBTransferFunction, numIComps);
+
+    if (model.colorTextureString !== cfunToString) {
+      model.numRows = numIComps;
+      var colorArray = new Uint8Array(model.numRows * 2 * model.rowLength * 4);
+      var cfun = actorProperty.getRGBTransferFunction();
+
+      if (cfun) {
+        var tmpTable = new Float32Array(model.rowLength * 3);
+
+        for (var c = 0; c < numIComps; c++) {
+          cfun = actorProperty.getRGBTransferFunction(c);
+          var cRange = cfun.getRange();
+          cfun.getTable(cRange[0], cRange[1], model.rowLength, tmpTable, 1);
+
+          {
+            for (var _i = 0; _i < model.rowLength; _i++) {
+              colorArray[c * model.rowLength * 8 + _i * 4] = 255.0 * tmpTable[_i * 3];
+              colorArray[c * model.rowLength * 8 + _i * 4 + 1] = 255.0 * tmpTable[_i * 3 + 1];
+              colorArray[c * model.rowLength * 8 + _i * 4 + 2] = 255.0 * tmpTable[_i * 3 + 2];
+              colorArray[c * model.rowLength * 8 + _i * 4 + 3] = 255.0;
+            }
+          }
+        }
+      } else {
+        for (var _i2 = 0; _i2 < model.rowLength; ++_i2) {
+          var grey = 255.0 * _i2 / (model.rowLength - 1);
+          colorArray[_i2 * 4] = grey;
+          colorArray[_i2 * 4 + 1] = grey;
+          colorArray[_i2 * 4 + 2] = grey;
+          colorArray[_i2 * 4 + 3] = 255.0;
+
+          for (var _j = 0; _j < 4; _j++) {
+            colorArray[_i2 * 4 + model.rowLength * 4 + _j] = colorArray[_i2 * 4 + _j];
+          }
+        }
+      }
+
+      {
+        var treq = {
+          nativeArray: colorArray,
+          width: model.rowLength,
+          height: model.numRows * 2,
+          depth: 1,
+          format: 'rgba8unorm'
+        };
+        var newTex = device.getTextureManager().getTexture(treq);
+        var tview = newTex.createView();
+        tview.setName('tfunTexture');
+        var tViews = model.helper.getTextureViews();
+        tViews[1] = tview;
+      }
+      model.colorTextureString = cfunToString;
+    }
+  };
+
+  publicAPI.updateBuffers = function (device) {
+    var treq = {
+      imageData: model.currentInput,
+      source: model.currentInput
+    };
+    var newTex = device.getTextureManager().getTexture(treq);
+    var tViews = model.helper.getTextureViews();
+
+    if (!tViews[0] || tViews[0].getTexture() !== newTex) {
+      var tview = newTex.createView();
+      tview.setName("imgTexture");
+      tViews[0] = tview;
+    }
+
+    publicAPI.updateLUTImage(device);
+  };
+
+  publicAPI.build = function (renderEncoder, device) {
+    publicAPI.computePipelineHash();
+    model.helper.setPipelineHash(model.pipelineHash);
+    publicAPI.updateBuffers(device); // set interpolation on the texture based on property setting
+
+    var actorProperty = model.WebGPUImageSlice.getRenderable().getProperty();
+    var iType = actorProperty.getInterpolationType() === InterpolationType.NEAREST ? 'nearest' : 'linear';
+
+    if (!model.clampSampler || iType !== model.clampSampler.getOptions().minFilter) {
+      model.clampSampler = vtkWebGPUSampler.newInstance();
+      model.clampSampler.setName('clampSampler');
+      model.clampSampler.create(device, {
+        minFilter: iType,
+        magFilter: iType
+      });
+    }
+
+    model.helper.setAdditionalBindables(publicAPI.getBindables());
+    model.helper.setWebGPURenderer(model.WebGPURenderer);
+    model.helper.build(renderEncoder, device);
+    model.helper.registerToDraw();
+  };
+
+  publicAPI.getBindables = function () {
+    var bindables = []; // bindables.push(model.componentSSBO);
+
+    bindables.push(model.clampSampler);
+    return bindables;
+  };
+
+  var sr = model.helper.getShaderReplacements();
+
+  publicAPI.replaceShaderPosition = function (hash, pipeline, vertexInput) {
+    var vDesc = pipeline.getShaderDescription('vertex');
+    vDesc.addBuiltinOutput('vec4<f32>', '[[builtin(position)]] Position');
+    var code = vDesc.getCode();
+    var lines = ['var pos: vec4<f32> = mapperUBO.Origin +', '   (vertexBC.x * 0.5 + 0.5) * mapperUBO.Axis1 + (vertexBC.y * 0.5 + 0.5) * mapperUBO.Axis2;', 'pos.w = 1.0;'];
+
+    if (model.dimensions === 2) {
+      lines.push('var tcoord : vec2<f32> = (mapperUBO.SCTCMatrix * pos).xy;');
+    } else {
+      lines.push('var tcoord : vec3<f32> = (mapperUBO.SCTCMatrix * pos).xyz;');
+    }
+
+    lines.push('output.tcoordVS = tcoord;', 'output.Position = rendererUBO.SCPCMatrix * pos;');
+    code = vtkWebGPUShaderCache.substitute(code, '//VTK::Position::Impl', lines).result;
+    vDesc.setCode(code);
+  };
+
+  sr.set('replaceShaderPosition', publicAPI.replaceShaderPosition);
+
+  publicAPI.replaceShaderTCoord = function (hash, pipeline, vertexInput) {
+    var vDesc = pipeline.getShaderDescription('vertex');
+
+    if (model.dimensions === 2) {
+      vDesc.addOutput('vec2<f32>', 'tcoordVS');
+    } else {
+      vDesc.addOutput('vec3<f32>', 'tcoordVS');
+    }
+  };
+
+  sr.set('replaceShaderTCoord', publicAPI.replaceShaderTCoord);
+
+  publicAPI.replaceShaderImage = function (hash, pipeline, vertexInput) {
+    var fDesc = pipeline.getShaderDescription('fragment');
+    var code = fDesc.getCode();
+
+    if (model.dimensions === 3) {
+      code = vtkWebGPUShaderCache.substitute(code, '//VTK::Image::Sample', ["    var computedColor: vec4<f32> =", "      textureSampleLevel(imgTexture, clampSampler, input.tcoordVS, 0.0);", "//VTK::Image::Sample"]).result;
+    } else {
+      code = vtkWebGPUShaderCache.substitute(code, '//VTK::Image::Sample', ["    var computedColor: vec4<f32> =", "      textureSampleLevel(imgTexture, clampSampler, input.tcoordVS, 0.0);", "//VTK::Image::Sample"]).result;
+    }
+
+    code = vtkWebGPUShaderCache.substitute(code, '//VTK::Image::Sample', ["    var coord: vec2<f32> =", "      vec2<f32>(computedColor.r * mapperUBO.cScale.r + mapperUBO.cShift.r, 0.5);", "    computedColor = textureSampleLevel(tfunTexture, clampSampler, coord, 0.0);"]).result;
+    fDesc.setCode(code);
+  };
+
+  sr.set('replaceShaderImage', publicAPI.replaceShaderImage);
+} // ----------------------------------------------------------------------------
+// Object factory
+// ----------------------------------------------------------------------------
+
+
+var DEFAULT_VALUES = {
+  rowLength: 1024 // VBOBuildTime: 0,
+  // VBOBuildString: null,
+  // webGPUTexture: null,
+  // tris: null,
+  // imagemat: null,
+  // imagematinv: null,
+  // colorTexture: null,
+  // pwfTexture: null,
+  // lastHaveSeenDepthRequest: false,
+  // haveSeenDepthRequest: false,
+  // lastTextureComponents: 0,
+
+}; // ----------------------------------------------------------------------------
+
+function extend(publicAPI, model) {
+  var initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  Object.assign(model, DEFAULT_VALUES, initialValues); // Inheritance
+
+  vtkViewNode.extend(publicAPI, model, initialValues);
+  model.helper = vtkWebGPUFullScreenQuad.newInstance();
+  model.helper.setFragmentShaderTemplate(imgFragTemplate);
+  model.UBO = vtkWebGPUUniformBuffer.newInstance();
+  model.UBO.setName('mapperUBO');
+  model.UBO.addEntry('SCTCMatrix', 'mat4x4<f32>');
+  model.UBO.addEntry('Origin', 'vec4<f32>');
+  model.UBO.addEntry('Axis2', 'vec4<f32>');
+  model.UBO.addEntry('Axis1', 'vec4<f32>');
+  model.UBO.addEntry('cScale', 'vec4<f32>');
+  model.UBO.addEntry('cShift', 'vec4<f32>');
+  model.helper.setUBO(model.UBO);
+  model.SSBO = vtkWebGPUStorageBuffer.newInstance();
+  model.SSBO.setName('volumeSSBO');
+  model.componentSSBO = vtkWebGPUStorageBuffer.newInstance();
+  model.componentSSBO.setName('componentSSBO');
+  model.lutBuildTime = {};
+  obj(model.lutBuildTime, {
+    mtime: 0
+  });
+  model.imagemat = identity(new Float64Array(16));
+  model.imagematinv = identity(new Float64Array(16));
+  model.VBOBuildTime = {};
+  obj(model.VBOBuildTime); // Object methods
+
+  vtkWebGPUImageMapper(publicAPI, model);
+} // ----------------------------------------------------------------------------
+
+var newInstance = newInstance$1(extend, 'vtkWebGPUImageMapper'); // ----------------------------------------------------------------------------
+
+var index = {
+  newInstance: newInstance,
+  extend: extend
+}; // Register ourself to WebGPU backend if imported
+
+registerOverride('vtkImageMapper', newInstance);
+
+export { index as default, extend, newInstance };

package/Rendering/WebGPU/ImageSlice.js

@@ -0,0 +1,162 @@
+import { newInstance as newInstance$1, obj, get } from '../../macros.js';
+import vtkViewNode from '../SceneGraph/ViewNode.js';
+import { registerOverride } from './ViewNodeFactory.js';
+import { i as identity, j as transpose, d as copy, g as invert, t as translate } from '../../vendor/gl-matrix/esm/mat4.js';
+
+// vtkWebGPUImageSlice methods
+// ----------------------------------------------------------------------------
+
+function vtkWebGPUImageSlice(publicAPI, model) {
+  // Set our className
+  model.classHierarchy.push('vtkWebGPUImageSlice'); // Builds myself.
+
+  publicAPI.buildPass = function (prepass) {
+    if (!model.renderable || !model.renderable.getVisibility()) {
+      return;
+    }
+
+    if (prepass) {
+      if (!model.renderable) {
+        return;
+      }
+
+      model.WebGPURenderer = publicAPI.getFirstAncestorOfType('vtkWebGPURenderer');
+      model.WebGPURenderWindow = model.WebGPURenderer.getFirstAncestorOfType('vtkWebGPURenderWindow');
+
+      if (model.propID === undefined) {
+        model.propID = model.WebGPURenderWindow.getUniquePropID();
+      }
+
+      publicAPI.prepareNodes();
+      publicAPI.addMissingNode(model.renderable.getMapper());
+      publicAPI.removeUnusedNodes();
+    }
+  }; // we draw textures, then mapper, then post pass textures
+
+
+  publicAPI.traverseOpaquePass = function (renderPass) {
+    if (!model.renderable || !model.renderable.getNestedVisibility() || !model.renderable.getIsOpaque() || model.WebGPURenderer.getSelector() && !model.renderable.getNestedPickable()) {
+      return;
+    }
+
+    publicAPI.apply(renderPass, true);
+    model.children.forEach(function (child) {
+      child.traverse(renderPass);
+    });
+    publicAPI.apply(renderPass, false);
+  };
+
+  publicAPI.traverseTranslucentPass = function (renderPass) {
+    if (!model.renderable || !model.renderable.getNestedVisibility() || model.renderable.getIsOpaque() || model.WebGPURenderer.getSelector() && !model.renderable.getNestedPickable()) {
+      return;
+    }
+
+    publicAPI.apply(renderPass, true);
+    model.children.forEach(function (child) {
+      child.traverse(renderPass);
+    });
+    publicAPI.apply(renderPass, false);
+  };
+
+  publicAPI.queryPass = function (prepass, renderPass) {
+    if (prepass) {
+      if (!model.renderable || !model.renderable.getVisibility()) {
+        return;
+      }
+
+      if (model.renderable.getIsOpaque()) {
+        renderPass.incrementOpaqueActorCount();
+      } else {
+        renderPass.incrementTranslucentActorCount();
+      }
+    }
+  };
+
+  publicAPI.getBufferShift = function (wgpuRen) {
+    publicAPI.getKeyMatrices(wgpuRen);
+    return model.bufferShift;
+  };
+
+  publicAPI.getKeyMatrices = function (wgpuRen) {
+    // has the actor or stabilization center changed?
+    if (Math.max(model.renderable.getMTime(), wgpuRen.getStabilizedTime()) > model.keyMatricesTime.getMTime()) {
+      model.renderable.computeMatrix();
+      var mcwc = model.renderable.getMatrix(); // compute the net shift
+
+      var center = wgpuRen.getStabilizedCenterByReference();
+      model.bufferShift[0] = mcwc[3] - center[0];
+      model.bufferShift[1] = mcwc[7] - center[1];
+      model.bufferShift[2] = mcwc[11] - center[2];
+      transpose(model.keyMatrices.bcwc, mcwc);
+
+      if (model.renderable.getIsIdentity()) {
+        identity(model.keyMatrices.normalMatrix);
+      } else {
+        // we use bcwc BEFORE the translate below (just to get transposed mcvc)
+        copy(model.keyMatrices.normalMatrix, model.keyMatrices.bcwc); // zero out translation
+
+        model.keyMatrices.normalMatrix[3] = 0.0;
+        model.keyMatrices.normalMatrix[7] = 0.0;
+        model.keyMatrices.normalMatrix[11] = 0.0;
+        invert(model.keyMatrices.normalMatrix, model.keyMatrices.normalMatrix);
+        transpose(model.keyMatrices.normalMatrix, model.keyMatrices.normalMatrix);
+      } // only meed the buffer shift to get to world
+
+
+      translate(model.keyMatrices.bcwc, model.keyMatrices.bcwc, [-model.bufferShift[0], -model.bufferShift[1], -model.bufferShift[2]]); // to get to stabilized we also need the center
+
+      translate(model.keyMatrices.bcsc, model.keyMatrices.bcwc, [-center[0], -center[1], -center[2]]);
+      model.keyMatricesTime.modified();
+    }
+
+    return model.keyMatrices;
+  };
+} // ----------------------------------------------------------------------------
+// Object factory
+// ----------------------------------------------------------------------------
+
+
+var DEFAULT_VALUES = {
+  bufferShift: undefined,
+  keyMatrixTime: null,
+  keyMatrices: null,
+  propID: undefined
+}; // ----------------------------------------------------------------------------
+
+function extend(publicAPI, model) {
+  var initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  Object.assign(model, DEFAULT_VALUES, initialValues); // Inheritance
+
+  vtkViewNode.extend(publicAPI, model, initialValues);
+  model.keyMatricesTime = {};
+  obj(model.keyMatricesTime, {
+    mtime: 0
+  });
+  model.keyMatrices = {
+    normalMatrix: new Float64Array(16),
+    bcwc: new Float64Array(16),
+    bcsc: new Float64Array(16)
+  };
+  model.keyMatrixTime = {};
+  obj(model.keyMatrixTime, {
+    mtime: 0
+  });
+  model.keyMatrices = {
+    mcwc: identity(new Float64Array(16))
+  };
+  model.bufferShift = [0, 0, 0, 0];
+  get(publicAPI, model, ['propID', 'keyMatricesTime']); // Object methods
+
+  vtkWebGPUImageSlice(publicAPI, model);
+} // ----------------------------------------------------------------------------
+
+var newInstance = newInstance$1(extend, 'vtkWebGPUImageSlice'); // ----------------------------------------------------------------------------
+
+var index = {
+  newInstance: newInstance,
+  extend: extend
+}; // Register ourself to WebGPU backend if imported
+
+registerOverride('vtkImageSlice', newInstance);
+
+export { index as default, extend, newInstance };

package/Rendering/WebGPU/MapperHelper.js

@@ -1,3 +1,4 @@
+import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import macro from '../../macros.js';
 import vtkWebGPUBindGroup from './BindGroup.js';
 import vtkWebGPUPipeline from './Pipeline.js';
@@ -153,7 +154,7 @@ function vtkWebGPUMapperHelper(publicAPI, model) {
   };
 
   publicAPI.getBindables = function () {
-    var bindables = [];
+    var bindables = _toConsumableArray(model.additionalBindables);
 
     if (model.UBO) {
       bindables.push(model.UBO);
@@ -205,6 +206,7 @@ function vtkWebGPUMapperHelper(publicAPI, model) {
 
 
 var DEFAULT_VALUES = {
+  additionalBindables: undefined,
   bindGroup: null,
   device: null,
   fragmentShaderTemplate: null,
@@ -229,12 +231,13 @@ function extend(publicAPI, model) {
   model.vertexInput = vtkWebGPUVertexInput.newInstance();
   model.bindGroup = vtkWebGPUBindGroup.newInstance();
   model.bindGroup.setName('mapperBG');
+  model.additionalBindables = [];
   model.fragmentShaderTemplate = model.fragmentShaderTemplate || vtkWebGPUMapperHelperFS;
   model.vertexShaderTemplate = model.vertexShaderTemplate || vtkWebGPUMapperHelperVS;
   model.shaderReplacements = new Map(); // Build VTK API
 
   macro.get(publicAPI, model, ['vertexInput']);
-  macro.setGet(publicAPI, model, ['device', 'fragmentShaderTemplate', 'interpolate', 'numberOfInstances', 'numberOfVertices', 'pipelineHash', 'shaderReplacements', 'SSBO', 'textureViews', 'topology', 'UBO', 'vertexShaderTemplate', 'WebGPURenderer']); // Object methods
+  macro.setGet(publicAPI, model, ['additionalBindables', 'device', 'fragmentShaderTemplate', 'interpolate', 'numberOfInstances', 'numberOfVertices', 'pipelineHash', 'shaderReplacements', 'SSBO', 'textureViews', 'topology', 'UBO', 'vertexShaderTemplate', 'WebGPURenderer']); // Object methods
 
   vtkWebGPUMapperHelper(publicAPI, model);
 } // ----------------------------------------------------------------------------

package/Rendering/WebGPU/Profiles/All.js

@@ -4,6 +4,9 @@ import '../Actor.js';
 import '../PolyDataMapper.js';
 import '../Texture.js';
 import '../Glyph3DMapper.js';
+import '../ImageMapper.js';
+import '../ImageSlice.js';
+import '../Volume.js';
 import '../PixelSpaceCallbackMapper.js';
 import '../SphereMapper.js';
 import '../StickMapper.js';

package/Rendering/WebGPU/Profiles/Volume.js

@@ -1,4 +1,6 @@
 import '../Camera.js';
 import '../Renderer.js';
+import '../ImageMapper.js';
+import '../ImageSlice.js';
 import '../Volume.js';
 import '../PixelSpaceCallbackMapper.js';

package/Rendering/WebGPU/Sampler.js

@@ -12,10 +12,9 @@ function vtkWebGPUSampler(publicAPI, model) {
   publicAPI.create = function (device) {
     var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     model.device = device;
-    model.handle = model.device.getHandle().createSampler({
-      magFilter: options.magFilter ? options.magFilter : 'nearest',
-      minFilter: options.minFilter ? options.minFilter : 'nearest'
-    });
+    model.options.magFilter = options.magFilter ? options.magFilter : 'nearest';
+    model.options.minFilter = options.minFilter ? options.minFilter : 'nearest';
+    model.handle = model.device.getHandle().createSampler(model.options);
     model.bindGroupTime.modified();
   };
 
@@ -38,7 +37,8 @@ function vtkWebGPUSampler(publicAPI, model) {
 var DEFAULT_VALUES = {
   device: null,
   handle: null,
-  name: null
+  name: null,
+  options: null
 }; // ----------------------------------------------------------------------------
 
 function extend(publicAPI, model) {
@@ -46,6 +46,7 @@ function extend(publicAPI, model) {
   Object.assign(model, DEFAULT_VALUES, initialValues); // Object methods
 
   macro.obj(publicAPI, model);
+  model.options = {};
   model.bindGroupLayoutEntry = {
     /* eslint-disable no-undef */
     visibility: GPUShaderStage.VERTEX | GPUShaderStage.FRAGMENT,
@@ -58,7 +59,7 @@ function extend(publicAPI, model) {
   macro.obj(model.bindGroupTime, {
     mtime: 0
   });
-  macro.get(publicAPI, model, ['bindGroupTime', 'handle']);
+  macro.get(publicAPI, model, ['bindGroupTime', 'handle', 'options']);
   macro.setGet(publicAPI, model, ['bindGroupLayoutEntry', 'device', 'name']);
   vtkWebGPUSampler(publicAPI, model);
 } // ----------------------------------------------------------------------------

package/Rendering/WebGPU/Texture.js

@@ -147,6 +147,20 @@ function vtkWebGPUTexture(publicAPI, model) {
     }, [model.width, model.height, model.depth]);
     model.device.submitCommandEncoder(cmdEnc);
     model.ready = true;
+  }; // when data is pulled out of this texture what scale must be applied to
+  // get back to the original source data. For formats such as r8unorm we
+  // have to multiply by 255.0, for formats such as r16float it is 1.0
+
+
+  publicAPI.getScale = function () {
+    var tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(model.format);
+    var halfFloat = tDetails.elementSize === 2 && tDetails.sampleType === 'float';
+    return halfFloat ? 1.0 : 255.0;
+  };
+
+  publicAPI.getNumberOfComponents = function () {
+    var tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(model.format);
+    return tDetails.numComponents;
   };
 
   publicAPI.resizeToMatch = function (tex) {

package/Rendering/WebGPU/VolumePassFSQ.js

@@ -258,10 +258,7 @@ function vtkWebGPUVolumePassFSQ(publicAPI, model) {
       identity(tmpMat4);
       translate(tmpMat4, tmpMat4, center); // tmpMat4 is now SC->World
 
-      var _vol = model.volumes[vidx];
-
-      var mcwcmat = _vol.getRenderable().getMatrix();
-
+      var mcwcmat = actor.getMatrix();
       transpose(tmp2Mat4, mcwcmat);
       invert(tmp2Mat4, tmp2Mat4); // tmp2Mat4 is now world to model
 
@@ -295,10 +292,7 @@ function vtkWebGPUVolumePassFSQ(publicAPI, model) {
       spacingArray[vidx * 4 + 2] = spacing[2];
       spacingArray[vidx * 4 + 3] = 1.0; // handle filteringMode
 
-      var tformat = model.textureViews[vidx + 4].getTexture().getFormat();
-      var tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(tformat);
-      var halfFloat = tDetails.elementSize === 2 && tDetails.sampleType === 'float';
-      var tScale = halfFloat ? 1.0 : 255.0;
+      var tScale = model.textureViews[vidx + 4].getTexture().getScale();
 
       var ipScalarRange = _volMapr2.getIpScalarRange();
 
@@ -346,18 +340,16 @@ function vtkWebGPUVolumePassFSQ(publicAPI, model) {
       var iComps = vprop.getIndependentComponents(); // const numIComps = iComps ? numComp : 1;
       // half float?
 
-      var _tformat = model.textureViews[_vidx2 + 4].getTexture().getFormat();
-
-      var _tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(_tformat);
-
-      var _halfFloat = _tDetails.elementSize === 2 && _tDetails.sampleType === 'float';
+      var tformat = model.textureViews[_vidx2 + 4].getTexture().getFormat();
 
+      var tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(tformat);
+      var halfFloat = tDetails.elementSize === 2 && tDetails.sampleType === 'float';
       var volInfo = {
         scale: [255.0],
         offset: [0.0]
       };
 
-      if (_halfFloat) {
+      if (halfFloat) {
         volInfo.scale[0] = 1.0;
       } // three levels of shift scale combined into one
       // for performance in the fragment shader

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kitware/vtk.js",
-  "version": "19.7.3",
+  "version": "19.8.1",
   "description": "Visualization Toolkit for the Web",
   "keywords": [
     "3d",

package/vendor/gl-matrix/esm/vec4.js

@@ -41,6 +41,22 @@ function fromValues(x, y, z, w) {
   out[3] = w;
   return out;
 }
+/**
+ * Subtracts vector b from vector a
+ *
+ * @param {vec4} out the receiving vector
+ * @param {ReadonlyVec4} a the first operand
+ * @param {ReadonlyVec4} b the second operand
+ * @returns {vec4} out
+ */
+
+function subtract(out, a, b) {
+  out[0] = a[0] - b[0];
+  out[1] = a[1] - b[1];
+  out[2] = a[2] - b[2];
+  out[3] = a[3] - b[3];
+  return out;
+}
 /**
  * Normalize a vec4
  *
@@ -134,4 +150,4 @@ function transformMat4(out, a, m) {
   };
 })();
 
-export { fromValues as f, normalize as n, transformMat4 as t };
+export { fromValues as f, normalize as n, subtract as s, transformMat4 as t };