@kitware/vtk.js 30.0.0 → 30.1.1

package/BREAKING_CHANGES.md

@@ -1,7 +1,8 @@
 ## From 29.x to 30
 
-- **ResliceCursorWidget.interactionEvent**: no longer pass an object of computeFocalPointOffset, canUpdateFocalPoint but simply the type of the handle that triggers the event. Those values can easily be recomputed by the consumers of the event. Regarding `computeFocalPointOffset`, it is no longer adviced to compute focal point offset for each interaction, instead observing `startInteraction()` should be considered (see ResliceCursorWidget example).
-  - **ResliceCursorWidget.invokeInternalInteractionEvent(methodName)**: has been removed and should be replaced by `ResliceCursorWidget.invokeInteractionEvent(methodName)`.
+- **ResliceCursorWidget.interactionEvent**: no longer pass an object of `{computeFocalPointOffset, canUpdateFocalPoint}` but simply the type of the handle that triggers the event (e.g. `InteractionMethodsName.RotateLine`). The removed values can easily be recomputed by the consumers of the event by checking the type of the handle. Regarding `computeFocalPointOffset`, it is no longer advised to compute focal point offset for each interaction, instead observing `startInteraction()` should be considered (see ResliceCursorWidget example).
+- **ResliceCursorWidget.invokeInternalInteractionEvent(methodName)**: has been removed and should be replaced by `ResliceCursorWidget.invokeInteractionEvent(methodName)`.
+- **ResliceCursorWidget.updateCameraPoints(renderer, viewType, resetFocalPoint, keepCenterFocalDistance, computeFocalPointOffset)** has lost the `keepCenterFocalDistance` parameter (because it was ALWAYS the negate of `computeFocalPointOffset`). The new signature is `ResliceCursorWidget.updateCameraPoints(renderer, viewType, resetFocalPoint, keepCenterFocalDistance, computeFocalPointOffset)`
 
 ## From 28.x to 29
 

package/Interaction/Manipulators/3DControllerModelSelectorManipulator/index.js

@@ -0,0 +1,182 @@
+import { vec3, vec4, quat, mat4 } from 'gl-matrix';
+import vtkCompositeVRManipulator from '../CompositeVRManipulator.js';
+import vtkPicker from '../../../Rendering/Core/Picker.js';
+import { m as macro } from '../../../macros2.js';
+import { States } from '../../../Rendering/Core/InteractorStyle/Constants.js';
+
+// ----------------------------------------------------------------------------
+// vtk3DControllerModelSelectorManipulator methods
+// ----------------------------------------------------------------------------
+
+function vtk3DControllerModelSelectorManipulator(publicAPI, model) {
+  model.classHierarchy.push('vtk3DControllerModelSelectorManipulator');
+  const picker = vtkPicker.newInstance();
+
+  // The current prop we are manipulating, if any.
+  let pickedProp;
+
+  // pre-allocate array buffers
+  const physicalToWorldMatrix = new Float64Array(16);
+
+  // arrays holding deltas from lastWorldPosition and lastOrientation
+  const translation = new Float64Array(3);
+  const rotation = new Float64Array(4);
+  const lastOrientationConjugate = new Float64Array(4);
+  const orientationAxis = new Float64Array(3);
+
+  // arrays holding the transform
+  const computedTransform = new Float64Array(16);
+  const computedTransformRotation = new Float64Array(4);
+
+  // arrays holding the current state of pickedProp.
+  const transposedPropMatrix = new Float64Array(16);
+  const propCurrentOrientation = new Float64Array(4);
+  const propCurrentOrientationConjugate = new Float64Array(4);
+
+  // arrays holding the new properties that must be assigned to pickedProp.
+  const propNewTranslation = new Float64Array(3);
+  const propNewScaling = new Float64Array(3);
+  const propNewOrientation = new Float64Array(4);
+  function applyPositionAndOrientationToProp(prop, worldPosition, orientation) {
+    vec3.subtract(translation, worldPosition, model.lastWorldPosition);
+    quat.conjugate(lastOrientationConjugate, model.lastOrientation);
+    quat.multiply(rotation, orientation, lastOrientationConjugate);
+    quat.normalize(rotation, rotation);
+    const rotationAngle = quat.getAxisAngle(orientationAxis, rotation);
+
+    // reset to identity
+    mat4.identity(computedTransform);
+
+    // compute transform
+    mat4.translate(computedTransform, computedTransform, worldPosition);
+    mat4.rotate(computedTransform, computedTransform, rotationAngle, orientationAxis);
+    mat4.translate(computedTransform, computedTransform, vec3.negate(new Float64Array(3), worldPosition));
+    mat4.translate(computedTransform, computedTransform, translation);
+
+    // lookup the prop internal matrix
+    mat4.transpose(transposedPropMatrix, prop.getMatrix());
+    // apply the new computedTransform to the prop internal matrix
+    mat4.multiply(computedTransform, computedTransform, transposedPropMatrix);
+
+    // Multiply the computedTransform with the current prop orientation to get the delta
+    // that must be applied to the prop
+    mat4.getRotation(computedTransformRotation, computedTransform);
+    prop.getOrientationQuaternion(propCurrentOrientation);
+    quat.conjugate(propCurrentOrientationConjugate, propCurrentOrientation);
+    quat.multiply(propNewOrientation, propCurrentOrientationConjugate, computedTransformRotation);
+    quat.normalize(propNewOrientation, propNewOrientation);
+    mat4.getTranslation(propNewTranslation, computedTransform);
+    mat4.getScaling(propNewScaling, computedTransform);
+
+    // Update the prop internal matrix
+    prop.setPosition(...propNewTranslation);
+    prop.setScale(...propNewScaling);
+    prop.rotateQuaternion(propNewOrientation);
+  }
+  function releasePickedProp() {
+    model.lastOrientation = null;
+    model.lastWorldPosition = null;
+    if (pickedProp) {
+      pickedProp.setDragable(true);
+    }
+    pickedProp = null;
+  }
+  publicAPI.onButton3D = (interactorStyle, renderer, state, eventData) => {
+    // If the button is not pressed, clear the state
+    if (!eventData.pressed) {
+      releasePickedProp();
+      return macro.VOID;
+    }
+    const camera = renderer.getActiveCamera();
+    camera.getPhysicalToWorldMatrix(physicalToWorldMatrix);
+    const {
+      targetPosition,
+      targetOrientation
+    } = eventData;
+
+    // Since targetPosition is in physical coordinates,
+    // transform it using the physicalToWorldMatrix to get it in world coordinates
+    const targetRayWorldPosition = vec3.transformMat4([], [targetPosition.x, targetPosition.y, targetPosition.z], physicalToWorldMatrix);
+    const targetRayWorldDirection = camera.physicalOrientationToWorldDirection([targetOrientation.x, targetOrientation.y, targetOrientation.z, targetOrientation.w]);
+    const dist = renderer.getActiveCamera().getClippingRange()[1];
+    const rayPoint1 = [...targetRayWorldPosition, 1.0];
+    const rayPoint2 = [rayPoint1[0] - targetRayWorldDirection[0] * dist, rayPoint1[1] - targetRayWorldDirection[1] * dist, rayPoint1[2] - targetRayWorldDirection[2] * dist, 1.0];
+
+    // Perform picking on the given renderer
+    picker.pick3DPoint(rayPoint1, rayPoint2, renderer);
+    const props = picker.getActors();
+
+    // If we have picked props, store the first one.
+    if (props.length > 0 && props[0].getNestedDragable()) {
+      pickedProp = props[0];
+
+      // prevent the prop from being dragged somewhere else
+      pickedProp.setDragable(false);
+    } else {
+      releasePickedProp();
+    }
+    return macro.EVENT_ABORT;
+  };
+
+  // pre-allocation to reduce gc in onMove3D
+  const currentTargetRayWorldPosition = new Float64Array(3);
+  const currentTargetRayOrientation = new Float64Array(4);
+  publicAPI.onMove3D = (interactorStyle, renderer, state, eventData) => {
+    // If we are not interacting with any prop, we have nothing to do.
+    // Also check for dragable
+    if (state !== States.IS_CAMERA_POSE || pickedProp == null) {
+      return macro.VOID;
+    }
+    const camera = renderer.getActiveCamera();
+    camera.getPhysicalToWorldMatrix(physicalToWorldMatrix);
+    const {
+      targetPosition
+    } = eventData;
+    vec3.transformMat4(currentTargetRayWorldPosition, [targetPosition.x, targetPosition.y, targetPosition.z], physicalToWorldMatrix);
+
+    // this is a unit quaternion
+    vec4.set(currentTargetRayOrientation, eventData.targetOrientation.x, eventData.targetOrientation.y, eventData.targetOrientation.z, eventData.targetOrientation.w);
+    if (model.lastWorldPosition && model.lastOrientation) {
+      applyPositionAndOrientationToProp(pickedProp, currentTargetRayWorldPosition, currentTargetRayOrientation);
+    } else {
+      // allocate
+      model.lastWorldPosition = new Float64Array(3);
+      model.lastOrientation = new Float64Array(4);
+    }
+    vec3.copy(model.lastWorldPosition, currentTargetRayWorldPosition);
+    vec4.copy(model.lastOrientation, currentTargetRayOrientation);
+    return macro.EVENT_ABORT;
+  };
+}
+
+// ----------------------------------------------------------------------------
+// Object factory
+// ----------------------------------------------------------------------------
+
+const DEFAULT_VALUES = {};
+
+// ----------------------------------------------------------------------------
+
+function extend(publicAPI, model) {
+  let initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  Object.assign(model, DEFAULT_VALUES, initialValues);
+  macro.get(publicAPI, model, ['lastWorldPosition', 'lastOrientation']);
+  macro.obj(publicAPI, model);
+  vtkCompositeVRManipulator.extend(publicAPI, model, initialValues);
+
+  // Object specific methods
+  vtk3DControllerModelSelectorManipulator(publicAPI, model);
+}
+
+// ----------------------------------------------------------------------------
+
+const newInstance = macro.newInstance(extend, 'vtk3DControllerModelSelectorManipulator');
+
+// ----------------------------------------------------------------------------
+
+var vtk3DControllerModelSelectorManipulator$1 = {
+  newInstance,
+  extend
+};
+
+export { vtk3DControllerModelSelectorManipulator$1 as default, extend, newInstance };

package/Interaction/Manipulators/3DControllerModelSelectorManipulator.d.ts

@@ -0,0 +1,19 @@
+import vtkCompositeVRManipulator from './CompositeVRManipulator';
+
+export interface vtk3DControllerModelSelectorManipulator
+  extends vtkCompositeVRManipulator {}
+
+export interface I3DControllerModelSelectorManipulatorInitialValues
+  extends vtkCompositeVRManipulator {}
+
+export function extend(
+  publicAPI: object,
+  model: object,
+  initialValues?: I3DControllerModelSelectorManipulatorInitialValues
+): void;
+
+export const vtk3DControllerModelSelectorManipulator: {
+  extend: typeof extend;
+};
+
+export default vtk3DControllerModelSelectorManipulator;

package/Interaction/Manipulators/CompositeVRManipulator.d.ts

@@ -1,28 +1,28 @@
 import { States } from './../../Rendering/Core/InteractorStyle/Constants';
 import vtkRenderer from './../../Rendering/Core/Renderer';
-import vtkRenderWindowInteractor from './../../Rendering/Core/RenderWindowInteractor';
+import vtkInteractorObserver from './../../Rendering/Core/InteractorObserver';
 import {
   Device,
   Input,
 } from './../../Rendering/Core/RenderWindowInteractor/Constants';
+import {
+  I3DEvent,
+  IButton3DEvent,
+} from './../../Rendering/Core/RenderWindowInteractor';
 
 export interface vtkCompositeVRManipulator {
   onButton3D(
-    interactor: vtkRenderWindowInteractor,
+    interactorStyle: vtkInteractorObserver,
     renderer: vtkRenderer,
     state: States,
-    device: Device,
-    input: Input,
-    pressed: boolean
+    eventData: IButton3DEvent
   ): void;
 
   onMove3D(
-    interactor: vtkRenderWindowInteractor,
+    interactorStyle: vtkInteractorObserver,
     renderer: vtkRenderer,
     state: States,
-    device: Device,
-    input: Input,
-    pressed: boolean
+    eventData: I3DEvent
   ): void;
 }
 

package/Interaction/Manipulators/CompositeVRManipulator.js

@@ -8,8 +8,8 @@ import { Device, Input } from '../../Rendering/Core/RenderWindowInteractor/Const
 function vtkCompositeVRManipulator(publicAPI, model) {
   // Set our className
   model.classHierarchy.push('vtkCompositeVRManipulator');
-  publicAPI.onButton3D = (interactor, renderer, state, device, input, pressed) => {};
-  publicAPI.onMove3D = (interactor, renderer, state, device, input, pressed) => {};
+  publicAPI.onButton3D = (interactorStyle, renderer, state, eventData) => {};
+  publicAPI.onMove3D = (interactorStyle, renderer, state, eventData) => {};
 }
 
 // ----------------------------------------------------------------------------

package/Interaction/Manipulators/VRButtonPanManipulator.js

@@ -10,14 +10,14 @@ import { States } from '../../Rendering/Core/InteractorStyle/Constants.js';
 function vtkVRButtonPanManipulator(publicAPI, model) {
   // Set our className
   model.classHierarchy.push('vtkVRButtonPanManipulator');
-  publicAPI.onButton3D = (interactorStyle, renderer, state, device, input, pressed) => {
-    if (pressed) {
+  publicAPI.onButton3D = (interactorStyle, renderer, state, eventData) => {
+    if (eventData.pressed) {
       interactorStyle.startCameraPose();
     } else if (state === States.IS_CAMERA_POSE) {
       interactorStyle.endCameraPose();
     }
   };
-  publicAPI.onMove3D = (interactorStyle, renderer, state, data) => {
+  publicAPI.onMove3D = (interactorStyle, renderer, state, eventData) => {
     if (state !== States.IS_CAMERA_POSE) {
       return;
     }
@@ -28,13 +28,13 @@ function vtkVRButtonPanManipulator(publicAPI, model) {
     const oldTrans = camera.getPhysicalTranslation();
 
     // look at the y axis to determine how fast / what direction to move
-    const speed = data.gamepad.axes[1];
+    const speed = eventData.gamepad.axes[1];
 
     // 0.05 meters / frame movement
     const pscale = speed * 0.05 * camera.getPhysicalScale();
 
     // convert orientation to world coordinate direction
-    const dir = camera.physicalOrientationToWorldDirection(data.orientation);
+    const dir = camera.physicalOrientationToWorldDirection(eventData.orientation);
     camera.setPhysicalTranslation(oldTrans[0] + dir[0] * pscale, oldTrans[1] + dir[1] * pscale, oldTrans[2] + dir[2] * pscale);
   };
 }

package/Interaction/Style/InteractorStyleHMDXR.d.ts

@@ -0,0 +1,22 @@
+import vtkInteractorStyleManipulator, { IInteractorStyleManipulatorInitialValues } from './InteractorStyleManipulator';
+
+export interface vtkInteractorStyleHMDXR extends vtkInteractorStyleManipulator {}
+
+export interface IInteractorStyleHMDXRInitialValues extends IInteractorStyleManipulatorInitialValues {}
+
+export function newInstance(
+  initialValues?: IInteractorStyleHMDXRInitialValues
+): vtkInteractorStyleHMDXR;
+
+export function extend(
+  publicAPI: object,
+  model: object,
+  initialValues?: IInteractorStyleHMDXRInitialValues
+): void;
+
+export const vtkInteractorStyleHMDXR: {
+  newInstance: typeof newInstance;
+  extend: typeof extend;
+};
+
+export default vtkInteractorStyleHMDXR;

package/Interaction/Style/InteractorStyleHMDXR.js

@@ -0,0 +1,50 @@
+import { m as macro } from '../../macros2.js';
+import vtkInteractorStyleManipulator from './InteractorStyleManipulator.js';
+import vtk3DControllerModelSelectorManipulator from '../Manipulators/3DControllerModelSelectorManipulator/index.js';
+import { Device, Input } from '../../Rendering/Core/RenderWindowInteractor/Constants.js';
+
+function vtkInteractorStyleHMDXR(publicAPI, model) {
+  model.classHierarchy.push('vtkInteractorStyleHMDXR');
+  const leftHandManipulator = vtk3DControllerModelSelectorManipulator.newInstance({
+    device: Device.LeftController,
+    input: Input.A
+  });
+  const rightHandManipulator = vtk3DControllerModelSelectorManipulator.newInstance({
+    device: Device.RightController,
+    input: Input.A
+  });
+  publicAPI.addVRManipulator(leftHandManipulator);
+  publicAPI.addVRManipulator(rightHandManipulator);
+}
+
+// ----------------------------------------------------------------------------
+// Object factory
+// ----------------------------------------------------------------------------
+
+const DEFAULT_VALUES = {};
+
+// ----------------------------------------------------------------------------
+
+function extend(publicAPI, model) {
+  let initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+  Object.assign(model, DEFAULT_VALUES, initialValues);
+
+  // Inheritance
+  vtkInteractorStyleManipulator.extend(publicAPI, model, initialValues);
+
+  // Object specific methods
+  vtkInteractorStyleHMDXR(publicAPI, model);
+}
+
+// ----------------------------------------------------------------------------
+
+const newInstance = macro.newInstance(extend, 'vtkInteractorStyleHMDXR');
+
+// ----------------------------------------------------------------------------
+
+var index = {
+  newInstance,
+  extend
+};
+
+export { index as default, extend, newInstance };

package/Interaction/Style/InteractorStyleManipulator.js

@@ -118,6 +118,7 @@ const STATIC = {
 function vtkInteractorStyleManipulator(publicAPI, model) {
   // Set our className
   model.classHierarchy.push('vtkInteractorStyleManipulator');
+  model.currentVRManipulators = new Map();
   model.mouseManipulators = [];
   model.keyboardManipulators = [];
   model.vrManipulators = [];
@@ -246,13 +247,20 @@ function vtkInteractorStyleManipulator(publicAPI, model) {
     }
 
     // Look for a matching 3D camera interactor.
-    model.currentManipulator = publicAPI.findVRManipulator(ed.device, ed.input, ed.pressed);
-    if (model.currentManipulator) {
-      model.currentManipulator.onButton3D(publicAPI, ed.pokedRenderer, model.state, ed.device, ed.input, ed.pressed);
+    const manipulator = publicAPI.findVRManipulator(ed.device, ed.input, ed.pressed);
+    if (manipulator) {
+      // register the manipulator for this device
+      model.currentVRManipulators.set(ed.device, manipulator);
+      manipulator.onButton3D(publicAPI, ed.pokedRenderer, model.state, ed);
       if (ed.pressed) {
         publicAPI.startCameraPose();
       } else {
-        publicAPI.endCameraPose();
+        model.currentVRManipulators.delete(ed.device);
+
+        // make sure we don't end camera pose if other VR manipulators are currently interacting
+        if (model.currentVRManipulators.size === 0) {
+          publicAPI.endCameraPose();
+        }
       }
     } else {
       vtkDebugMacro('No manipulator found');
@@ -261,8 +269,9 @@ function vtkInteractorStyleManipulator(publicAPI, model) {
 
   //-------------------------------------------------------------------------
   publicAPI.handleMove3D = ed => {
-    if (model.currentManipulator && model.state === States.IS_CAMERA_POSE) {
-      model.currentManipulator.onMove3D(publicAPI, ed.pokedRenderer, model.state, ed);
+    const manipulator = model.currentVRManipulators.get(ed.device);
+    if (manipulator && model.state === States.IS_CAMERA_POSE) {
+      manipulator.onMove3D(publicAPI, ed.pokedRenderer, model.state, ed);
     }
   };
 
@@ -576,7 +585,7 @@ function vtkInteractorStyleManipulator(publicAPI, model) {
 // Object factory
 // ----------------------------------------------------------------------------
 
-const DEFAULT_VALUES = {
+const defaultValues = initialValues => ({
   cachedMousePosition: null,
   currentManipulator: null,
   currentWheelManipulator: null,
@@ -585,14 +594,15 @@ const DEFAULT_VALUES = {
   // vrManipulators: null,
   // gestureManipulators: null,
   centerOfRotation: [0, 0, 0],
-  rotationFactor: 1
-};
+  rotationFactor: 1,
+  ...initialValues
+});
 
 // ----------------------------------------------------------------------------
 
 function extend(publicAPI, model) {
   let initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  Object.assign(model, DEFAULT_VALUES, initialValues);
+  Object.assign(model, defaultValues(initialValues));
 
   // Inheritance
   vtkInteractorStyle.extend(publicAPI, model, initialValues);

package/Rendering/Core/Prop3D.d.ts

@@ -1,4 +1,4 @@
-import { mat4 } from "gl-matrix";
+import { mat4, quat } from "gl-matrix";
 import { Bounds, Vector3, Range } from './../../types';
 import vtkProp, { IPropInitialValues } from './Prop';
 
@@ -88,6 +88,13 @@ export interface vtkProp3D extends vtkProp {
 	 */
 	getOrientationWXYZ(): number[];
 
+	/**
+	 * Get the orientation quaternion of the Prop3D.
+	 * out is optional and will be created if not supplied.
+	 * @param {quat | undefined} out
+	 */
+	getOrientationQuaternion(out?: quat): quat;
+
 	/**
 	 * Get a reference to the Prop3D’s 4x4 composite matrix.
 	 * Get the matrix from the position, origin, scale and orientation This
@@ -167,6 +174,14 @@ export interface vtkProp3D extends vtkProp {
 	 */
 	rotateWXYZ(degrees: number, x: number, y: number, z: number): void;
 
+	/**
+	 * Rotate the Prop3D by the provided orientation quaternion.
+	 * If the provided quaternion is identity (~epsilon), this function does nothing.
+	 * The quaternion should follow the gl-matrix convention: [x,y,z,w]
+	 * @param {quat} orientationQuaternion The quaternion to rotate the prop by.
+	 */
+	rotateQuaternion(orientationQuaternion: quat): void;
+
 	/**
 	 * Orientation is specified as X, Y and Z rotations in that order,
 	 * but they are performed as RotateZ, RotateX, and finally RotateY.

package/Rendering/Core/Prop3D.js

@@ -4,6 +4,8 @@ import vtkBoundingBox from '../../Common/DataModel/BoundingBox.js';
 import { A as degreesFromRadians, r as radiansFromDegrees, a as areMatricesEqual } from '../../Common/Core/Math/index.js';
 import vtkProp from './Prop.js';
 
+const VTK_EPSILON = 1e-6;
+
 // ----------------------------------------------------------------------------
 // vtkProp3D methods
 // ----------------------------------------------------------------------------
@@ -22,6 +24,10 @@ function vtkProp3D(publicAPI, model) {
     const w = quat.getAxisAngle(oaxis, q);
     return [degreesFromRadians(w), oaxis[0], oaxis[1], oaxis[2]];
   };
+  publicAPI.getOrientationQuaternion = function () {
+    let out = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    return mat4.getRotation(out, model.rotation);
+  };
   publicAPI.rotateX = val => {
     if (val === 0.0) {
       return;
@@ -57,6 +63,14 @@ function vtkProp3D(publicAPI, model) {
     mat4.multiply(model.rotation, model.rotation, quatMat);
     publicAPI.modified();
   };
+  publicAPI.rotateQuaternion = orientationQuaternion => {
+    if (Math.abs(orientationQuaternion[3]) >= 1 - VTK_EPSILON) {
+      return;
+    }
+    const oriQuatMat = mat4.fromQuat(new Float64Array(16), orientationQuaternion);
+    mat4.multiply(model.rotation, model.rotation, oriQuatMat);
+    publicAPI.modified();
+  };
   publicAPI.setOrientation = (x, y, z) => {
     if (x === model.orientation[0] && y === model.orientation[1] && z === model.orientation[2]) {
       return false;

package/Rendering/Core/RenderWindowInteractor.d.ts

@@ -81,6 +81,20 @@ export interface IRenderWindowInteractorEvent {
 	type: InteractorEventType;
 }
 
+export interface I3DEvent {
+	gamepad: Gamepad;
+	position: DOMPointReadOnly;
+	orientation: DOMPointReadOnly;
+	targetPosition: DOMPointReadOnly;
+	targetOrientation: DOMPointReadOnly;
+	device: Device;
+}
+
+export interface IButton3DEvent extends I3DEvent {
+	pressed: boolean;
+	input: Input;
+}
+
 export interface vtkRenderWindowInteractor extends vtkObject {
 
 	/**
@@ -678,10 +692,11 @@ export interface vtkRenderWindowInteractor extends vtkObject {
 	animationEvent(args: any): any;
 
 	/**
-	 *
+	 * Triggers the 'Button3D' event.
+	 * 
 	 * @param args
 	 */
-	button3DEvent(args: any): any;
+	button3DEvent(eventPayload: IButton3DEvent): void;
 
 	/**
 	 *
@@ -804,10 +819,11 @@ export interface vtkRenderWindowInteractor extends vtkObject {
 	mouseWheelEvent(args: any): any;
 
 	/**
-	 *
-	 * @param args
+	 * Triggers the 'Move3D' event.
+	 * 
+	 * @param eventPayload
 	 */
-	move3DEvent(args: any): any;
+	move3DEvent(eventPayload: I3DEvent): void;
 
 	/**
 	 *

package/Rendering/Core/RenderWindowInteractor.js

@@ -481,45 +481,51 @@ function vtkRenderWindowInteractor(publicAPI, model) {
     // watch for when buttons change state and fire events
     xrSession.inputSources.forEach(inputSource => {
       const gripPose = inputSource.gripSpace == null ? null : xrFrame.getPose(inputSource.gripSpace, xrRefSpace);
-      const gp = inputSource.gamepad;
+      const targetRayPose = inputSource.gripSpace == null ? null : xrFrame.getPose(inputSource.targetRaySpace, xrRefSpace);
+      const gamepad = inputSource.gamepad;
       const hand = inputSource.handedness;
-      if (gp) {
-        if (!(gp.index in model.lastGamepadValues)) {
-          model.lastGamepadValues[gp.index] = {
-            left: {
-              buttons: {}
-            },
-            right: {
-              buttons: {}
-            },
-            none: {
-              buttons: {}
-            }
-          };
-        }
-        for (let b = 0; b < gp.buttons.length; ++b) {
-          if (!(b in model.lastGamepadValues[gp.index][hand].buttons)) {
-            model.lastGamepadValues[gp.index][hand].buttons[b] = false;
-          }
-          if (model.lastGamepadValues[gp.index][hand].buttons[b] !== gp.buttons[b].pressed && gripPose != null) {
-            publicAPI.button3DEvent({
-              gamepad: gp,
-              position: gripPose.transform.position,
-              orientation: gripPose.transform.orientation,
-              pressed: gp.buttons[b].pressed,
-              device: inputSource.handedness === 'left' ? Device.LeftController : Device.RightController,
-              input: deviceInputMap[gp.mapping] && deviceInputMap[gp.mapping][b] ? deviceInputMap[gp.mapping][b] : Input.Trigger
-            });
-            model.lastGamepadValues[gp.index][hand].buttons[b] = gp.buttons[b].pressed;
-          }
-          if (model.lastGamepadValues[gp.index][hand].buttons[b] && gripPose != null) {
-            publicAPI.move3DEvent({
-              gamepad: gp,
-              position: gripPose.transform.position,
-              orientation: gripPose.transform.orientation,
-              device: inputSource.handedness === 'left' ? Device.LeftController : Device.RightController
-            });
+      if (!gamepad) {
+        return;
+      }
+      if (!(gamepad.index in model.lastGamepadValues)) {
+        model.lastGamepadValues[gamepad.index] = {
+          left: {
+            buttons: {}
+          },
+          right: {
+            buttons: {}
+          },
+          none: {
+            buttons: {}
           }
+        };
+      }
+      for (let buttonIdx = 0; buttonIdx < gamepad.buttons.length; ++buttonIdx) {
+        if (!(buttonIdx in model.lastGamepadValues[gamepad.index][hand].buttons)) {
+          model.lastGamepadValues[gamepad.index][hand].buttons[buttonIdx] = false;
+        }
+        if (model.lastGamepadValues[gamepad.index][hand].buttons[buttonIdx] !== gamepad.buttons[buttonIdx].pressed && gripPose != null) {
+          publicAPI.button3DEvent({
+            gamepad,
+            position: gripPose.transform.position,
+            orientation: gripPose.transform.orientation,
+            targetPosition: targetRayPose.transform.position,
+            targetOrientation: targetRayPose.transform.orientation,
+            pressed: gamepad.buttons[buttonIdx].pressed,
+            device: inputSource.handedness === 'left' ? Device.LeftController : Device.RightController,
+            input: deviceInputMap[gamepad.mapping] && deviceInputMap[gamepad.mapping][buttonIdx] ? deviceInputMap[gamepad.mapping][buttonIdx] : Input.Trigger
+          });
+          model.lastGamepadValues[gamepad.index][hand].buttons[buttonIdx] = gamepad.buttons[buttonIdx].pressed;
+        }
+        if (model.lastGamepadValues[gamepad.index][hand].buttons[buttonIdx] && gripPose != null) {
+          publicAPI.move3DEvent({
+            gamepad,
+            position: gripPose.transform.position,
+            orientation: gripPose.transform.orientation,
+            targetPosition: targetRayPose.transform.position,
+            targetOrientation: targetRayPose.transform.orientation,
+            device: inputSource.handedness === 'left' ? Device.LeftController : Device.RightController
+          });
         }
       }
     });

package/Rendering/WebXR/RenderWindowHelper.js

@@ -1,6 +1,10 @@
 import { m as macro } from '../../macros2.js';
 import Constants from './RenderWindowHelper/Constants.js';
+import vtkActor from '@kitware/vtk.js/Rendering/Core/Actor';
+import vtkLineSource from '@kitware/vtk.js/Filters/Sources/LineSource';
+import vtkMapper from '@kitware/vtk.js/Rendering/Core/Mapper';
 import { GET_UNDERLYING_CONTEXT } from '../OpenGL/RenderWindow/ContextProxy.js';
+import { vec3 } from 'gl-matrix';
 
 const {
   XrSessionTypes
@@ -11,6 +15,23 @@ const DEFAULT_RESET_FACTORS = {
   translateZ: -1.5 // default translation initializes object in front of camera
 };
 
+function createRay() {
+  const targetRayLineSource = vtkLineSource.newInstance();
+  const targetRayMapper = vtkMapper.newInstance();
+  targetRayMapper.setInputConnection(targetRayLineSource.getOutputPort());
+  const targetRayActor = vtkActor.newInstance();
+  targetRayActor.getProperty().setColor(1, 0, 0);
+  targetRayActor.getProperty().setLineWidth(5);
+  targetRayActor.setMapper(targetRayMapper);
+  targetRayActor.setPickable(false);
+  return {
+    lineSource: targetRayLineSource,
+    mapper: targetRayMapper,
+    actor: targetRayActor,
+    visible: false
+  };
+}
+
 // ----------------------------------------------------------------------------
 // vtkWebXRRenderWindowHelper methods
 // ----------------------------------------------------------------------------
@@ -145,6 +166,36 @@ function vtkWebXRRenderWindowHelper(publicAPI, model) {
   model.xrRender = async (t, frame) => {
     const xrSession = frame.session;
     const isXrSessionHMD = [XrSessionTypes.HmdVR, XrSessionTypes.HmdAR].includes(model.xrSessionType);
+    if (isXrSessionHMD && model.drawControllersRay && model.xrReferenceSpace) {
+      const renderer = model.renderWindow.getRenderable().getRenderers()[0];
+      const camera = renderer.getActiveCamera();
+      const physicalToWorldMatrix = [];
+      camera.getPhysicalToWorldMatrix(physicalToWorldMatrix);
+      xrSession.inputSources.forEach(inputSource => {
+        if (inputSource.targetRaySpace == null || inputSource.gripSpace == null || inputSource.targetRayMode !== 'tracked-pointer') {
+          return;
+        }
+        if (model.inputSourceToRay[inputSource.handedness] == null) {
+          model.inputSourceToRay[inputSource.handedness] = createRay();
+        }
+        const ray = model.inputSourceToRay[inputSource.handedness];
+        const targetRayPose = frame.getPose(inputSource.targetRaySpace, model.xrReferenceSpace);
+        if (targetRayPose == null) {
+          return;
+        }
+        const targetRayPosition = vec3.fromValues(targetRayPose.transform.position.x, targetRayPose.transform.position.y, targetRayPose.transform.position.z);
+        const dir = camera.physicalOrientationToWorldDirection([targetRayPose.transform.orientation.x, targetRayPose.transform.orientation.y, targetRayPose.transform.orientation.z, targetRayPose.transform.orientation.w]);
+        const targetRayWorldPosition = vec3.transformMat4([], targetRayPosition, physicalToWorldMatrix);
+        const dist = renderer.getActiveCamera().getClippingRange()[1];
+        if (!ray.visible) {
+          renderer.addActor(ray.actor);
+          ray.visible = true;
+        }
+        ray.lineSource.setPoint1(targetRayWorldPosition[0] - dir[0] * dist, targetRayWorldPosition[1] - dir[1] * dist, targetRayWorldPosition[2] - dir[2] * dist);
+        ray.lineSource.setPoint2(...targetRayWorldPosition);
+      });
+      model.renderWindow.render();
+    }
     model.renderWindow.getRenderable().getInteractor().updateXRGamepads(xrSession, frame, model.xrReferenceSpace);
     model.xrSceneFrame = model.xrSession.requestAnimationFrame(model.xrRender);
     const xrPose = frame.getViewerPose(model.xrReferenceSpace);
@@ -202,27 +253,31 @@ function vtkWebXRRenderWindowHelper(publicAPI, model) {
 // Object factory
 // ----------------------------------------------------------------------------
 
-const DEFAULT_VALUES = {
-  initialized: false,
-  initCanvasSize: null,
-  initBackground: null,
-  renderWindow: null,
-  xrSession: null,
-  xrSessionType: 0,
-  xrReferenceSpace: null
-};
+function defaultValues() {
+  return {
+    initialized: false,
+    drawControllersRay: false,
+    inputSourceToRay: {},
+    initCanvasSize: null,
+    initBackground: null,
+    renderWindow: null,
+    xrSession: null,
+    xrSessionType: 0,
+    xrReferenceSpace: null
+  };
+}
 
 // ----------------------------------------------------------------------------
 
 function extend(publicAPI, model) {
   let initialValues = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  Object.assign(model, DEFAULT_VALUES, initialValues);
+  Object.assign(model, defaultValues(), initialValues);
 
   // Build VTK API
   macro.obj(publicAPI, model);
   macro.event(publicAPI, model, 'event');
   macro.get(publicAPI, model, ['xrSession']);
-  macro.setGet(publicAPI, model, ['renderWindow']);
+  macro.setGet(publicAPI, model, ['renderWindow', 'drawControllersRay']);
 
   // Object methods
   vtkWebXRRenderWindowHelper(publicAPI, model);

package/index.d.ts

@@ -123,6 +123,7 @@
 /// <reference path="./Interaction/Manipulators/MouseCameraTrackballZoomManipulator.d.ts" />
 /// <reference path="./Interaction/Manipulators/MouseCameraTrackballZoomToMouseManipulator.d.ts" />
 /// <reference path="./Interaction/Manipulators/MouseRangeManipulator.d.ts" />
+/// <reference path="./Interaction/Style/InteractorStyleHMDXR.d.ts" />
 /// <reference path="./Interaction/Style/InteractorStyleImage.d.ts" />
 /// <reference path="./Interaction/Style/InteractorStyleManipulator.d.ts" />
 /// <reference path="./Interaction/Style/InteractorStyleTrackballCamera.d.ts" />

package/package.json

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