{"version":"1.0","type":"rich","title":"unidirectional data flow","description":"This example shows a world map where clicking a country highlights it in pink, illustrating unidirectional data flow through a single render function that updates the visualization. Built with D3 v5, it uses `d3.geoNaturalEarth1` for projection, `d3.geoPath` to draw country outlines from TopoJSON data (world-atlas 50m), and `d3.zoom` for panning and zooming. The code loads geographic data via `d3.json` and country names via `d3.tsv`, then binds click events to update the selected country state. SVG paths represent countries, with a blue sphere as the ocean backdrop.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/17953e2e1e864c4e8ab5a637553dec49?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}