Radial Tree of Countries Hierarchy
This radial tree visualization displays a hierarchical structure of country records and their associated rules, such as "Incoming." The root node sits at the center, with branches extending outward to represent child nodes at varying depths. The visualization uses a circular layout where the radial position indicates hierarchical level, and the size of text labels decreases with depth. The implementation uses the D3 v4 library, specifically the `d3.cluster` and `d3.hierarchy` APIs to compute the radial tree layout. It features pan and zoom interactions through the `d3.zoom` function, which updates the SVG group's transform attribute. Data is loaded from an external JSON file, and the tree is rendered as SVG paths for links and circles with text labels for nodes. The code also applies a custom glow effect to text labels using CSS text-shadow properties.
AI-generated descriptionRadial Tree Visualization of Countries Hierarchy. Has Panning and Zooming interaction.
Adapted from Curran Kelleher’s Block "World Countries Hierarchy".