SVGのクリック座標取得

参考

var pt = svg.createSVGPoint();  // Created once for document

function alert_coords(evt) {
   pt.x = evt.clientX;
   pt.y = evt.clientY;

   // The cursor point, translated into svg coordinates
   var cursorpt =  pt.matrixTransform(svg.getScreenCTM().inverse());
   console.log("(" + cursorpt.x + ", " + cursorpt.y + ")");
}

javascript - How to get the click coordinates relative to SVG element holding the onclick listener? - Stack Overflow
https://stackoverflow.com/questions/29261304/how-to-get-the-click-coordinates-relative-to-svg-element-holding-the-onclick-lis

React+TypeScript サンプル

const handleClick = (event: React.MouseEvent<SVGSVGElement, MouseEvent>) => {
  const svg = event.currentTarget
  const pt = svg.createSVGPoint()

  pt.x = event.clientX
  pt.y = event.clientY

  const ctm = svg.getScreenCTM()
  if (ctm) {
    const cursorPt = pt.matrixTransform(ctm.inverse())
    console.log(cursorPt)
  }
}