Skip to main content
100%

Map with Selectable Countries D3.js HW

✓ Published0🌍 Public
KKCachel
Last edited Nov 5, 2018
Created on Sep 25, 2018

This example shows a world map where users can click individual countries to select and deselect them, with the selected country’s name displayed above the map. The visualization uses D3 v5 with `geoNaturalEarth1` projection and `geoPath` to render geographic features from TopoJSON data sourced from the World Atlas. Click events toggle a yellow highlight on the selected country by modifying its fill and stroke styles, while a separate `div` element updates to show the country’s name from a TSV file. Pan and zoom interactions are enabled via `d3.zoom`.

AI-generated description

Kathleen Cachel Week 5 Homework

I found this page at D3 in Depth to be helpful in making the selction events.

MIT Licensed

Similar vizzes