Skip to main content
SimilarExport ZIP
100%

Fork of ICE-8 — USA States Map (Cost Index)

✓ Published1🌍 Public
Jjanisha30gowda@gmail.com
Last edited Nov 10, 2025
Created on Nov 10, 2025

This fork of ICE-8 displays a simplified map of India with states colored by living cost index using a sequential YlGnBu scale. D3 v7’s `d3.geoMercator` projection and `d3.geoPath` render the embedded GeoJSON polygons. Hovering shows a tooltip with the state name and index value, while unlinked areas appear gray. The linked `COST` dataset is joined via the `ST_NM` property.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE-8_Q1.2_India_CostIndex_Map

This choropleth map shows Indian states colored by their living cost index, with gray indicating missing data. Built with D3 v7, it loads GeoJSON boundaries via `d3.json` and renders paths with `d3.geoPath` using a Mercator projection fitted to the SVG. State names from the GeoJSON join with a hardcoded cost-index map, and a sequential YlGnBu color scale encodes values. Hovering displays a tooltip with the state name and index.

Jjanisha30gowda@gmail.com
92% match
Loading thumbnail…

ICE-8 — USA States Map (Cost Index)

A choropleth map of India displays state-level living cost indices, using a linked dataset and geographic features joined by the `ST_NM` property name key. The visualization encodes values through a `d3.scaleSequential` with the `d3.interpolateYlGnBu` color interpolator, while gray shades indicate missing data. Built with D3 v7, it renders as SVG using `d3.geoMercator` projection fitted to the viewport and `d3.geoPath` for drawing state boundaries. Interactive tooltips appear on mouseover, showing each state's index value.

Jjanisha30gowda@gmail.com
88% match
Loading thumbnail…

ICE-8_Q1.2_India_CostIndex_Map

This choropleth map visualizes living cost index values across Indian states, with darker blue-green hues representing higher costs and gray indicating missing data. The visualization joins a hardcoded cost dataset to GeoJSON features using the ST_NM property, then applies a d3.geoMercator projection fitted to the SVG canvas. Interactive tooltips display state names and index values on hover via d3.event handlers, while a sequential color scale (d3.scaleSequential with d3.interpolateYlGnBu) and attached legend provide the visual encoding. The GeoJSON source is a remote GitHub repository for India state boundaries.

Jjanisha30gowda@gmail.com
85% match
Loading thumbnail…

Fork of ICE-8 — USA States Map (Cost Index)

This choropleth map of the United States visualizes a sample cost index by state, using a yellow-green-blue sequential color scale to show values ranging roughly from 84 to 160. The visualization loads US state boundaries as TopoJSON from the us-atlas package and renders them with d3.geoPath and an Albers USA projection. Each state’s color is determined by looking up its FIPS code in a cost-index dataset, and hovering reveals a tooltip with the state name and value using plain DOM events and D3 styling.

LLikhitaMudagereShivaraj@my.unt.edu
84% match
Loading thumbnail…

Fork of Fork of Fork of ICE 8 country map

This choropleth map displays Indian states, colored using a categorical scale based on interpolated attributes. The visualization uses D3 v5 with a Mercator projection and SVG rendering, loading state boundaries from a TopoJSON file hosted on GitHub. The code employs `d3.json`, `geoMercator`, `geoPath`, and `scaleOrdinal` with `schemeCategory10` to fill each state path. Interactive hover effects are defined in CSS, though the map itself does not implement zooming or panning. The viewport dimensions drive the SVG size, with a custom translate and scale applied to the projection.

DDINESH SAI BOPPANA
83% match
Loading thumbnail…

Fork of India Map ICE-8

This D3.js visualization renders a choropleth map of India, coloring each state from a categorical palette based on its name. The map uses the Mercator projection to position SVG paths generated via `d3.geoPath`, with state boundaries outlined in white. State labels are placed at each polygon’s centroid, and hovering over a state turns it yellow. The geographic data comes from a TopoJSON source, which is converted to GeoJSON using the `topojson` library’s `feature` and `mesh` functions.

Rreddysushma994@gmail.com
83% match
Loading thumbnail…

Fork of ICE-8 INDIA

This interactive map displays Indian state boundaries and district-level population data, colored by state using D3’s `scaleOrdinal` and `schemeCategory10`. Users can pan and zoom via `d3.zoom`. The visualization loads GeoJSON from two Gist-hosted sources and renders paths with `d3.geoPath` and a Mercator projection, adding tooltips with district and state names.

Ssnehareddygurram
82% match
Loading thumbnail…

Fork of India Map ICE-8

This fork of the India Map ICE-8 example displays the states of India, colored by state name using D3’s `scaleOrdinal` with `schemeCategory10`. Built with d3.v5 and TopoJSON, it loads geographic data from a remote GitHub gist, projects it using `geoMercator`, and renders each state as an SVG path via `geoPath`. State names appear as text labels at each path’s centroid, with white stroke separations and a yellow hover effect.

Iion.cojoc@gmail.com
82% match