Project | Load color | legend

100%

Project | Load color | legend

✓ Published1🌍 Public

Last edited Oct 24, 2018

Created on Oct 24, 2018

This example visualizes world data on primary balance and economy using a choropleth map. The map projects countries with the `geoEquirectangular` projection via `d3.geoPath`, while fill colors are assigned by an ordinal color scale using a `schemeYlOrRd` palette. The data originates from a CSV file joined to the world-atlas TopoJSON. A custom legend lists the color scale's ordinal values, allowing users to click a legend item to update the map's color mapping.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Project | Load color

This example visualizes national primary balance data on a world map, using color intensity to represent each country’s economic status. Built with D3 v5, it projects geographic features via `d3.geoPath` and `geoEquirectangular`, while `scaleOrdinal` with `schemeYlOrRd` maps data values to fill colors. A custom color legend component displays the ordinal scale with circles and labels, set against a semi-transparent background. Countries render as SVG paths with hover effects, and the map supports zooming through D3’s zoom behavior. Data comes from CSV files joined to TopoJSON world geometry.

MMukund Khandelwal

91% match

Loading thumbnail…

Project | Load color | legend | moving

This example displays a world map with countries colored by a categorical measure of "prudence," using a yellow-or-red ordinal color scale. An interactive legend allows users to click a color value to filter and highlight matching countries while dimming others. The visualization uses d3.geoPath with a geoEquirectangular projection, d3.zoom for panning, and a custom color legend component. Data comes from CSV and TopoJSON files, rendered as SVG paths with hover effects defined in CSS.

MMukund Khandelwal

89% match

Loading thumbnail…

Project | Load

This visualization shows a world map where each country is colored according to its economic status, using a diverging red-yellow-green color scale derived from a dataset of primary balance values. The map supports zooming via d3.zoom, and a color legend generated with custom D3 code displays the ordinal scale’s categories. The geographic paths are rendered using d3.geoPath with a geoEquirectangular projection, while country data is loaded from a CSV file merged with TopoJSON world atlas geometry using topojson.feature.

MMukund Khandelwal

87% match

Loading thumbnail…

Project | Interaction

A choropleth map of world countries colored by primary balance, with a yellow legend panel for selecting economic categories. Clicking a legend item highlights matching countries and dims others; clicking again clears the selection. The map supports zoom and pan via d3.zoom. Built with d3.geoPath and geoEquirectangular projection, using TopoJSON world-atlas data and CSV attributes merged by ISO code. Hovering a country shows its name and primary balance in a tooltip.

MMukund Khandelwal

85% match

Loading thumbnail…

Colorpleth Map

This example, titled Colorpleth Map, visualizes global economic data by coloring each country on a natural Earth projection using a spectral color scale. The map renders geographic boundaries with `d3.geoPath` and supports zoom interaction via `d3.zoom`. A legend, built with custom D3 code, displays the ordinal color scale’s domain. The data is loaded from the `world-atlas` TopoJSON and TSV files, with countries colored according to their `economy` property.

Ggregosaure

82% match

Loading thumbnail…

Choropleth Map

This choropleth map visualizes global economic data by coloring countries according to a categorical color scale. Users can click legend entries to highlight countries matching the selected category, dimming all others. Built with D3 v5, it uses `d3.geoPath` with a Natural Earth projection and `d3.scaleOrdinal` for coloring. The map loads country boundaries and economic classifications from a world-atlas TopoJSON dataset, while the interactive legend and country paths are rendered as SVG elements.

Iinroadings

81% match

Loading thumbnail…

Project | Primary Balance | Chloro | Filter

This example presents a choropleth map of the world, colored by the economic status of each country. Hovering over a country highlights it in yellow and displays a tooltip with its name, primary balance, and economy classification. The visualization uses d3.geoPath with an equirectangular projection to render geographic features. The color legend is built with a custom colorLegend component, while data from a CSV file is joined with world-atlas TopoJSON. Styling and interactivity are handled through CSS and d3's selection and event APIs.

MMukund Khandelwal

81% match

Loading thumbnail…

Project | last part-resubmit

This choropleth map displays the primary balance of countries, using a yellow-to-red sequential color scale. Users can click a legend item to highlight countries with the selected value, while dimming all others. Built with D3 v5, the map projects geographic data using `d3.geoPath` and `d3.geoEquirectangular`, with zoom and pan via `d3.zoom`. Country boundaries and economic data come from the World Atlas TopoJSON and a CSV dataset, loaded through `d3.json` and `d3.csv`.

MMukund Khandelwal

81% match