Merge pull request Kitware#1934 from Kitware/webgpu_comp_vol

chore(WebGPU): addres todos and more volume ren

Sources/Rendering/WebGPU/Actor/index.js

@@ -92,10 +92,8 @@ function vtkWebGPUActor(publicAPI, model) {
   publicAPI.getKeyMatrices = (wgpuRen) => {
     // has the actor or stabilization center changed?
     if (
-      Math.max(
-        model.renderable.getMTime(),
-        wgpuRen.getStabilizedTime().getMTime()
-      ) > model.keyMatricesTime.getMTime()
+      Math.max(model.renderable.getMTime(), wgpuRen.getStabilizedTime()) >
+      model.keyMatricesTime.getMTime()
     ) {
       model.renderable.computeMatrix();
 

Sources/Rendering/WebGPU/BufferManager/index.js

@@ -430,8 +430,6 @@ function vtkWebGPUBufferManager(publicAPI, model) {
     const buffer = vtkWebGPUBuffer.newInstance();
     buffer.setDevice(model.device);
 
-    const stride = vtkWebGPUTypes.getByteStrideFromBufferFormat(req.format);
-    const arrayType = vtkWebGPUTypes.getNativeTypeFromBufferFormat(req.format);
     let gpuUsage = null;
 
     // handle uniform buffers
@@ -456,12 +454,17 @@ function vtkWebGPUBufferManager(publicAPI, model) {
       gpuUsage = GPUBufferUsage.COPY_SRC;
       /* eslint-enable no-bitwise */
       buffer.createAndWrite(req.nativeArray, gpuUsage);
-      buffer.setArrayInformation([{ offset: 0, format: req.format }]);
     }
 
+    // all of the below types that have gpuUsage = VERTEX require format
+    // to be provided.
+
     // handle point data
     if (req.usage === BufferUsage.PointArray) {
       gpuUsage = GPUBufferUsage.VERTEX;
+      const arrayType = vtkWebGPUTypes.getNativeTypeFromBufferFormat(
+        req.format
+      );
       const result = packArray(
         req.cells,
         req.primitiveType,
@@ -478,7 +481,9 @@ function vtkWebGPUBufferManager(publicAPI, model) {
       );
       // console.log(result);
       buffer.createAndWrite(result.nativeArray, gpuUsage);
-      buffer.setStrideInBytes(stride);
+      buffer.setStrideInBytes(
+        vtkWebGPUTypes.getByteStrideFromBufferFormat(req.format)
+      );
       buffer.setArrayInformation([{ offset: 0, format: req.format }]);
     }
 
@@ -492,14 +497,18 @@ function vtkWebGPUBufferManager(publicAPI, model) {
         req.dataArray
       );
       buffer.createAndWrite(normals, gpuUsage);
-      buffer.setStrideInBytes(stride);
+      buffer.setStrideInBytes(
+        vtkWebGPUTypes.getByteStrideFromBufferFormat(req.format)
+      );
       buffer.setArrayInformation([{ offset: 0, format: req.format }]);
     }
 
     if (req.usage === BufferUsage.RawVertex) {
       gpuUsage = GPUBufferUsage.VERTEX;
       buffer.createAndWrite(req.nativeArray, gpuUsage);
-      buffer.setStrideInBytes(stride);
+      buffer.setStrideInBytes(
+        vtkWebGPUTypes.getByteStrideFromBufferFormat(req.format)
+      );
       buffer.setArrayInformation([{ offset: 0, format: req.format }]);
     }
 

Sources/Rendering/WebGPU/Camera/index.js

@@ -23,7 +23,7 @@ function vtkWebGPUCamera(publicAPI, model) {
         publicAPI.getMTime(),
         ren.getMTime(),
         model.renderable.getMTime(),
-        webGPURenderer.getStabilizedTime().getMTime()
+        webGPURenderer.getStabilizedTime()
       ) > model.keyMatrixTime.getMTime()
     ) {
       const wcvc = model.renderable.getViewMatrix();

Sources/Rendering/WebGPU/PixelSpaceCallbackMapper/index.js

@@ -23,7 +23,7 @@ function vtkWebGPUPixelSpaceCallbackMapper(publicAPI, model) {
     const texels = null;
 
     if (model.renderable.getUseZValues()) {
-      // Todo
+      // Todo return zvalues? async?
     }
 
     model.renderable.invokeCallback(

Sources/Rendering/WebGPU/README.md

@@ -42,9 +42,9 @@ Waiting on fixes/dev in WebGPU spec
 - 3d textures (as of April 21 2021 Dawn lacks support for 1d and 3d)
 - image display (use 3d texture)
 - more cross platform testing and bug fixing
-- single volume rendering (abandon)
 
 # Recently ToDone
+- added bind groups
 - actor matrix support with auto shift (handle in renderer?)
 - add an example of customizing WebGPU
 - make all shader replacements programatic, generate

Sources/Rendering/WebGPU/Renderer/index.js

@@ -367,6 +367,8 @@ function vtkWebGPURenderer(publicAPI, model) {
     return null;
   };
 
+  publicAPI.getStabilizedTime = () => model.stabilizedTime.getMTime();
+
   publicAPI.releaseGraphicsResources = () => {
     if (model.selector !== null) {
       model.selector.releaseGraphicsResources();

Sources/Rendering/WebGPU/Texture/index.js

@@ -58,23 +58,19 @@ function vtkWebGPUTexture(publicAPI, model) {
   // set the data
   publicAPI.writeImageData = (req) => {
     let bufferBytesPerRow = model.width * 4;
-    if (req.dataArray || req.nativeArray) {
+    if (req.nativeArray) {
       // create and write the buffer
       const buffRequest = {
         /* eslint-disable no-undef */
         usage: BufferUsage.Texture,
         /* eslint-enable no-undef */
-        // todo this needs to be computed from the texture format
-        format: 'unorm8x4',
       };
 
       if (req.dataArray) {
         buffRequest.dataArray = req.dataArray;
         buffRequest.time = req.dataArray.getMTime();
       }
-      if (req.nativeArray) {
-        buffRequest.nativeArray = req.nativeArray;
-      }
+      buffRequest.nativeArray = req.nativeArray;
 
       // bytesPerRow must be a multiple of 256 so we might need to rebuild
       // the data here before passing to the buffer. e.g. if it is unorm8x4 then

Sources/Rendering/WebGPU/TextureManager/index.js

@@ -7,8 +7,8 @@ import vtkWebGPUTexture from 'vtk.js/Sources/Rendering/WebGPU/Texture';
 
 function requestMatches(req1, req2) {
   if (req1.time !== req2.time) return false;
-  if (req1.address !== req2.address) return false;
-  //  if (req1.format !== req2.format) return false;
+  if (req1.nativeArray !== req2.nativeArray) return false;
+  if (req1.format !== req2.format) return false;
   return true;
 }
 
@@ -30,9 +30,8 @@ function vtkWebGPUTextureManager(publicAPI, model) {
     // fill in values based on imageData if the request has it
     if (req.imageData) {
       req.dataArray = req.imageData.getPointData().getScalars();
-      // todo remove use of address and use hash and nativeArray
-      req.address = req.imageData.getPointData().getScalars();
-      req.time = req.address.getMTime();
+      req.time = req.dataArray.getMTime();
+      req.nativeArray = req.dataArray.getData();
       const dims = req.imageData.getDimensions();
       req.width = dims[0];
       req.height = dims[1];
@@ -55,10 +54,9 @@ function vtkWebGPUTextureManager(publicAPI, model) {
 
     // fill in values based on image if the request has it
     if (req.image) {
-      req.address = req.image;
       req.time = 0;
-      req.width = req.address.width;
-      req.height = req.address.height;
+      req.width = req.image.width;
+      req.height = req.image.height;
       req.depth = 1;
       req.format = 'rgba8unorm';
     }
@@ -85,7 +83,7 @@ function vtkWebGPUTextureManager(publicAPI, model) {
     });
 
     // fill the texture if we have data
-    if (req.dataArray || req.nativeArray || req.image) {
+    if (req.nativeArray || req.image) {
       newTex.writeImageData(req);
     }
 
@@ -101,8 +99,8 @@ function vtkWebGPUTextureManager(publicAPI, model) {
       dabuffers.push({
         request: {
           time: req.time,
-          address: req.address,
-          // format: req.format,
+          nativeArray: req.nativeArray,
+          format: req.format,
         },
         texture: newTex,
       });

Sources/Rendering/WebGPU/Volume/index.js

@@ -91,10 +91,8 @@ function vtkWebGPUVolume(publicAPI, model) {
   publicAPI.getKeyMatrices = (wgpuRen) => {
     // has the actor or stabilization center changed?
     if (
-      Math.max(
-        model.renderable.getMTime(),
-        wgpuRen.getStabilizedTime().getMTime()
-      ) > model.keyMatricesTime.getMTime()
+      Math.max(model.renderable.getMTime(), wgpuRen.getStabilizedTime()) >
+      model.keyMatricesTime.getMTime()
     ) {
       model.renderable.computeMatrix();
 

Sources/Rendering/WebGPU/VolumePass/index.js

@@ -152,9 +152,6 @@ function vtkWebGPUVolumePass(publicAPI, model) {
   };
 
   publicAPI.updateDepthPolyData = (renNode) => {
-    // todo also check stabilized time
-    const center = renNode.getStabilizedCenterByReference();
-
     // check mtimes first
     let update = false;
     for (let i = 0; i < model.volumes.length; i++) {
@@ -165,12 +162,23 @@ function vtkWebGPUVolumePass(publicAPI, model) {
       }
     }
 
+    // also check stabilized time
+    const stime = renNode.getStabilizedTime();
+    if (
+      !model._lastMTimes[model.volumes.length] ||
+      stime !== model._lastMTimes[model.volumes.length]
+    ) {
+      update = true;
+      model._lastMTimes[model.volumes.length] = stime;
+    }
+
     // if no need to update then return
     if (!update) {
       return;
     }
 
     // rebuild
+    const center = renNode.getStabilizedCenterByReference();
     const numPts = model.volumes.length * 8;
     const points = new Float64Array(numPts * 3);
     const numTris = model.volumes.length * 12;
@@ -227,8 +235,8 @@ function vtkWebGPUVolumePass(publicAPI, model) {
         usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.SAMPLED,
       });
       const minView = model.depthRangeTexture2.createView();
-      minView.addSampler(device);
       minView.setName('minTexture');
+      // shares the maxTextureSampler
       model.depthRangeEncoder.setColorTextureView(1, minView);
       model._mapper.setDevice(viewNode.getDevice());
       model._mapper.setTextureViews([model.depthTextureView]);
@@ -367,6 +375,22 @@ function vtkWebGPUVolumePass(publicAPI, model) {
       },
     });
   };
+
+  // marks modified when needed
+  publicAPI.setVolumes = (val) => {
+    if (!model.volumes || model.volumes.length !== val.length) {
+      model.volumes = [...val];
+      publicAPI.modified();
+      return;
+    }
+    for (let i = 0; i < val.length; i++) {
+      if (val[i] !== model.volumes[i]) {
+        model.volumes = [...val];
+        publicAPI.modified();
+        return;
+      }
+    }
+  };
 }
 
 // ----------------------------------------------------------------------------
@@ -399,11 +423,7 @@ export function extend(publicAPI, model, initialValues = {}) {
   model._boundsPoly = vtkPolyData.newInstance();
   model._lastMTimes = [];
 
-  macro.setGet(publicAPI, model, [
-    'colorTextureView',
-    'depthTextureView',
-    'volumes',
-  ]);
+  macro.setGet(publicAPI, model, ['colorTextureView', 'depthTextureView']);
 
   // Object methods
   vtkWebGPUVolumePass(publicAPI, model);