code: function defaultStrategy(evt, { invert, maxScale, minScale }) {
    const deltaY = evt.detail.deltaPoints.page.y;
    const ticks = invert ? -deltaY / 100 : deltaY / 100;
    const { element, viewport } = evt.detail;
    const [startX, startY, imageX, imageY] = [
      evt.detail.startPoints.page.x,
      evt.detail.startPoints.page.y,
      evt.detail.startPoints.image.x,
      evt.detail.startPoints.image.y,
    ];
  
    // Calculate the new scale factor based on how far the mouse has changed
    const updatedViewport = changeViewportScale(viewport, ticks, {
      maxScale,
      minScale,
    });
  
    external.cornerstone.setViewport(element, updatedViewport);
  
    // Now that the scale has been updated, determine the offset we need to apply to the center so we can
    // Keep the original start location in the same position
    const newCoords = external.cornerstone.pageToPixel(element, startX, startY);
  
    // The shift we will use is the difference between the original image coordinates of the point we've selected
    // And the image coordinates of the same point on the page after the viewport scaling above has been performed
    // This shift is in image coordinates, and is designed to keep the target location fixed on the page.
    let shift = {
      x: imageX - newCoords.x,
      y: imageY - newCoords.y,
    };
  
    // Correct the required shift using the viewport rotation and flip parameters
    shift = correctShift(shift, updatedViewport);
  
    // Apply the shift to the Viewport's translation setting
    viewport.translation.x -= shift.x;
    viewport.translation.y -= shift.y;
  }
docs: The default strategy keeps the target location fixed on the page
  as we zoom in/out.
  
  @param {*} evt
  @param {*} { invert, maxScale, minScale }
  @returns {void}