---

private handleDoubleClick = (event: MouseEvent): void => {
  if (this.hidden || this.mode !== 'ready') {
    return;
  }

  const data = this.getRenderData();

  if (!data) {
    return;
  }

  const rect = this.container.getBoundingClientRect();
  const point = {
    x: event.clientX - rect.left,
    y: event.clientY - rect.top,
  };

  const isNearHandle = this.isActive && isNearPoint(point, data.handle.x, data.handle.y, HANDLE_HIT_TOLERANCE);
  const isNearLine = this.isPointNearLine(point, data.coordinate);

  if (!isNearHandle && !isNearLine) {
    return;
  }

  event.preventDefault();
  event.stopPropagation();

  this.openSettings?.();
};




public draw(target: CanvasRenderingTarget2D): void {
  const data = this.axisLine.getRenderData();

  if (!data) {
    return;
  }

  const { colors } = getThemeStore();

  target.useBitmapCoordinateSpace(({ context, bitmapSize, horizontalPixelRatio, verticalPixelRatio }) => {
    const pixelRatio = Math.max(horizontalPixelRatio, verticalPixelRatio);

    context.save();
    context.fillStyle = data.lineColor;

    if (data.direction === 'vertical') {
      const x = Math.round(data.coordinate * horizontalPixelRatio);
      const width = Math.max(1, UI.lineWidth * pixelRatio);

      context.fillRect(x - width / 2, 0, width, bitmapSize.height);
    }

    if (data.direction === 'horizontal') {
      const y = Math.round(data.coordinate * verticalPixelRatio);
      const height = Math.max(1, UI.lineWidth * pixelRatio);

      context.fillRect(0, y - height / 2, bitmapSize.width, height);
    }

    if (data.showHandle) {
      drawHandle(
        context,
        data.handle.x * horizontalPixelRatio,
        data.handle.y * verticalPixelRatio,
        horizontalPixelRatio,
        verticalPixelRatio,
        data.lineColor,
        colors.chartBackground,
      );
    }

    context.restore();
  });
}


function drawHandle(
  context: CanvasRenderingContext2D,
  x: number,
  y: number,
  horizontalPixelRatio: number,
  verticalPixelRatio: number,
  strokeColor: string,
  fillColor: string,
): void {
  const width = UI.handleSize * horizontalPixelRatio;
  const height = UI.handleSize * verticalPixelRatio;
  const left = x - width / 2;
  const top = y - height / 2;

  context.save();
  context.fillStyle = fillColor;
  context.strokeStyle = strokeColor;
  context.lineWidth = UI.handleBorderWidth * Math.max(horizontalPixelRatio, verticalPixelRatio);

  context.beginPath();
  context.rect(left, top, width, height);
  context.fill();
  context.stroke();

  context.restore();
}