@cornerstonejs/tools 1.48.1 → 1.49.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cornerstonejs/tools",
-  "version": "1.48.1",
+  "version": "1.49.0",
   "description": "Cornerstone3D Tools",
   "main": "src/index.ts",
   "types": "dist/types/index.d.ts",
@@ -29,7 +29,7 @@
     "webpack:watch": "webpack --mode development --progress --watch  --config ./.webpack/webpack.dev.js"
   },
   "dependencies": {
-    "@cornerstonejs/core": "^1.48.1",
+    "@cornerstonejs/core": "^1.49.0",
     "comlink": "^4.4.1",
     "lodash.clonedeep": "4.5.0",
     "lodash.get": "^4.4.2"
@@ -53,5 +53,5 @@
     "type": "individual",
     "url": "https://ohif.org/donate"
   },
-  "gitHead": "b48d4bc61f007018f5695c209a858d3ebd2f7ce0"
+  "gitHead": "718c297a32f861b3ecc4500e0da07ba6ecf4d589"
 }

package/src/enums/AnnotationStyleStates.ts

@@ -11,12 +11,15 @@
  *   The annotation has been selected by the user;
  * Locked:
  *   The annotation has been locked;
+ * AutoGenerated:
+ *   The annotation has been auto generated;
  */
 enum AnnotationStyleStates {
   Default = '',
   Highlighted = 'Highlighted',
   Selected = 'Selected',
   Locked = 'Locked',
+  AutoGenerated = 'AutoGenerated',
 }
 
 export default AnnotationStyleStates;

package/src/enums/ChangeTypes.ts

@@ -0,0 +1,32 @@
+/**
+ * ChangeTypes defines the types of changes occurring on annotation and
+ * segmentation data.
+ */
+enum ChangeTypes {
+  /**
+   * Interaction events are done when the user is actively interacting with
+   * an annotation, and probably means the event shouldn't be handled/used.
+   */
+  Interaction = 'Interaction',
+  /**
+   * HandlesUpdated occurs when the handle data is added or removed, or moved around
+   */
+  HandlesUpdated = 'HandlesUpdated',
+  /**
+   * StatsUpdated occurs when the stats are updated/calculated.  This can be used
+   * to ignore stats calculations changes occurring on initial load, while still
+   * rendering other updates.
+   */
+  StatsUpdated = 'StatsUpdated',
+  /**
+   * InitialSetup occurs when an annotation has been created initially and
+   * has the first render/data calculation being applied.
+   */
+  InitialSetup = 'InitialSetup',
+  /**
+   * Completed occurs only for the annotation completed event, just to identify it
+   */
+  Completed = 'Completed',
+}
+
+export default ChangeTypes;

package/src/enums/Events.ts

@@ -96,6 +96,22 @@ enum Events {
    */
   ANNOTATION_RENDERED = 'CORNERSTONE_TOOLS_ANNOTATION_RENDERED',
 
+  /**
+   * Triggers on the eventTarget when an annotation interpolation process completed.
+   * Make use of {@link EventTypes.AnnotationInterpolationCompletedEventType | Annotation Interpolation process Completed Event Type}
+   * for typing your event listeners for this annotation interpolation complete event, and see what
+   * event detail is included in {@link EventTypes.AnnotationInterpolationCompletedEventDetail | Annotation interpolation process Event Detail}.
+   */
+  ANNOTATION_INTERPOLATION_PROCESS_COMPLETED = 'CORNERSTONE_TOOLS_ANNOTATION_INTERPOLATION_PROCESS_COMPLETED',
+
+  /**
+   * Triggers on the eventTarget when interpolated annotations are removed.
+   * Make use of {@link EventTypes.AnnotationInterpolationRemovedEventType | Annotation Interpolation Removed Event Type}
+   * for typing your event listeners for this interpolated annotation removed event, and see what
+   * event detail is included in {@link EventTypes.AnnotationInterpolationRemovedEventDetail | Annotation interpolation removed Event Detail}.
+   */
+  INTERPOLATED_ANNOTATIONS_REMOVED = 'CORNERSTONE_TOOLS_INTERPOLATED_ANNOTATIONS_REMOVED',
+
   ///////////////////////////////////////
   //        Segmentations Events
   ///////////////////////////////////////

package/src/enums/index.js

@@ -5,6 +5,7 @@ import Events from './Events';
 import SegmentationRepresentations from './SegmentationRepresentations';
 import { Swipe } from './Touch';
 import StrategyCallbacks from './StrategyCallbacks';
+import ChangeTypes from './ChangeTypes';
 
 export {
   MouseBindings,
@@ -15,4 +16,5 @@ export {
   SegmentationRepresentations,
   Swipe,
   StrategyCallbacks,
+  ChangeTypes,
 };

package/src/eventDispatchers/annotationInterpolationEventDispatcher.ts

@@ -0,0 +1,42 @@
+import { eventTarget } from '@cornerstonejs/core';
+import Events from '../enums/Events';
+import InterpolationManager from '../utilities/segmentation/InterpolationManager/InterpolationManager';
+
+/**
+ * The enable and disable add/remove the event listeners that dispatch the
+ * required events to the interpolation manager.
+ */
+const enable = function () {
+  eventTarget.addEventListener(
+    Events.ANNOTATION_COMPLETED,
+    InterpolationManager.handleAnnotationCompleted as EventListener
+  );
+  eventTarget.addEventListener(
+    Events.ANNOTATION_MODIFIED,
+    InterpolationManager.handleAnnotationUpdate as EventListener
+  );
+  eventTarget.addEventListener(
+    Events.ANNOTATION_REMOVED,
+    InterpolationManager.handleAnnotationDelete as EventListener
+  );
+};
+
+const disable = function () {
+  eventTarget.removeEventListener(
+    Events.ANNOTATION_COMPLETED,
+    InterpolationManager.handleAnnotationCompleted as EventListener
+  );
+  eventTarget.removeEventListener(
+    Events.ANNOTATION_MODIFIED,
+    InterpolationManager.handleAnnotationUpdate as EventListener
+  );
+  eventTarget.removeEventListener(
+    Events.ANNOTATION_REMOVED,
+    InterpolationManager.handleAnnotationDelete as EventListener
+  );
+};
+
+export default {
+  enable,
+  disable,
+};

package/src/eventDispatchers/index.js

@@ -4,6 +4,7 @@ import keyboardToolEventDispatcher from './keyboardToolEventDispatcher';
 import cameraModifiedEventDispatcher from './cameraModifiedEventDispatcher';
 import imageSpacingCalibratedEventDispatcher from './imageSpacingCalibratedEventDispatcher';
 import touchToolEventDispatcher from './touchToolEventDispatcher';
+import annotationInterpolationEventDispatcher from './annotationInterpolationEventDispatcher';
 
 export {
   imageRenderedEventDispatcher,
@@ -12,4 +13,5 @@ export {
   cameraModifiedEventDispatcher,
   imageSpacingCalibratedEventDispatcher,
   touchToolEventDispatcher,
+  annotationInterpolationEventDispatcher,
 };

package/src/init.ts

@@ -12,6 +12,7 @@ import {
   segmentationModifiedListener,
   annotationModifiedListener,
 } from './eventListeners';
+import { annotationInterpolationEventDispatcher } from './eventDispatchers';
 
 import * as ToolGroupManager from './store/ToolGroupManager';
 
@@ -74,6 +75,7 @@ function _addCornerstoneEventListeners(): void {
 
   eventTarget.addEventListener(elementEnabledEvent, addEnabledElement);
   eventTarget.addEventListener(elementDisabledEvent, removeEnabledElement);
+  annotationInterpolationEventDispatcher.enable();
 }
 
 /**
@@ -87,6 +89,7 @@ function _removeCornerstoneEventListeners(): void {
 
   eventTarget.removeEventListener(elementEnabledEvent, addEnabledElement);
   eventTarget.removeEventListener(elementDisabledEvent, removeEnabledElement);
+  annotationInterpolationEventDispatcher.disable();
 }
 
 /**

package/src/stateManagement/annotation/config/getState.ts

@@ -5,9 +5,19 @@ import { AnnotationStyleStates } from '../../../enums';
 
 /**
  * Given a Annotation object, return the annotationStyle State that it
- * should be in based on its data
+ * should be in based on its data.
+ * The ordering of states is:
+ *   * Highlighted
+ *   * Selected
+ *   * Locked
+ *   * Autogenerated
+ *   * Default
+ * So the first one that applies will be returned.
+ * For the autogenerated state, it depends on the autoGenerated flag on the
+ * annotation, so once that is gone/false, the annotation will go to default.
+ *
  * @param annotation - The annotation that we want to style.
- * @returns The state of the annotation whether it is Default, Highlighted, Locked, or Selected.
+ * @returns The state of the annotation whether it is Default, Highlighted, Locked, Selected, or AutoGenerated.
  */
 function getState(annotation?: Annotation): AnnotationStyleStates {
   if (annotation) {
@@ -22,6 +32,10 @@ function getState(annotation?: Annotation): AnnotationStyleStates {
     if (isAnnotationLocked(annotation)) {
       return AnnotationStyleStates.Locked;
     }
+
+    if (annotation.data && annotation.autoGenerated) {
+      return AnnotationStyleStates.AutoGenerated;
+    }
   }
 
   return AnnotationStyleStates.Default;

package/src/tools/annotation/LivewireContourTool.ts

@@ -11,9 +11,9 @@ import type { Types } from '@cornerstonejs/core';
 import { removeAnnotation } from '../../stateManagement/annotation/annotationState';
 import { drawHandles as drawHandlesSvg } from '../../drawingSvg';
 import { state } from '../../store';
-import { Events } from '../../enums';
+import { Events, ChangeTypes } from '../../enums';
 import { resetElementCursor } from '../../cursors/elementCursor';
-import {
+import type {
   Annotation,
   EventTypes,
   ToolHandle,
@@ -89,12 +89,6 @@ class LivewireContourTool extends ContourSegmentationBaseTool {
 
     this.isDrawing = true;
 
-    const defaultActor = viewport.getDefaultActor();
-
-    // if (!defaultActor || !csUtils.isImageActor(defaultActor)) {
-    //   throw new Error('Default actor must be an image actor');
-    // }
-
     const viewportImageData = viewport.getImageData();
     const { imageData: vtkImageData } = viewportImageData;
     let worldToSlice: (point: Types.Point3) => Types.Point2;
@@ -337,6 +331,7 @@ class LivewireContourTool extends ContourSegmentationBaseTool {
       const eventType = Events.ANNOTATION_COMPLETED;
       const eventDetail: AnnotationCompletedEventDetail = {
         annotation,
+        changeType: ChangeTypes.Completed,
       };
 
       triggerEvent(eventTarget, eventType, eventDetail);

package/src/tools/annotation/PlanarFreehandContourSegmentationTool.ts

@@ -10,6 +10,12 @@ class PlanarFreehandContourSegmentationTool extends PlanarFreehandROITool {
       {
         configuration: {
           calculateStats: false,
+          /**
+           * Allow open contours false means to not allow a final/complete
+           * annotation to be done as an open contour.  This does not mean
+           * that the contour won't be open during creation.
+           */
+          allowOpenContours: false,
         },
       },
       toolProps

package/src/tools/annotation/PlanarFreehandROITool.ts

@@ -30,7 +30,7 @@ import {
   AnnotationCompletedEventDetail,
   AnnotationModifiedEventDetail,
 } from '../../types/EventTypes';
-import {
+import type {
   EventTypes,
   ToolHandle,
   Annotation,
@@ -68,23 +68,23 @@ const PARALLEL_THRESHOLD = 1 - EPSILON;
  * or similar methods.
  *
  * PlanarFreehandROITool annotation can be smoothed on drawing completion. This is a configured based approach.
- * The interpolation process uses b-spline algorithm and consider 4 configurations properties:
- * - interpolation.interpolateOnAdd: to tell whether it should be interpolated or not (for editing it is considered the property interpolateOnEdit) (default: false)
- * - interpolation.interpolateOnEdit: to tell whether it should be interpolated or not when editing (default: false)
- * - interpolation.knotsRatioPercentageOnAdd: percentage of points from Segment that are likely to be considered knots during interpolation (for editing it is considered the property knotsRatioPercentageOnEdit) ( default: 40)
- * - interpolation.knotsRatioPercentageOnEdit: same as knotsRatioPercentageOnAdd but applicable only when editing the tool (default: 40)
+ * The smoothing process uses b-spline algorithm and consider 4 configurations properties:
+ * - smoothing.smoothOnAdd: to tell whether it should be smoothed or not (for editing it is considered the property smoothOnEdit) (default: false)
+ * - smoothing.smoothOnEdit: to tell whether it should be smoothed or not when editing (default: false)
+ * - smoothing.knotsRatioPercentageOnAdd: percentage of points from Segment that are likely to be considered knots during smoothing (for editing it is considered the property knotsRatioPercentageOnEdit) ( default: 40)
+ * - smoothing.knotsRatioPercentageOnEdit: same as knotsRatioPercentageOnAdd but applicable only when editing the tool (default: 40)
  *
- * So, with that said the interpolation might occur when:
- * - drawing is done (i.e mouse is released) and interpolation.interpolateOnAdd is true. Interpolation algorithm uses knotsRatioPercentageOnAdd
- * - edit drawing is done (i.e mouse is released) and interpolation.interpolateOnEdit is true. Interpolation algorithm uses knotsRatioPercentageOnEdit and its only applied to changed segment
- * Interpolation does not occur when:
- * - interpolation.interpolateOnAdd is false and drawing is completed
- * - interpolation.interpolateOnEdit is false and edit is completed
+ * So, with that said the smoothing might occur when:
+ * - drawing is done (i.e mouse is released) and smoothing.smoothOnAdd is true. smoothing algorithm uses knotsRatioPercentageOnAdd
+ * - edit drawing is done (i.e mouse is released) and smoothing.smoothOnEdit is true. smoothing algorithm uses knotsRatioPercentageOnEdit and its only applied to changed segment
+ * smoothing does not occur when:
+ * - smoothing.smoothOnAdd is false and drawing is completed
+ * - smoothing.smoothOnEdit is false and edit is completed
  * - drawing still happening (editing or not)
  *
- * The result of interpolation will be a smoother set of segments.
- * Changing tool configuration (see below) you can fine-tune the interpolation process by changing knotsRatioPercentageOnAdd and knotsRatioPercentageOnEdit value, which smaller values produces a more agressive interpolation.
- * A smaller value of knotsRatioPercentageOnAdd/knotsRatioPercentageOnEdit produces a more agressive interpolation.
+ * The result of smoothing will be removal of some of the outliers
+ * Changing tool configuration (see below) you can fine-tune the smoothing process by changing knotsRatioPercentageOnAdd and knotsRatioPercentageOnEdit value, which smaller values produces a more agressive smoothing.
+ * A smaller value of knotsRatioPercentageOnAdd/knotsRatioPercentageOnEdit produces a more agressive smoothing.
  *
  * ```js
  * cornerstoneTools.addTool(PlanarFreehandROITool)
@@ -103,14 +103,14 @@ const PARALLEL_THRESHOLD = 1 - EPSILON;
  *   ],
  * })
  *
- * // set interpolation agressiveness while adding new annotation (ps: this does not change if interpolation is ON or OFF)
+ * // set smoothing agressiveness while adding new annotation (ps: this does not change if smoothing is ON or OFF)
  * toolGroup.setToolConfiguration(PlanarFreehandROITool.toolName, {
- *   interpolation: { knotsRatioPercentageOnAdd: 30 },
+ *   smoothing: { knotsRatioPercentageOnAdd: 30 },
  * });
  *
- * // set interpolation to be ON while editing only
+ * // set smoothing to be ON while editing only
  * toolGroup.setToolConfiguration(PlanarFreehandROITool.toolName, {
- *   interpolation: { interpolateOnAdd: false, interpolateOnEdit: true  },
+ *   smoothing: { smoothOnAdd: false, smoothOnEdit: true  },
  * });
  * ```
  *
@@ -129,7 +129,7 @@ class PlanarFreehandROITool extends ContourSegmentationBaseTool {
   isEditingClosed = false;
   isEditingOpen = false;
 
-  private activateDraw: (
+  protected activateDraw: (
     evt: EventTypes.InteractionEventType,
     annotation: PlanarFreehandROIAnnotation,
     viewportIdsToRender: string[]
@@ -195,19 +195,41 @@ class PlanarFreehandROITool extends ContourSegmentationBaseTool {
         // The proximity at which we fallback to the simplest grabbing logic for
         // determining what index of the contour to start editing.
         checkCanvasEditFallbackProximity: 6,
+        // For closed contours, make them clockwise
+        // This can be useful if contours are compared between slices, eg for
+        // interpolation, and does not cause problems otherwise so defaulting to true.
+        makeClockWise: true,
         // The relative distance that points should be dropped along the polyline
         // in units of the image pixel spacing. A value of 1 means that nodes must
         // be placed no closed than the image spacing apart. A value of 4 means that 4
         // nodes should be placed within the space of one image pixel size. A higher
-        // value gives more finese to the tool/smoother lines, but the value cannot
+        // value gives more finesse to the tool/smoother lines, but the value cannot
         // be infinite as the lines become very computationally expensive to draw.
         subPixelResolution: 4,
-        interpolation: {
-          interpolateOnAdd: false,
-          interpolateOnEdit: false, // used for edit only
+        /**
+         * Smoothing is used to remove jagged irregularities in the polyline,
+         * as opposed to interpolation, which is used to create new polylines
+         * between existing polylines.
+         */
+        smoothing: {
+          smoothOnAdd: false,
+          smoothOnEdit: false, // used for edit only
           knotsRatioPercentageOnAdd: 40,
           knotsRatioPercentageOnEdit: 40,
         },
+        /**
+         * Interpolation is the creation of new segmentations in between the
+         * existing segmentations/indices.  Note that this does not apply to
+         * ROI values, since those annotations are individual annotations, not
+         * connected in any way to each other, whereas segmentations are intended
+         * to be connected 2d + 1 dimension (time or space or other) volumes.
+         */
+        interpolation: {
+          enabled: false,
+          // Callback to update the annotation or perform other action when the
+          // interpolation is complete.
+          onInterpolationComplete: null,
+        },
         calculateStats: false,
         getTextLines: defaultGetTextLines,
         statsCalculator: BasicStatsCalculator,
@@ -916,7 +938,7 @@ class PlanarFreehandROITool extends ContourSegmentationBaseTool {
 function defaultGetTextLines(data, targetId): string[] {
   const cachedVolumeStats = data.cachedStats[targetId];
   const { area, mean, stdDev, max, isEmptyArea, areaUnit, modalityUnit } =
-    cachedVolumeStats;
+    cachedVolumeStats || {};
 
   const textLines: string[] = [];
 

package/src/tools/annotation/SplineROITool.ts

@@ -1,8 +1,8 @@
-import { utilities } from '@cornerstonejs/core';
 import {
   getEnabledElement,
   eventTarget,
   triggerEvent,
+  utilities,
 } from '@cornerstonejs/core';
 import type { Types } from '@cornerstonejs/core';
 import { vec3 } from 'gl-matrix';
@@ -13,7 +13,12 @@ import {
   drawLinkedTextBox as drawLinkedTextBoxSvg,
 } from '../../drawingSvg';
 import { state } from '../../store';
-import { Events, MouseBindings, KeyboardBindings } from '../../enums';
+import {
+  Events,
+  MouseBindings,
+  KeyboardBindings,
+  ChangeTypes,
+} from '../../enums';
 import { resetElementCursor } from '../../cursors/elementCursor';
 import {
   Annotation,
@@ -36,16 +41,14 @@ import { getViewportIdsWithToolToRender } from '../../utilities/viewportFilters'
 import { getTextBoxCoordsCanvas } from '../../utilities/drawing';
 
 import { SplineROIAnnotation } from '../../types/ToolSpecificAnnotationTypes';
-import {
-  AnnotationCompletedEventDetail,
-  AnnotationModifiedEventDetail,
-} from '../../types/EventTypes';
+import { AnnotationModifiedEventDetail } from '../../types/EventTypes';
 import { ISpline } from '../../types/ISpline';
 import { CardinalSpline } from './splines/CardinalSpline';
 import { LinearSpline } from './splines/LinearSpline';
 import { CatmullRomSpline } from './splines/CatmullRomSpline';
 import { BSpline } from './splines/BSpline';
 import ContourSegmentationBaseTool from '../base/ContourSegmentationBaseTool';
+import reverseIfAntiClockwise from '../../utilities/contours/reverseIfAntiClockwise';
 
 const SPLINE_MIN_POINTS = 3;
 const SPLINE_CLICK_CLOSE_CURVE_DIST = 10;
@@ -90,6 +93,7 @@ class SplineROITool extends ContourSegmentationBaseTool {
   } | null;
   isDrawing: boolean;
   isHandleOutsideImage = false;
+  fireChangeOnUpdate: ChangeTypes = null;
 
   constructor(
     toolProps: PublicToolProps = {},
@@ -295,6 +299,7 @@ class SplineROITool extends ContourSegmentationBaseTool {
 
     const { annotation, viewportIdsToRender, newAnnotation } = this.editData;
     const { data } = annotation;
+    annotation.autoGenerated = false;
 
     data.handles.activeHandleIndex = null;
 
@@ -305,6 +310,16 @@ class SplineROITool extends ContourSegmentationBaseTool {
     const enabledElement = getEnabledElement(element);
     const { renderingEngine } = enabledElement;
 
+    // Decide whether there's at least one point is outside image
+    const image = this.getTargetIdImage(
+      this.getTargetId(enabledElement.viewport),
+      enabledElement.renderingEngine
+    );
+    const { imageData, dimensions } = image;
+    this.isHandleOutsideImage = data.handles.points
+      .map((p) => utilities.transformWorldToIndex(imageData, p))
+      .some((index) => !utilities.indexWithinDimensions(index, dimensions));
+
     if (
       this.isHandleOutsideImage &&
       this.configuration.preventHandleOutsideImage
@@ -312,17 +327,11 @@ class SplineROITool extends ContourSegmentationBaseTool {
       removeAnnotation(annotation.annotationUID);
     }
 
+    this.fireChangeOnUpdate ||= newAnnotation
+      ? ChangeTypes.Completed
+      : ChangeTypes.HandlesUpdated;
     triggerAnnotationRenderForViewportIds(renderingEngine, viewportIdsToRender);
 
-    if (newAnnotation) {
-      const eventType = Events.ANNOTATION_COMPLETED;
-      const eventDetail: AnnotationCompletedEventDetail = {
-        annotation,
-      };
-
-      triggerEvent(eventTarget, eventType, eventDetail);
-    }
-
     this.editData = null;
     this.isDrawing = false;
   };
@@ -505,15 +514,20 @@ class SplineROITool extends ContourSegmentationBaseTool {
    */
   triggerAnnotationModified = (
     annotation: SplineROIAnnotation,
-    enabledElement: Types.IEnabledElement
+    enabledElement: Types.IEnabledElement,
+    changeType = ChangeTypes.StatsUpdated
   ): void => {
     const { viewportId, renderingEngineId } = enabledElement;
-    const eventType = Events.ANNOTATION_MODIFIED;
+    const eventType =
+      changeType === ChangeTypes.Completed
+        ? Events.ANNOTATION_COMPLETED
+        : Events.ANNOTATION_MODIFIED;
 
     const eventDetail: AnnotationModifiedEventDetail = {
       annotation,
       viewportId,
       renderingEngineId,
+      changeType,
     };
 
     triggerEvent(eventTarget, eventType, eventDetail);
@@ -615,12 +629,12 @@ class SplineROITool extends ContourSegmentationBaseTool {
     const splineType = annotation.data.spline.type;
     const splineConfig = this._getSplineConfig(splineType);
     const spline = this._updateSplineInstance(element, annotation);
-    const splinePolylineCanvas = spline.getPolylinePoints();
-    const splinePolylineWorld = [];
-
-    for (let i = 0, len = splinePolylineCanvas.length; i < len; i++) {
-      splinePolylineWorld.push(viewport.canvasToWorld(splinePolylineCanvas[i]));
-    }
+    const splinePolylineCanvas = reverseIfAntiClockwise(
+      spline.getPolylinePoints()
+    );
+    const splinePolylineWorld = splinePolylineCanvas.map((point2) =>
+      viewport.canvasToWorld(point2)
+    );
 
     data.contour.polyline = splinePolylineWorld;
 
@@ -720,29 +734,73 @@ class SplineROITool extends ContourSegmentationBaseTool {
       annotationStyle.textbox
     );
 
+    if (this.fireChangeOnUpdate) {
+      this.triggerAnnotationModified(
+        annotation,
+        enabledElement,
+        this.fireChangeOnUpdate
+      );
+      this.fireChangeOnUpdate = null;
+    }
+
     annotation.invalidated = false;
     return true;
   }
 
+  /**
+   * Creates new interpolated handles for the spline control given the
+   * polyline data.  This allows creating the spline from polyline data
+   * directly.
+   */
+  protected createInterpolatedSplineControl(annotation) {
+    if (annotation.data.handles.points?.length) {
+      // The interpolation itself created the handles
+      return;
+    }
+    const { polyline } = annotation.data.contour;
+    if (!polyline || !polyline.length) {
+      return;
+    }
+    annotation.data.handles.points = [];
+    const { points } = annotation.data.handles;
+    const increment = Math.max(10, Math.floor(polyline.length / 20));
+    for (let i = 0; i < polyline.length - increment; i += increment) {
+      points.push(polyline[i]);
+    }
+    points.push(polyline[polyline.length - 1]);
+  }
+
   protected createAnnotation(evt: EventTypes.InteractionEventType): Annotation {
     const contourAnnotation = super.createAnnotation(evt);
     const { world: worldPos } = evt.detail.currentPoints;
     const { type: splineType } = this.configuration.spline;
     const splineConfig = this._getSplineConfig(splineType);
     const spline = new splineConfig.Class();
+    const createSpline = () => ({
+      type: splineConfig.type,
+      instance: spline,
+      resolution: splineConfig.resolution,
+    });
+
+    // Add an action to create a new spline data on creating an interpolated
+    // instance.
+    let postInterpolateAction;
+    if (this.configuration.interpolation.enabled) {
+      postInterpolateAction = (annotation) => {
+        annotation.data.spline ||= createSpline();
+        this.createInterpolatedSplineControl(annotation);
+      };
+    }
 
     return <SplineROIAnnotation>utilities.deepMerge(contourAnnotation, {
       data: {
         handles: {
           points: [[...worldPos]],
         },
-        spline: {
-          type: splineConfig.type,
-          instance: spline,
-          resolution: splineConfig.resolution,
-        },
+        spline: createSpline(),
         cachedStats: {},
       },
+      postInterpolateAction,
     });
   }
 
@@ -1013,7 +1071,11 @@ class SplineROITool extends ContourSegmentationBaseTool {
       };
     }
 
-    this.triggerAnnotationModified(annotation, enabledElement);
+    this.triggerAnnotationModified(
+      annotation,
+      enabledElement,
+      ChangeTypes.StatsUpdated
+    );
 
     return cachedStats;
   };