Skip to main content
SimilarExport ZIP
100%

CS 360 final project choropleth

✓ Published1🌍 Public
EEmperor-Nathan
Last edited Dec 4, 2022
Created on Nov 1, 2022

This choropleth map displays the most popular languages (l1–l5) per country using October 2022 data, with each country colored by its primary language’s share of page views. Hovering over a country highlights it and reveals the top five language names and their proportional bar lengths in a custom axis. The visualization uses d3.geoPath with a geoEquirectangular projection to render the world map, d3.scaleThreshold and d3.schemeBlues for coloring, and d3.axisTop for the interactive bar chart that appears on hover.

AI-generated description

WARNING: Visualization may not work in certain browsers. For optimal viewing, use Google Chrome.

Data from October 2022.

D3 references:

MIT Licensed

Similar vizzes

Loading thumbnail…

Project | last part

This visualization is a choropleth map of world countries colored according to a color scale derived from a categorical attribute, with a legend allowing interactive filtering of highlighted countries. The map uses the D3 geo projection API (`geoEquirectangular` with `geoPath`) to render country boundaries as SVG paths from TopoJSON data merged with CSV attributes. The legend, built with D3's ordinal color scale and the `schemeYlOrRd` color scheme, responds to clicks to toggle a selected category, which dims non-matching countries. The map also implements a zoom interaction via D3's `zoom` event.

MMukund Khandelwal
76% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes country-level scalar data using color-coding over a geographical projection. Built with D3.js, it renders SVG paths from TopoJSON world data, with the projection handled by `d3.geoPath` and `d3.geoNaturalEarth1`. The map assigns colors based on a `scalerank` attribute using a `d3.scaleOrdinal` color scale, while a supplementary color legend displays the mapping. Interactivity is included via a zoom feature, and hovering over a country highlights it and displays a tooltip with its name and value.

SSean Ye
76% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes the income group of each country using a sequential color scale, with hover interactions highlighting individual nations. Built with D3.js (v5) and TopoJSON, it projects world geography via the Natural Earth projection and renders country boundaries as SVG paths. The color legend, generated with custom code, displays ordinal color swatches and labels. Data is sourced from the world-atlas package, merging TSV attributes with TopoJSON geometry.

Aarths-glitch
75% match
Loading thumbnail…

Choropleth Map with Interactive Practice

This visualization presents a world choropleth map coloring countries by economic classification using a spectral color scale, with an interactive legend that filters highlighted countries on click. Built with D3 v5, it employs `d3.geoNaturalEarth1` for projection, `d3.geoPath` for rendering, and `d3.zoom` for panning and zooming. Country data comes from the World Atlas TopoJSON and TSV files, while the legend uses `d3.scaleOrdinal` and `d3.schemeSpectral`. Hovering over a country turns it red, and the legend’s clickable ticks dim non-selected categories.

Ccpsshan
75% match
Loading thumbnail…

Choropleth Map with Interactive Practice

This visualization presents a world choropleth map coloring countries by economic classification using a spectral color scale, with an interactive legend that filters highlighted countries on click. Built with D3 v5, it employs `d3.geoNaturalEarth1` for projection, `d3.geoPath` for rendering, and `d3.zoom` for panning and zooming. Country data comes from the World Atlas TopoJSON and TSV files, while the legend uses `d3.scaleOrdinal` and `d3.schemeSpectral`. Hovering over a country turns it red, and the legend’s clickable ticks dim non-selected categories.

Ccpsshan
75% match
Loading thumbnail…

Map final project

This choropleth map colors countries by their economic classification using a spectral color scale, with a hover effect to highlight individual nations and a legend showing the color-to-category mapping. Built with D3 v5, it loads geographic boundaries from a TopoJSON world atlas and income-group data from a TSV file, then projects them using the `geoNaturalEarth1` projection and renders paths with `geoPath`. The visualization implements interactive zooming via the `zoom` event and a custom `colorLegend` component, with the map’s ocean rendered as a styled sphere path.

PPavan Nimmagadda
75% match
Loading thumbnail…

choropleth map!

This choropleth map colors countries by economic grouping using an ordinal color scale with a spectral scheme. The visualization renders geographic boundaries with d3.geoPath and a Natural Earth projection, and includes a custom color legend built with SVG circles and text. Users can pan and zoom via d3.zoom, while hovering highlights individual countries. Data comes from the World Atlas TopoJSON and TSV files, loaded asynchronously with d3.json and d3.tsv.

Kkaviya-ds
75% match
Loading thumbnail…

Choropleth Map

This choropleth map colors countries by economic group using a spectral color scale, with hover effects that highlight individual nations. The visualization uses D3.js (v5) to load world map data from TopoJSON and TSV files, projecting geographic coordinates with d3.geoNaturalEarth1 and rendering paths via d3.geoPath. A custom color legend with circles and text labels is built using D3 selections, while zooming is enabled through d3.zoom. The map data comes from the world-atlas package, and SVG is used for all rendering.

FFerrandiaz92
75% match