@kitware/vtk.js 25.5.0 → 25.6.0

package/Rendering/Core/Actor2D.d.ts

@@ -1,7 +1,7 @@
 import vtkProp, { IPropInitialValues } from './Prop';
 import vtkCoordinate from './Coordinate';
 import vtkMapper from './Mapper';
-import vtkProperty from './Property';
+import vtkProperty2D, { IProperty2DInitialValues } from './Property2D';
 import { Bounds } from './../../types';
 
 /**
@@ -9,7 +9,7 @@ import { Bounds } from './../../types';
  */
 export interface IActor2DInitialValues extends IPropInitialValues {
 	mapper?: vtkMapper;
-	property?: vtkProperty;
+	property?: vtkProperty2D;
 	layerNumber?: number;
 	positionCoordinate?: vtkCoordinate;
 	positionCoordinate2?: vtkCoordinate;
@@ -31,12 +31,18 @@ export interface vtkActor2D extends vtkProp {
 
 	/**
 	 * Return the property object that controls this actors surface
-	 * properties. This should be an instance of a vtkProperty object. Every
+	 * properties. This should be an instance of a vtkProperty2D object. Every
 	 * actor must have a property associated with it. If one isn’t specified,
 	 * then one will be generated automatically. Multiple actors can share one
 	 * property object.
 	 */
-	getProperty(): vtkProperty;
+	getProperty(): vtkProperty2D;
+
+	/**
+	 * Create a new property suitable for use with this type of Actor.
+	 * @param {IProperty2DInitialValues} [initialValues] (default: {})
+	 */
+	 makeProperty(initialValues?: IProperty2DInitialValues): vtkProperty2D;
 
 	/**
 	 * 
@@ -112,8 +118,8 @@ export function newInstance(initialValues?: IActor2DInitialValues): vtkActor2D;
  * vtkProp. The actor also has scaling and maintains a reference to the
  * defining geometry (i.e., the mapper), rendering properties, and possibly a
  * texture map.
- * @see [vtkMapper](./Rendering_Core_Mapper.html)2D
- * @see [vtkProperty](./Rendering_Core_Property.html)2D 
+ * @see [vtkMapper2D](./Rendering_Core_Mapper2D.html)
+ * @see [vtkProperty2D](./Rendering_Core_Property2D.html)
  */
 export declare const vtkActor2D: {
 	newInstance: typeof newInstance,

package/Rendering/Core/ColorTransferFunction/ColorMaps.d.ts

@@ -0,0 +1,24 @@
+/**
+ * vtkColorMaps represents a global registry of preset color maps.
+ */
+
+import { Vector3 } from '../../../types';
+
+export interface IColorMapPreset {
+  Name: string;
+  Creator?: string;
+  ColorSpace?: string;
+  NanColor?: Vector3;
+  RGBPoints: number[];
+  IndexedColors?: number[];
+  Annotations?: (number | string)[];
+}
+
+export declare const vtkColorMaps: {
+  addPreset(preset: IColorMapPreset): void;
+  removePresetByName(name: string): void;
+  getPresetByName(name: string): IColorMapPreset;
+  rgbPresetNames: string[];
+};
+
+export default vtkColorMaps;

package/Rendering/Core/Property2D.d.ts

@@ -2,7 +2,7 @@ import { vtkObject } from './../../interfaces';
 import { RGBColor } from './../../types';
 import { DisplayLocation } from './Property2D/Constants';
 
-interface IProperty2DInitialValues{
+export interface IProperty2DInitialValues{
 	color?: RGBColor;
 	opacity?: number;
 	pointSize?: number;

package/Rendering/Core/VolumeProperty.d.ts

@@ -5,7 +5,7 @@ import { InterpolationType, OpacityMode } from './VolumeProperty/Constants';
 
 export interface IVolumePropertyInitialValues  {
 	independentComponents?: boolean;
-	shade?: number;
+	shade?: boolean;
 	ambient?: number;
 	diffuse?: number;
 	specular?: number;
@@ -111,7 +111,7 @@ export interface vtkVolumeProperty extends vtkObject {
 	/**
 	 * Get the shading of a volume.
 	 */
-	getShade(): number;
+	getShade(): boolean;
 
 	/**
 	 *
@@ -236,9 +236,9 @@ export interface vtkVolumeProperty extends vtkObject {
 	 * turning shading off is generally the same as setting ambient=1,
 	 * diffuse=0, specular=0. Shading can be independently turned on/off per
 	 * component.
-	 * @param {Number} shade 
+	 * @param {Boolean} shade
 	 */
-	setShade(shade: number): boolean;
+	setShade(shade: boolean): boolean;
 
 	/**
 	 *

package/Rendering/Core/VolumeProperty.js

@@ -237,7 +237,7 @@ function vtkVolumeProperty(publicAPI, model) {
 var DEFAULT_VALUES = {
   independentComponents: true,
   interpolationType: InterpolationType.FAST_LINEAR,
-  shade: 0,
+  shade: false,
   ambient: 0.1,
   diffuse: 0.7,
   specular: 0.2,

package/Rendering/WebGPU/ForwardPass.js

@@ -1,8 +1,14 @@
 import macro from '../../macros.js';
+import vtkWebGPUFullScreenQuad from './FullScreenQuad.js';
 import vtkWebGPUOpaquePass from './OpaquePass.js';
 import vtkWebGPUOrderIndepenentTranslucentPass from './OrderIndependentTranslucentPass.js';
+import vtkWebGPURenderEncoder from './RenderEncoder.js';
 import vtkWebGPUVolumePass from './VolumePass.js';
 import vtkRenderPass from '../SceneGraph/RenderPass.js';
+import vtkWebGPUSampler from './Sampler.js';
+import vtkWebGPUTextureView from './TextureView.js';
+
+var finalBlitFragTemplate = "\n//VTK::Mapper::Dec\n\n//VTK::TCoord::Dec\n\n//VTK::RenderEncoder::Dec\n\n//VTK::IOStructs::Dec\n\n@fragment\nfn main(\n//VTK::IOStructs::Input\n)\n//VTK::IOStructs::Output\n{\n  var output: fragmentOutput;\n\n  var computedColor: vec4<f32> = clamp(textureSampleLevel(opaquePassColorTexture, finalPassSampler, input.tcoordVS, 0),vec4<f32>(0.0),vec4<f32>(1.0));\n\n  //VTK::RenderEncoder::Impl\n  return output;\n}\n"; // ----------------------------------------------------------------------------
 
 function vtkForwardPass(publicAPI, model) {
   // Set our className
@@ -69,24 +75,96 @@ function vtkForwardPass(publicAPI, model) {
             model.volumePass.setDepthTextureView(model.opaquePass.getDepthTextureView());
             model.volumePass.setVolumes(model.volumes);
             model.volumePass.traverse(renNode, viewNode);
-          }
+          } // blit the result into the swap chain
+
+
+          publicAPI.finalPass(viewNode, renNode);
         }
       }
-    } // blit the result into the swap chain
-
-
-    var sctex = viewNode.getCurrentTexture();
-    var optex = model.opaquePass.getColorTexture();
-    var cmdEnc = viewNode.getCommandEncoder();
-    cmdEnc.copyTextureToTexture({
-      texture: optex.getHandle()
-    }, {
-      texture: sctex
-    }, {
-      width: optex.getWidth(),
-      height: optex.getHeight(),
-      depthOrArrayLayers: 1
+    }
+  };
+
+  publicAPI.finalPass = function (viewNode, renNode) {
+    if (!model._finalBlitEncoder) {
+      publicAPI.createFinalBlitEncoder(viewNode);
+    }
+
+    model._finalBlitOutputTextureView.createFromTextureHandle(viewNode.getCurrentTexture(), {
+      depth: 1,
+      format: viewNode.getPresentationFormat()
+    });
+
+    model._finalBlitEncoder.attachTextureViews();
+
+    model._finalBlitEncoder.begin(viewNode.getCommandEncoder());
+
+    renNode.scissorAndViewport(model._finalBlitEncoder);
+
+    model._fullScreenQuad.prepareAndDraw(model._finalBlitEncoder);
+
+    model._finalBlitEncoder.end();
+  };
+
+  publicAPI.createFinalBlitEncoder = function (viewNode) {
+    model._finalBlitEncoder = vtkWebGPURenderEncoder.newInstance({
+      label: 'forwardPassBlit'
+    });
+
+    model._finalBlitEncoder.setDescription({
+      colorAttachments: [{
+        view: null,
+        loadOp: 'load',
+        storeOp: 'store'
+      }]
+    });
+
+    model._finalBlitEncoder.setPipelineHash('fpf');
+
+    model._finalBlitEncoder.setPipelineSettings({
+      primitive: {
+        cullMode: 'none'
+      },
+      fragment: {
+        targets: [{
+          format: viewNode.getPresentationFormat(),
+          blend: {
+            color: {
+              srcFactor: 'src-alpha',
+              dstFactor: 'one-minus-src-alpha'
+            },
+            alpha: {
+              srcfactor: 'one',
+              dstFactor: 'one-minus-src-alpha'
+            }
+          }
+        }]
+      }
+    });
+
+    model._fsqSampler = vtkWebGPUSampler.newInstance({
+      label: 'finalPassSampler'
+    });
+
+    model._fsqSampler.create(viewNode.getDevice(), {
+      minFilter: 'linear',
+      magFilter: 'linear'
     });
+
+    model._fullScreenQuad = vtkWebGPUFullScreenQuad.newInstance();
+
+    model._fullScreenQuad.setDevice(viewNode.getDevice());
+
+    model._fullScreenQuad.setPipelineHash('fpfsq');
+
+    model._fullScreenQuad.setTextureViews([model.opaquePass.getColorTextureView()]);
+
+    model._fullScreenQuad.setAdditionalBindables([model._fsqSampler]);
+
+    model._fullScreenQuad.setFragmentShaderTemplate(finalBlitFragTemplate);
+
+    model._finalBlitOutputTextureView = vtkWebGPUTextureView.newInstance();
+
+    model._finalBlitEncoder.setColorTextureView(0, model._finalBlitOutputTextureView);
   };
 
   publicAPI.incrementOpaqueActorCount = function () {

package/Rendering/WebGPU/OpaquePass.js

@@ -27,7 +27,7 @@ function vtkWebGPUOpaquePass(publicAPI, model) {
       model.colorTexture.create(device, {
         width: viewNode.getCanvas().width,
         height: viewNode.getCanvas().height,
-        format: 'bgra8unorm',
+        format: 'rgba16float',
 
         /* eslint-disable no-undef */
 

package/Rendering/WebGPU/OrderIndependentTranslucentPass.js

@@ -184,7 +184,7 @@ function vtkWebGPUOrderIndependentTranslucentPass(publicAPI, model) {
       },
       fragment: {
         targets: [{
-          format: 'bgra8unorm',
+          format: 'rgba16float',
           blend: {
             color: {
               srcFactor: 'src-alpha',

package/Rendering/WebGPU/RenderEncoder.js

@@ -51,9 +51,11 @@ function vtkWebGPURenderEncoder(publicAPI, model) {
       console.trace();
     } else {
       for (var i = 0; i < model.colorTextureViews.length; i++) {
-        var fmt = model.colorTextureViews[i].getTexture().getFormat();
+        var _model$colorTextureVi;
 
-        if (fmt !== pd.fragment.targets[i].format) {
+        var fmt = (_model$colorTextureVi = model.colorTextureViews[i].getTexture()) === null || _model$colorTextureVi === void 0 ? void 0 : _model$colorTextureVi.getFormat();
+
+        if (fmt && fmt !== pd.fragment.targets[i].format) {
           console.log("mismatched attachments for attachment ".concat(i, " on pipeline ").concat(pd.fragment.targets[i].format, " while encoder has ").concat(fmt));
           console.trace();
         }
@@ -65,9 +67,11 @@ function vtkWebGPURenderEncoder(publicAPI, model) {
       console.log('mismatched depth attachments');
       console.trace();
     } else if (model.depthTextureView) {
-      var dfmt = model.depthTextureView.getTexture().getFormat();
+      var _model$depthTextureVi;
+
+      var dfmt = (_model$depthTextureVi = model.depthTextureView.getTexture()) === null || _model$depthTextureVi === void 0 ? void 0 : _model$depthTextureVi.getFormat();
 
-      if (dfmt !== pd.depthStencil.format) {
+      if (dfmt && dfmt !== pd.depthStencil.format) {
         console.log("mismatched depth attachments on pipeline ".concat(pd.depthStencil.format, " while encoder has ").concat(dfmt));
         console.trace();
       }
@@ -202,7 +206,7 @@ function extend(publicAPI, model) {
     },
     fragment: {
       targets: [{
-        format: 'bgra8unorm',
+        format: 'rgba16float',
         blend: {
           color: {
             srcFactor: 'src-alpha',

package/Rendering/WebGPU/RenderWindow.js

@@ -9,6 +9,7 @@ import vtkWebGPUHardwareSelector from './HardwareSelector.js';
 import vtkWebGPUViewNodeFactory from './ViewNodeFactory.js';
 import vtkRenderPass from '../SceneGraph/RenderPass.js';
 import vtkRenderWindowViewNode from '../SceneGraph/RenderWindowViewNode.js';
+import HalfFloat from '../../Common/Core/HalfFloat.js';
 
 var vtkErrorMacro = macro.vtkErrorMacro; // const IS_CHROME = navigator.userAgent.indexOf('Chrome') !== -1;
 
@@ -67,14 +68,14 @@ function vtkWebGPURenderWindow(publicAPI, model) {
   publicAPI.recreateSwapChain = function () {
     if (model.context) {
       model.context.unconfigure();
-      var presentationFormat = navigator.gpu.getPreferredCanvasFormat(model.adapter);
+      model.presentationFormat = navigator.gpu.getPreferredCanvasFormat(model.adapter);
       /* eslint-disable no-undef */
 
       /* eslint-disable no-bitwise */
 
       model.context.configure({
         device: model.device.getHandle(),
-        format: presentationFormat,
+        format: model.presentationFormat,
         alphaMode: 'premultiplied',
         usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.COPY_DST,
         width: model.size[0],
@@ -545,10 +546,10 @@ function vtkWebGPURenderWindow(publicAPI, model) {
             result = {
               width: texture.getWidth(),
               height: texture.getHeight()
-            }; // must be a multiple of 256 bytes, so 64 texels with rgba8
+            }; // must be a multiple of 256 bytes, so 32 texels with rgba16
 
-            result.colorBufferWidth = 64 * Math.floor((result.width + 63) / 64);
-            result.colorBufferSizeInBytes = result.colorBufferWidth * result.height * 4;
+            result.colorBufferWidth = 32 * Math.floor((result.width + 31) / 32);
+            result.colorBufferSizeInBytes = result.colorBufferWidth * result.height * 8;
             colorBuffer = vtkWebGPUBuffer.newInstance();
             colorBuffer.setDevice(device);
             /* eslint-disable no-bitwise */
@@ -565,7 +566,7 @@ function vtkWebGPURenderWindow(publicAPI, model) {
               texture: texture.getHandle()
             }, {
               buffer: colorBuffer.getHandle(),
-              bytesPerRow: 4 * result.colorBufferWidth,
+              bytesPerRow: 8 * result.colorBufferWidth,
               rowsPerImage: result.height
             }, {
               width: result.width,
@@ -581,7 +582,7 @@ function vtkWebGPURenderWindow(publicAPI, model) {
 
           case 14:
             /* eslint-enable no-undef */
-            result.colorValues = new Uint8ClampedArray(colorBuffer.getMappedRange().slice());
+            result.colorValues = new Uint16Array(colorBuffer.getMappedRange().slice());
             colorBuffer.unmap(); // repack the array
 
             tmparray = new Uint8ClampedArray(result.height * result.width * 4);
@@ -590,10 +591,10 @@ function vtkWebGPURenderWindow(publicAPI, model) {
               for (x = 0; x < result.width; x++) {
                 doffset = (y * result.width + x) * 4;
                 soffset = (y * result.colorBufferWidth + x) * 4;
-                tmparray[doffset] = result.colorValues[soffset + 2];
-                tmparray[doffset + 1] = result.colorValues[soffset + 1];
-                tmparray[doffset + 2] = result.colorValues[soffset];
-                tmparray[doffset + 3] = result.colorValues[soffset + 3];
+                tmparray[doffset] = 255.0 * HalfFloat.fromHalf(result.colorValues[soffset]);
+                tmparray[doffset + 1] = 255.0 * HalfFloat.fromHalf(result.colorValues[soffset + 1]);
+                tmparray[doffset + 2] = 255.0 * HalfFloat.fromHalf(result.colorValues[soffset + 2]);
+                tmparray[doffset + 3] = 255.0 * HalfFloat.fromHalf(result.colorValues[soffset + 3]);
               }
             }
 
@@ -635,7 +636,8 @@ var DEFAULT_VALUES = {
   useOffScreen: false,
   useBackgroundImage: false,
   nextPropID: 1,
-  xrSupported: false
+  xrSupported: false,
+  presentationFormat: null
 }; // ----------------------------------------------------------------------------
 
 function extend(publicAPI, model) {
@@ -671,7 +673,7 @@ function extend(publicAPI, model) {
   macro.event(publicAPI, model, 'imageReady');
   macro.event(publicAPI, model, 'initialized'); // Build VTK API
 
-  macro.get(publicAPI, model, ['commandEncoder', 'device', 'useBackgroundImage', 'xrSupported']);
+  macro.get(publicAPI, model, ['commandEncoder', 'device', 'presentationFormat', 'useBackgroundImage', 'xrSupported']);
   macro.setGet(publicAPI, model, ['initialized', 'context', 'canvas', 'device', 'renderPasses', 'notifyStartCaptureImage', 'cursor', 'useOffScreen']);
   macro.setGetArray(publicAPI, model, ['size'], 2); // Object methods
 

package/Rendering/WebGPU/TextureView.js

@@ -23,6 +23,19 @@ function vtkWebGPUTextureView(publicAPI, model) {
     model.bindGroupLayoutEntry.texture.sampleType = tDetails.sampleType;
   };
 
+  publicAPI.createFromTextureHandle = function (textureHandle, options) {
+    model.texture = null;
+    model.options = options;
+    model.options.dimension = model.options.dimension || '2d';
+    model.options.label = model.label;
+    model.textureHandle = textureHandle;
+    model.handle = model.textureHandle.createView(model.options);
+    model.bindGroupLayoutEntry.texture.viewDimension = model.options.dimension;
+    var tDetails = vtkWebGPUTypes.getDetailsFromTextureFormat(options.format);
+    model.bindGroupLayoutEntry.texture.sampleType = tDetails.sampleType;
+    model.bindGroupTime.modified();
+  };
+
   publicAPI.getBindGroupEntry = function () {
     var foo = {
       resource: publicAPI.getHandle()
@@ -58,7 +71,7 @@ function vtkWebGPUTextureView(publicAPI, model) {
 
   publicAPI.getBindGroupTime = function () {
     // check if the handle changed
-    if (model.texture.getHandle() !== model.textureHandle) {
+    if (model.texture && model.texture.getHandle() !== model.textureHandle) {
       model.textureHandle = model.texture.getHandle();
       model.handle = model.textureHandle.createView(model.options);
       model.bindGroupTime.modified();
@@ -69,7 +82,7 @@ function vtkWebGPUTextureView(publicAPI, model) {
 
 
   publicAPI.getHandle = function () {
-    if (model.texture.getHandle() !== model.textureHandle) {
+    if (model.texture && model.texture.getHandle() !== model.textureHandle) {
       model.textureHandle = model.texture.getHandle();
       model.handle = model.textureHandle.createView(model.options);
       model.bindGroupTime.modified();

package/Rendering/WebGPU/VolumePass.js

@@ -560,7 +560,7 @@ function vtkWebGPUVolumePass(publicAPI, model) {
       },
       fragment: {
         targets: [{
-          format: 'bgra8unorm',
+          format: 'rgba16float',
           blend: {
             color: {
               srcFactor: 'one',

package/index.d.ts

@@ -103,6 +103,7 @@
 /// <reference path="./Rendering/Core/AxesActor.d.ts" />
 /// <reference path="./Rendering/Core/Camera.d.ts" />
 /// <reference path="./Rendering/Core/CellPicker.d.ts" />
+/// <reference path="./Rendering/Core/ColorTransferFunction/ColorMaps.d.ts" />
 /// <reference path="./Rendering/Core/ColorTransferFunction/Constants.d.ts" />
 /// <reference path="./Rendering/Core/ColorTransferFunction.d.ts" />
 /// <reference path="./Rendering/Core/Coordinate/Constants.d.ts" />

package/package.json

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