fix(measurement): fix for measurement jump is not switching series in 2DMPR (#4779)

platform/app/src/components/ViewportGrid.tsx

@@ -6,6 +6,7 @@ import { useViewportGrid } from '@ohif/ui-next';
 import EmptyViewport from './EmptyViewport';
 import classNames from 'classnames';
 import { useAppConfig } from '@state';
+import getClosestOrientationFromIOP from '../utils/getClosestOrientationFromIOP';
 
 function ViewerViewportGrid(props: withAppTypes) {
   const { servicesManager, viewportComponents = [], dataSource } = props;
@@ -177,7 +178,20 @@ function ViewerViewportGrid(props: withAppTypes) {
         const { displaySetInstanceUID: referencedDisplaySetInstanceUID } = measurement;
 
         const updatedViewports = _getUpdatedViewports(viewportId, referencedDisplaySetInstanceUID);
-        if (!updatedViewports[0]) {
+        let viewportToUpdate;
+        if (updatedViewports.length > 1) {
+          // To get the viewport which orientation is closest to IOP
+          const closestOrientation = getClosestOrientationFromIOP(
+            displaySetService,
+            referencedDisplaySetInstanceUID
+          );
+          viewportToUpdate = updatedViewports.find(
+            viewport => viewport.viewportOptions?.orientation == closestOrientation
+          );
+        }
+        // If closest orientation viewport is not find then choose 0
+        viewportToUpdate = updatedViewports[0];
+        if (!viewportToUpdate) {
           console.warn(
             'ViewportGrid::Unable to navigate to viewport containing',
             referencedDisplaySetInstanceUID
@@ -185,14 +199,9 @@ function ViewerViewportGrid(props: withAppTypes) {
           return;
         }
 
-        // Arbitrarily assign the viewport to element 0
-        // TODO - this should perform a search to find the most suitable viewport.
-        updatedViewports[0] = { ...updatedViewports[0] };
-        const [viewport] = updatedViewports;
-
         // Copy the viewport options to prevent modifying the internal data
-        viewport.viewportOptions = {
-          ...viewport.viewportOptions,
+        viewportToUpdate.viewportOptions = {
+          ...viewportToUpdate.viewportOptions,
           orientation: 'acquisition',
           // The preferred way to jump to the measurement view is to set the
           // view reference, as this can hold information such as the orientation

platform/app/src/utils/getClosestOrientationFromIOP.ts

@@ -0,0 +1,59 @@
+import { vec3 } from 'gl-matrix';
+import { Enums } from '@cornerstonejs/core';
+import OrientationAxis = Enums.OrientationAxis;
+
+/**
+ * Get the plane (orientation) to which the ImageOrientationPatient is most closely aligned
+ *
+ * @param displaySetService
+ * @param displaySetInstanceUID
+ * @returns orientation
+ */
+export default function getClosestOrientationFromIOP(
+  displaySetService,
+  displaySetInstanceUID
+): OrientationAxis {
+  const displaySet = displaySetService.getDisplaySetByUID(displaySetInstanceUID);
+  const imageOrientationPatient = displaySet.instances[0].ImageOrientationPatient as Array<number>;
+  // ImageOrientationPatient must be an array of length 6.
+  if (imageOrientationPatient?.length !== 6) {
+    return;
+  }
+
+  // Take cross product to get vector coming "out" of image plane
+  const rowCosineVec = vec3.fromValues(
+    imageOrientationPatient[0],
+    imageOrientationPatient[1],
+    imageOrientationPatient[2]
+  );
+  const colCosineVec = vec3.fromValues(
+    imageOrientationPatient[3],
+    imageOrientationPatient[4],
+    imageOrientationPatient[5]
+  );
+  const scanAxisNormal = vec3.cross(vec3.create(), rowCosineVec, colCosineVec);
+
+  // Define the reference vectors for axial, coronal, and sagittal planes
+  const unitVectors = {
+    [OrientationAxis.AXIAL]: vec3.fromValues(0, 0, 1),
+    [OrientationAxis.CORONAL]: vec3.fromValues(0, 1, 0),
+    [OrientationAxis.SAGITTAL]: vec3.fromValues(1, 0, 0),
+  };
+
+  // Compute dot products for each reference plane
+  // Because all vectors are normalized, dot product is bounded between -1 and 1
+  let maxDot = 0;
+  let maxOrientation: string = '';
+  for (const [k, v] of Object.entries(unitVectors)) {
+    // Absolute value of dot product because we only care about alignment with the axis
+    // For example, dot product of -1 for a given axis means perfect alignment
+    // but the image is pointing in the "opposite" direction
+    const res = Math.abs(vec3.dot(scanAxisNormal, v));
+    if (res > maxDot) {
+      maxDot = res;
+      maxOrientation = k;
+    }
+  }
+
+  return maxOrientation as OrientationAxis;
+}