d3 工具提示不会在鼠标悬停时跟踪鼠标位置

Question

工具提示始终位于图表的中心（内部甜甜圈），并且不会在鼠标悬停时跟踪鼠标位置。我做错了什么？

CodeSandbox

   const [parentTooltipPosition, setParentTooltipPosition] = useState({
            x1: 0,
            y1: 0
          });
          const [isParentTooltipEnabled, setIsParentTooltipEnabled] = useState(false);
          const [childTooltipPosition, setChildTooltipPosition] = useState({
            x2: 0,
            y2: 0
          });
          const [isChildTooltipEnabled, setIsChildTooltipEnabled] = useState(false);
          const svgRef = useRef();
          const svgEl = d3.select(svgRef.current);
        
      const handleMouseMove = (e) => {
        const mouse = getMouse(e, width, height);
        const newPt = mouse;
    
        // if (!pointsEqual(hoverPt, newPt)) {
        //   setParentTooltipPosition(newPt);
        // }
      };
    
      const handleMouseOut = () => {
        setIsParentTooltipEnabled(false);
      };
      const handleMouseOver = () => {
        setIsParentTooltipEnabled(true);
      };
    
      const getMouse = (e, width, height) => {
        const dims = e.currentTarget.getBoundingClientRect();
        const rawX = e.clientX - dims.left;
        const rawY = e.clientY - dims.top;
        const x1 = (rawX / dims.width) * width;
        const y1 = (rawY / dims.height) * height;
        return { x1, y1 };
      };
    
      const pointsEqual = (p1, p2) => {
        return (!p1 && !p2) || (p1 && p2 && p1.x === p2.x && p1.y === p2.y);
      };
    
    
     parentArcs
          .append("path")
          .attr("class", "parentArcSlice")
          .on("mouseover", handleMouseOver)
          .on("mouseout", handleMouseOut)