Dinesh ICE8 Q1

100%

Dinesh ICE8 Q1

✓ Published0🌍 Public

Last edited Nov 10, 2025

Created on Nov 10, 2025

This example shows two maps side-by-side: a world map in a Natural Earth projection and a map of U.S. states using the Albers USA projection, with each state colored according to a numeric value from a linked CSV dataset. The visualization uses D3.js v7 with the `d3.geoNaturalEarth1()` and `d3.geoAlbersUsa()` projections, alongside `d3.geoPath` for rendering GeoJSON features. It loads world countries from `world-atlas`, U.S. states from `us-atlas`, joins state IDs to CSV values, and applies a sequential purple color scale to encode the data.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

dinesh ice8 q1

This example presents a dual-map visualization: a world choropleth and a US states choropleth, rendered as SVG using D3.js v7. The world map uses `d3.geoNaturalEarth1` projection and color-coded countries based on population data from a CSV file, while the US map uses `d3.geoAlbersUsa` projection with state-level values. Both maps load GeoJSON from the world-atlas and us-atlas CDN packages, and use `topojson-client` functions `feature` and `mesh` for geometry processing. A hover tooltip displays values; the US section also includes state borders drawn via a mesh layer.

Ddineshsingiri18@gmail.com

90% match

Loading thumbnail…

ICE-8 NIHA

Two map examples show how D3.js renders geographic data with TopoJSON and custom projections. The world map uses `d3.geoNaturalEarth1` and a sequential blue color scale to encode population values from a CSV, overlaid with a graticule. The US map uses `d3.geoAlbersUsa` with state boundaries from `us-atlas@3`. Both use SVG paths via `d3.geoPath` and a fixed tooltip on hover.

118121a1545

82% match

Loading thumbnail…

ICE-8

ICE-8 presents a pair of interactive SVG choropleth maps showing world GDP and US state values. The world map projects Natural Earth TopoJSON countries with a Natural Earth projection and uses a green sequential color scale, while the US map uses an Albers USA projection. Both maps use `d3.geoPath`, TopoJSON features, and tooltip interactions. Data is joined from remote CSV sources, with JavaScript fetch and D3’s data loaders handling URL fallbacks.

SSainathreddypotu@gmail.com

81% match

Loading thumbnail…

Q1

This interactive visualization presents two maps side-by-side: a world map colored by continent and a US map showing unemployment rates by state. The world map uses `d3.geoNaturalEarth1` projection to display countries from the `world-atlas` dataset, with countries colored via `d3.scaleOrdinal` based on a continent mapping. The US map employs `d3.geoAlbersUsa` projection with the `us-atlas` states dataset, rendering geographic paths through `d3.geoPath`. Both maps include graticule overlays, hover tooltips, and SVG-based rendering with animated state transitions between views.

RRuthvik Bairaboina

80% match

Loading thumbnail…

ICE8 USA Map

This example displays a choropleth-style map of the United States, with each state filled in green and outlined in a semi-transparent orange. It shows the geographic boundaries of all 50 states, highlighting them in red on hover. The visualization uses the D3 v5 library with `d3.geoPath` and `geoAlbersUsa` projection, rendering the map as SVG paths from TopoJSON data loaded from the us-atlas repository. The `states-10m.json` file provides the geographic features, and the `geo-albers-usa-territories` plugin enables territory inclusion.

AAmanullah007

80% match

Loading thumbnail…

ICE8_WorldMap_hd

This example presents two interactive SVG maps built with D3 v7 and TopoJSON: a world map showing random population density values and a U.S. map displaying random crime rates. The world map uses a Natural Earth1 projection, while the U.S. map employs an AlbersUsa projection. Both maps encode data through sequential color scales—YlOrRd for density and Blues for crime—applied to country and state polygons via `d3.geoPath`. The code fetches geographic data from world-atlas and us-atlas CDN packages, then appends tooltips with the corresponding random values.

HHarshithaDontha@my.unt.edu

80% match

Loading thumbnail…

Fork of Map

This visualization demonstrates two geographic maps side by side: a world map using the Natural Earth projection and a US state map using the Albers USA projection. The maps show country and state boundaries rendered as SVG paths with light blue and green fills, overlaid on a subtle graticule grid for the world map. Built with D3 v7 and TopoJSON, the code loads geographic data from the `world-atlas` and `us-atlas` datasets via CDN, then applies `d3.geoNaturalEarth1` and `d3.geoAlbersUsa` projections with `d3.geoPath` to draw the features.

YYaswanth

80% match

Loading thumbnail…

ICE-8 World Map

This interactive world map lets users explore country boundaries by clicking on them, which switches the projection between Mercator and orthographic views, with the United States triggering a third Albers USA projection. Built with D3 v6 and TopoJSON, the visualization uses d3.geoPath to render country shapes from world-atlas data, while d3.drag and d3.zoom enable rotating the orthographic globe and panning/zooming the map. A graticule overlay and country hover effects are drawn as SVG paths, with transitions animating projection changes.

Ddheeraj1509

80% match