{"version":"1.0","type":"rich","title":"D3.js collapsible tree with boxes","description":"This collapsible tree diagram visualizes hierarchical data using colored rectangular nodes, with each box representing a node and its metadata such as type, code, label, and version. The tree renders in SVG with animated expand/collapse transitions, and supports zooming and panning through D3’s `d3.behavior.zoom`. Links between nodes display direction attributes (SYNC or ASYN) and change color on selection. The example loads sample JSON data via `d3.json` and applies custom styling from `tree-boxes.css`, while node colors are assigned per type (e.g., blue, green, yellow, purple).","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/2caf83c631fc4f23bcb04a05ae058f39?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}