Skip to main content
100%

Chloropleth

✓ Published0🌍 Public
Aandrew-reid
Last edited Nov 26, 2017
Created on Mar 6, 2017

A choropleth map visualizes census tract data from ct2010.json using a TopoJSON topology. The map is rendered with SVG paths in D3 v3, where each tract is drawn as a filled polygon. The geographic boundaries are derived from the encoded arcs, and the choropleth coloring communicates quantitative variation across regions.

AI-generated description

Similar vizzes

Loading thumbnail…

Chloropleth Map-1

A choropleth map colors countries by their income group using an ordinal color scale with the d3-scaleChromatic scheme. It renders geographic boundaries with d3.geoPath and a natural Earth projection, while pan and zoom are enabled via d3.zoom. A custom SVG legend displays the color scale using circle marks and text labels. Data comes from the World Atlas TopoJSON and TSV files, loaded and joined using d3.json, d3.tsv, and topojson.feature.

Jjblaskovich
82% match
Loading thumbnail…

Chloropleth Map

A choropleth map colors countries by income group using an ordinal color scale with a spectral scheme. The visualization renders world geography with d3.geoPath and a Natural Earth projection, and supports pan and zoom via d3.zoom. Country names and income groups appear as tooltips, while a custom colorLegend component displays the category labels with colored circles. Data is loaded from TopoJSON and TSV files processed with topojson.feature and d3.tsv.

Ccornshoots
81% match
Loading thumbnail…

Choropleth Map

A choropleth map uses color to encode values across world countries. D3’s `geoPath` and `geoNaturalEarth1` projection render the map from TopoJSON data, while a TSV file supplies per-country attributes. The map color-fills each country by its `scalerank` value using an ordinal color scale. A separate legend component displays the color-to-value mapping, and zooming is enabled via the `zoom` event.

AAdrian Herzog
81% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes geographic regions using color-coded areas, with countries filled in light green and strokes in black at low opacity. The visualization employs a blue sphere to represent the globe, set against a clean white background. Built with D3 v5, the code uses `select` to target the SVG element and `json` to load geographic data from the OneMap service, while the `topojson` library’s `feature` function processes the topology. The map is rendered as an SVG with a fixed 960x500 viewport, with styling defined in CSS.

AAdrian Tan
81% match
Loading thumbnail…

Chloropleth Map

This choropleth map visualizes world countries with a natural Earth projection, coloring each nation light green and highlighting it red on hover. The visualization loads geographic data from the world-atlas TopoJSON and tab-separated country names, merging them by ID before rendering. Using D3 v5’s `geoNaturalEarth1` projection and `geoPath` generator, it draws SVG paths for each country, while TopoJSON’s `feature` API converts the topology into GeoJSON. A semi-transparent black stroke outlines national borders, and a blue sphere background represents the globe. Tooltips display country names via appended `title` elements.

LLuce Liu
80% match
Loading thumbnail…

Choropleth Map

A choropleth map colors countries by economic grouping, with a legend of colored circles and a natural Earth projection. It uses d3.geoPath, d3.geoNaturalEarth1, d3.scaleOrdinal with schemeSpectral, and d3.zoom for panning. The code loads world atlas TopoJSON and TSV data via topojson.feature, rendering country paths as SVG with hover highlighting.

Ggorfoula
80% match
Loading thumbnail…

Choropleth Map

A choropleth map displays countries with a uniform green fill, turning red on hover while the ocean remains light blue. The visualization uses an orthographic projection, rendering country boundaries as SVG paths via the `geoPath` and `geoOrthographic` functions. It loads world map data from the `world-atlas` package (50m JSON and TSV files) and processes TopoJSON features with the `topojson` library. The `zoom` interaction allows panning and scaling the map through SVG transforms, with country names shown in tooltips.

SSophia Murage
80% match
Loading thumbnail…

Choropleth

A world map rendered as a choropleth shades countries by population using a linear color scale. The visualization loads GeoJSON country borders from a CartoDB SQL query and draws them with D3’s `d3.geo.path` and a Robinson projection (`d3.geo.robinson`), with a graticule outline for the globe background. A `d3.behavior.zoom` handler pans and scales the entire SVG group, while mouseover and mouseout events adjust stroke width and fill opacity on individual country paths.

Aandrewxhill
80% match