isArrowClicked()

in src/components/graph-view-v2.js [1138:1180]


  isArrowClicked(edge: IEdge | null) {
    const { edgeArrowSize, onArrowClicked } = this.props;
    const eventTarget = d3.event.sourceEvent.target;
    const arrowSize = edgeArrowSize || 0;

    if (!edge || eventTarget.tagName !== 'path') {
      return false; // If the handle is clicked
    }

    const xycoords = d3.mouse(eventTarget);

    if (edge.target == null) {
      return false;
    }

    const source = {
      x: xycoords[0],
      y: xycoords[1],
    };
    const edgeCoords = parsePathToXY(
      getEdgePathElement(edge, this.viewWrapper.current)
    );

    // the arrow is clicked if the xycoords are within edgeArrowSize of edgeCoords.target[x,y]

    if (onArrowClicked) {
      if (
        source.x < edgeCoords.target.x + arrowSize &&
        source.x > edgeCoords.target.x - arrowSize &&
        source.y < edgeCoords.target.y + arrowSize &&
        source.y > edgeCoords.target.y - arrowSize
      ) {
        onArrowClicked(edge);
      }
    }

    return (
      source.x < edgeCoords.target.x + arrowSize &&
      source.x > edgeCoords.target.x - arrowSize &&
      source.y < edgeCoords.target.y + arrowSize &&
      source.y > edgeCoords.target.y - arrowSize
    );
  }