This interactive family tree uses D3.js version 3 to render hierarchical data from a JSON file as a collapsible layout. SVG rectangles represent family members, colored by generation, with HTML foreignObject labels showing names and relations. Clicking a node triggers a transition that expands or collapses its children, while tooltips and arrow markers highlight connections. The layout dynamically adjusts its width and height based on tree depth and breadth, using D3’s tree layout and transition methods for smooth animations.