How to use the cornerstone-core.pixelToCanvas function in cornerstone-core

export function getAddLabelButtonStyle(measurementData, eventData) {
  const { start, end } = measurementData.handles;
  const { client } = eventData.currentPoints;
  const clientStart = cornerstone.pixelToCanvas(eventData.element, start);
  const clientEnd = cornerstone.pixelToCanvas(eventData.element, end);
  const canvasOffSetLeft = client.x - clientStart.x;
  const canvasOffSetTop = client.y - clientStart.y;
  const position = {
    left: clientEnd.x + canvasOffSetLeft,
    top: clientEnd.y + canvasOffSetTop,
  };

  if (start.y > end.y) {
    position.top -= buttonSize.height;
  }
  if (start.x > end.x) {
    position.left -= buttonSize.width;
  }

  return position;

)
    }

    if (!validParameters || data.visible === false) {
      return false
    }

    const distance = interactionType === 'mouse' ? 15 : 25
    const center = getCenter(data.handles)
    const startCanvas = cornerstone.pixelToCanvas(element, data.handles.start)
    const endCanvas = cornerstone.pixelToCanvas(element, data.handles.end)
    const perpendicularCanvas = cornerstone.pixelToCanvas(
      element,
      data.handles.perpendicularPoint,
    )
    const centerCanvas = cornerstone.pixelToCanvas(element, center)

    const square = (x: any) => x * x
    const minorEllipse = {
      xRadius:
        Math.sqrt(
          square(startCanvas.x - endCanvas.x) +
            square(startCanvas.y - endCanvas.y),
        ) /
          2 -
        distance / 2,
      yRadius:
        Math.sqrt(
          square(perpendicularCanvas.x - centerCanvas.x) +
            square(perpendicularCanvas.y - centerCanvas.y),
        ) -
        distance / 2,

const getAvailableBlankAreas = (enabledElement, labelWidth, labelHeight) => {
    const { element, canvas, image } = enabledElement;

    const topLeft = cornerstone.pixelToCanvas(element, {
      x: 0,
      y: 0,
    });

    const bottomRight = cornerstone.pixelToCanvas(element, {
      x: image.width,
      y: image.height,
    });

    const $canvas = $(canvas);
    const canvasWidth = $canvas.outerWidth();
    const canvasHeight = $canvas.outerHeight();

    const result = {};
    result['x-1'] = allow.L && topLeft.x > labelWidth;
    result['y-1'] = allow.T && topLeft.y > labelHeight;
    result.x1 = allow.R && canvasWidth - bottomRight.x > labelWidth;
    result.y1 = allow.B && canvasHeight - bottomRight.y > labelHeight;

    return result;
  };

data && data.handles && data.handles.start && data.handles.end
    const validParameters = hasStartAndEndHandles

    if (!validParameters) {
      logger.warn(
        `invalid parameters supplied to tool ${this.name}'s pointNearTool`,
      )
    }

    if (!validParameters || data.visible === false) {
      return false
    }

    const distance = interactionType === 'mouse' ? 15 : 25
    const center = getCenter(data.handles)
    const startCanvas = cornerstone.pixelToCanvas(element, data.handles.start)
    const endCanvas = cornerstone.pixelToCanvas(element, data.handles.end)
    const perpendicularCanvas = cornerstone.pixelToCanvas(
      element,
      data.handles.perpendicularPoint,
    )
    const centerCanvas = cornerstone.pixelToCanvas(element, center)

    const square = (x: any) => x * x
    const minorEllipse = {
      xRadius:
        Math.sqrt(
          square(startCanvas.x - endCanvas.x) +
            square(startCanvas.y - endCanvas.y),
        ) /
          2 -
        distance / 2,

if (!validParameters) {
      logger.warn(
        `invalid parameters supplied to tool ${this.name}'s pointNearTool`,
      )
    }

    if (!validParameters || data.visible === false) {
      return false
    }

    const distance = interactionType === 'mouse' ? 15 : 25
    const center = getCenter(data.handles)
    const startCanvas = cornerstone.pixelToCanvas(element, data.handles.start)
    const endCanvas = cornerstone.pixelToCanvas(element, data.handles.end)
    const perpendicularCanvas = cornerstone.pixelToCanvas(
      element,
      data.handles.perpendicularPoint,
    )
    const centerCanvas = cornerstone.pixelToCanvas(element, center)

    const square = (x: any) => x * x
    const minorEllipse = {
      xRadius:
        Math.sqrt(
          square(startCanvas.x - endCanvas.x) +
            square(startCanvas.y - endCanvas.y),
        ) /
          2 -
        distance / 2,
      yRadius:
        Math.sqrt(

const validParameters = hasStartAndEndHandles

    if (!validParameters) {
      logger.warn(
        `invalid parameters supplied to tool ${this.name}'s pointNearTool`,
      )
    }

    if (!validParameters || data.visible === false) {
      return false
    }

    const distance = interactionType === 'mouse' ? 15 : 25
    const center = getCenter(data.handles)
    const startCanvas = cornerstone.pixelToCanvas(element, data.handles.start)
    const endCanvas = cornerstone.pixelToCanvas(element, data.handles.end)
    const perpendicularCanvas = cornerstone.pixelToCanvas(
      element,
      data.handles.perpendicularPoint,
    )
    const centerCanvas = cornerstone.pixelToCanvas(element, center)

    const square = (x: any) => x * x
    const minorEllipse = {
      xRadius:
        Math.sqrt(
          square(startCanvas.x - endCanvas.x) +
            square(startCanvas.y - endCanvas.y),
        ) /
          2 -
        distance / 2,
      yRadius:

const getAvailableBlankAreas = (enabledElement, labelWidth, labelHeight) => {
    const { element, canvas, image } = enabledElement;

    const topLeft = cornerstone.pixelToCanvas(element, {
      x: 0,
      y: 0,
    });

    const bottomRight = cornerstone.pixelToCanvas(element, {
      x: image.width,
      y: image.height,
    });

    const $canvas = $(canvas);
    const canvasWidth = $canvas.outerWidth();
    const canvasHeight = $canvas.outerHeight();

    const result = {};
    result['x-1'] = allow.L && topLeft.x > labelWidth;
    result['y-1'] = allow.T && topLeft.y > labelHeight;