Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

World Countries Tree

Public visualization

Viewing a saved revision (read-only)

000538ac8fd945f98badad880247d545

World Countries Tree

0 stars0🌍 Public
HHeholek
Last edited Feb 29, 2020
Created on Feb 29, 2020

A hierarchical tree visualization displays the world's countries organized by continent and subregion, with each country as a leaf node. The layout uses d3.tree() and d3.hierarchy() to structure the JSON data, while d3.linkHorizontal() generates the curved link paths. Text labels align dynamically based on whether a node has children. Pan and zoom functionality is implemented via d3.zoom(), and margins are applied using the standard D3 margin convention. Custom fonts and text shadows enhance readability.

AI-generated description

Topics Constructing a node-link tree visualiztion Adding text labels to the nodes Using the Margin Convention Tweaking label alignment and size Panning & Zooming Using a custom font