CenteringTextBySettingAttributes.tsx

import { RenderCustomNodeElementFn } from "react-d3-tree/lib/types/common";

export const LogiNode: RenderCustomNodeElementFn = ({ nodeDatum, toggleNode}) => {
  const [x, y] = [0, -50];
  const [width, height] = [100, 100];
  return(
  <g>
    <rect width={width} height={height} x={x} y={y} onClick={toggleNode}>
    </rect>
    <text
      x={x+width/2}
      y={y+height/2}
      dominantBaseline="middle"
      textAnchor="middle"
    >
      {nodeDatum.name}
    </text>
  </g>
    )
}