Skip to main content
SimilarExport ZIP
100%

Fork of map ice 8

✓ Published0🌍 Public
Ssravya7136@gmail.com
Last edited Nov 9, 2025
Created on Nov 9, 2025
Forked from map ice 8

This choropleth map shows poverty headcount ratios across Indian states, using a sequential YlGnBu color scale to encode percentages. Built with D3.js, it loads TopoJSON state boundaries and CSV poverty data, then renders them via a Mercator projection and `d3.geoPath`. Hovering reveals state names and exact poverty percentages in a tooltip, while a gradient legend with an axis provides context. States missing data appear gray. The code uses `d3.scaleSequential` for color mapping, `topojson.feature` for geometry conversion, and `d3.axisBottom` for the legend ticks.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Assignment_8_Making maps

A choropleth map of India colors each state by its poverty rate, measured as the headcount ratio percentage, using a sequential yellow-to-red color scale with gray for missing data. The visualization loads Indian state boundaries from a TopoJSON file and joins them with poverty data from a CSV. The code uses d3.geoPath with a Mercator projection to draw the SVG paths, plus d3.scaleSequential and d3.axisBottom for a horizontal legend, with hover tooltips via SVG title elements.

Ssravya7136@gmail.com
90% 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 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 visualization displays a choropleth map of Indian states, colored with a categorical scheme and labeled with state names at their geographic centroids. Using D3 v5, it loads TopoJSON data for India’s administrative boundaries, removes the first feature, and projects the geometry with `geoMercator`. Paths are generated via `d3.geoPath`, while text labels are positioned using `pathGenerator.centroid`. The SVG rendering includes hover titles and a color scale from `scaleOrdinal(schemeCategory10)`, with styling applied through CSS.

DDINESH SAI BOPPANA
83% match
Loading thumbnail…

Fork of Fork of Data visualization ICE-8 Country map

This visualization displays a choropleth map of Indian states, with each state filled by a categorical color and labeled with its name at its centroid. It uses D3.js v5 with topojson to load and parse Indian state boundary data from a remote TopoJSON file, then renders the shapes as SVG paths via `d3.geoPath` and a Mercator projection. The code applies a `scaleOrdinal` color scheme to differentiate regions and appends text elements positioned using `pathGenerator.centroid`, demonstrating a basic geographic data mapping workflow.

Vvamshisoletii
83% match
Loading thumbnail…

Fork of ICE-8

This example shows a choropleth map of Indian states colored with a categorical scale, with each state’s name rendered at its centroid. Using d3.json to load TopoJSON data, the code applies a geoMercator projection and d3.geoPath to generate SVG paths for state boundaries. State names are positioned via pathGenerator.centroid, while a d3.scaleOrdinal assigns colors from schemeCategory10. The map updates hover effects through CSS on the `.states` class, with red strokes outlining each state.

TTekmal-Bhavana
83% match
Loading thumbnail…

Fork of India Map: ICE-8

This visualization displays a choropleth map of Indian states, each filled with a distinct categorical color from D3's `schemeCategory10` and labeled with its name at the centroid. The map uses a `geoMercator` projection from `d3.geoPath`, with state boundaries rendered as SVG paths and stroked black for separation. Data comes from a TopoJSON file of India’s administrative regions, processed via `topojson.feature`, and one feature is removed with `shift()`. Text labels are positioned using `pathGenerator.centroid()`.

RRahulChaitu999
83% match
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
82% match