Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 Course Code Along - World Countries Tree

Public visualization

Viewing a saved revision (read-only)

2efaf84cfd174409b2ee4b386ceae1eb

D3 Course Code Along - World Countries Tree

0 stars0🌍 Public
Rrenenadorp
Last edited Jun 30, 2020
Created on Jun 29, 2020

This interactive visualization renders the hierarchical structure of world countries as a horizontal tree diagram. It displays continents, subregions, and individual countries in a collapsible layout using SVG elements. The code employs d3.tree and d3.hierarchy to compute the layout, with d3.linkHorizontal generating curved paths for parent-child connections. The visualization uses d3.zoom for panning and scaling, with node labels sized according to depth level. Data comes from the included data.json file, which organizes countries by their geographical regions. The styling applies custom fonts and text shadows for readability.

AI-generated description