chore(WebGPU): addres todos and more volume ren

Addressed some todos left in the code

Volume renderering handles mtime and updates better

Minor changes to support composite versus mip

Some texture code cleanup

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);