Skip to main content
SimilarExport ZIP
100%

2020 Studying abroad number!

✓ Published0🌍 Public
Sserjunfan
Last edited Apr 14, 2021
Created on Mar 27, 2021

This choropleth map visualizes 2020 study-abroad numbers by country, with darker reds indicating higher counts. It loads world geometry and country names from the world-atlas TopoJSON/TSV files, joins them to the provided data.json, and renders paths with d3.geoPath and a d3.scaleSequential color scale. Hovering highlights countries green, and d3.zoom enables interactive panning and zooming.

AI-generated description

Demonstrates fundamental DOM manipulation using D3.js by making a smiley face whose eyebrows move.

MIT Licensed

Similar vizzes

Loading thumbnail…

Untitled

A choropleth map colors countries according to the number of students per country, with a sequential red color scale and a legend showing count ranges. The visualization uses D3 v5’s `d3.geoMercator` projection and `d3.geoPath` to render world topology from the World Atlas TopoJSON, while data from a TSV file is joined to country features. Country boundaries are styled with white strokes, and hovering highlights the selected country.

Bbambaleq
80% match
Loading thumbnail…

20 - choropleth map - dataviz 2018

A choropleth map of the world colors each country according to its economic classification, with a color legend on the left. The map uses a natural Earth projection rendered with `d3.geoPath`, and country data comes from the `world-atlas` TopoJSON and TSV files. A sequential color scale based on `d3.scaleOrdinal` and `schemeSpectral` assigns hues, and hovering turns a country red via SVG CSS. The visualization is built with D3 v5 and the `topojson` library's `feature` function, with zoom capability via a custom `zoom` callback.

Zzach b.
80% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes world countries using color to distinguish region boundaries and a blue sphere to represent the Earth’s surface. It loads geographic data from the World Atlas TopoJSON and TSV files via Promise.all, then renders each country as an SVG path using d3.geoPath with the d3.geoNaturalEarth1 projection. Hovering turns countries red, and tooltips display country names through appended title elements. The visualization supports zoom interaction via d3.zoom, with light green fills and black strokes for borders.

Yylzami40
79% match
Loading thumbnail…

choropleth!

This choropleth displays a world map rendered with a natural Earth projection, coloring countries in light green against a blue sphere. Built with D3 v5 and TopoJSON, it loads country boundaries from the world-atlas dataset and draws them as SVG paths using d3.geoPath. Interactive zooming is enabled through d3.zoom, and hovering over any country turns it red. Each country path includes a title element showing its name, though the display of that name is not implemented.

AAbhijeet Panda
79% match
Loading thumbnail…

Choropleth Map

This choropleth map displays the world’s countries, each filled with a light green color that turns red on hover, while the ocean remains blue. It uses D3 v5 and TopoJSON to load world-atlas data, combining a TSV file for country names with a JSON topology for geographic boundaries. The map is rendered with an SVG using a natural Earth projection via `d3.geoPath`, and interactive panning and zooming are enabled through `d3.zoom`.

MMajaha21
79% match
Loading thumbnail…

Choropleth Map

This choropleth map displays world countries in green with a dark blue ocean sphere, highlighting each country in red on hover. Using D3 v5 and TopoJSON, it loads world-atlas data (50m resolution) to generate SVG paths via `d3.geoPath` with a `geoNaturalEarth1` projection, matching ISO country IDs to names from a TSV table. The map supports zoom and pan interactions through `d3.zoom`.

Ooptimizeresume
78% match
Loading thumbnail…

22_Choropleth Map

This choropleth map colors countries by income group using a sequential spectral color scale, with hover highlighting and zoom/pan via d3.zoom. It loads World Atlas TopoJSON and TSV data through d3.json and d3.tsv, then renders geographic paths with d3.geoPath and a natural Earth projection. A custom color legend built with SVG circles and text appears on the left, and tooltips show country names and values.

FFMajid-ops
78% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes world countries with a green fill and a blue sphere background, using a natural Earth projection rendered to SVG. It draws country boundaries and names from the world-atlas TopoJSON dataset, with each country’s name displayed as a tooltip. The map supports pan and zoom via d3.zoom, and hovering over a country turns it red. The code leverages d3.geoNaturalEarth1, d3.geoPath, and topojson.feature to generate the geographic paths.

Ccpsshan
78% match