Skip to main content
100%

Show National Contiguity with a Force Directed Graph - D3.js

✓ Published0🌍 Public
HHassan Abdullah
Last edited Dec 8, 2021
Created on Dec 8, 2021
Forked from Customizing Axes

This example visualizes national contiguity using a force-directed graph, where each country is represented by a flag sprite node and connections between bordering nations are shown as red links. It uses D3 v3’s `d3.layout.force` to simulate the physical layout, with nodes and links animated over time as the simulation runs. Hovering over a flag triggers a tooltip displaying the country name. The data is loaded asynchronously from a remote JSON file hosted on GitHub.

AI-generated description

This bar chart shows population of the top 10 most populous countries. The data comes from the year 2018 estimate in United Nations: World Population Prospects 2017. It also demonstrates customization of D3 axes.

See also the first bar chart visualization that this one builds on: Making a Bar Chart.

MIT Licensed

Similar vizzes