{"version":"1.0","type":"rich","title":"Fork of React & D3 Vibecoding Starter","description":"This example displays a three-generation family tree using a static hierarchical layout, with color-coded nodes indicating depth. It uses D3 v7’s `d3.hierarchy`, `d3.tree`, and `d3.linkHorizontal` to position and connect nodes, rendering an SVG with circles and labels. The tree is drawn from a hard-coded JavaScript object, with edge paths and node groups appended via joins. Node fill colors are mapped by depth using `d3.scaleOrdinal`, producing a simple, beginner-friendly illustration of a tree diagram.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/2ab54fadde2747df8473cb9f7d996653?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}