Skip to main content
SimilarExport ZIP
100%

Fork of ICE-8 state map

✓ Published0🌍 Public
Kkollirohit2000
Last edited Apr 14, 2023
Created on Apr 14, 2023
Forked from ICE-8 state map

This visualization displays the state boundaries of Andhra Pradesh, India, using a Mercator projection rendered as SVG paths. The map is built with React and D3 v5, where topojson features are converted to GeoJSON for rendering via `d3.geoPath`. District interiors are highlighted in violet, and individual states change to red on hover. The data originates from a GitHub-hosted TopoJSON file of Indian district boundaries, loaded asynchronously through `d3.json`.

AI-generated description

A demo of the geo-albers-usa-territories projection showing US State boundaries from US Atlas TopoJSON.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of ICE-8 state map

This example displays a choropleth map of the Andhra Pradesh state boundaries, rendered as green SVG paths with white strokes that turn red on hover. It uses the `geoMercator` projection and `geoPath` from d3.v5 to draw the TopoJSON features fetched from a GitHub-hosted Indian district boundary dataset. The React component loads the data with `useEffect` and `d3.json`, processing it through `topojson.feature` and `topojson.mesh`.

BBala Sai Krishna
93% match
Loading thumbnail…

ICE-8 state map

This example displays a choropleth map of the Indian state Andhra Pradesh, rendering its districts as green-filled polygons with white boundaries. The map uses a Mercator projection via `d3.geoMercator` and `d3.geoPath`, with district interiors derived from TopoJSON mesh data. On hover, a district highlights in red. The visualization is built with React, using `useData` to fetch TopoJSON and `Marks` to draw SVG paths, styled with CSS hover effects.

RRaajithaSabbineni
88% match
Loading thumbnail…

Fork of ICE 8 : Country map -India

This visualization displays a choropleth map of India, with each district colored by its state. The map renders state and district boundaries as SVG paths, and hovering over a district highlights it in dark green. Built with React, the code uses D3’s `geoPath`, `geoMercator`, and `scaleOrdinal` to project TopoJSON data from deldersveld and datameet, with zoom functionality enabled.

Rrallabandisushen@gmail.com
87% match
Loading thumbnail…

Fork of India Map: ICE-8

This visualization displays a map of India, with each state rendered as a colored SVG path and labeled with its name. The map uses a spherical Mercator projection, achieved through `d3.geoMercator()` with custom translation and scaling. State boundaries are drawn with a black stroke, and each state’s fill color is assigned from a categorical color scale using `scaleOrdinal` and `schemeCategory10`. State names are positioned at each state’s centroid via `geoPath.centroid()`. The geographic data is loaded from a TopoJSON file containing India’s administrative divisions, processed with the `topojson` library’s `feature` function.

Tttummala17
87% match
Loading thumbnail…

ICE-8: Fork of Indian map with D3.js

This visualization displays a map of India with individual states and their borders. Using D3.js version 5 and React, it applies a geoMercator projection via d3.geoPath to render the geographic features as SVG paths. The code loads TopoJSON data from a remote URL, using topojson.feature and topojson.mesh to extract state polygons and interiors. State fill is cyan with gray borders, while internal boundaries appear teal. The map fits within a 960 by 500 pixel viewport using projection.fitExtent.

Mmanasanimmagadda13
87% match
Loading thumbnail…

Fork of India Map: ICE-8

This visualization displays a choropleth map of Indian states, with each state filled by a color from the d3 schemeCategory10 scale and labeled with its name. It uses d3.geoMercator and d3.geoPath to project and render the TopoJSON data loaded from a GitHub repository, adding interactivity through SVG title elements. The map includes an adjustment that shifts the data array and custom projection settings to frame the country appropriately.

Aamiralitah
87% match
Loading thumbnail…

Fork of ICE 8 country map

This visualization displays a choropleth-style map of India rendered as SVG paths, with each state filled by a categorical color and hover highlighting in yellow. It uses `d3.geoMercator` and `d3.geoPath` to project and draw features from a TopoJSON file fetched via `d3.json`, with `feature` from the `topojson` library for parsing. The color scale employs `d3.scaleOrdinal` with `schemeCategory10`, while zoom is not applied.

Nnagarjuna1968
87% match
Loading thumbnail…

Fork of ICE 8 country map

This visualization displays a choropleth-style map of India rendered as SVG paths, with each state filled by a categorical color and hover highlighting in yellow. It uses `d3.geoMercator` and `d3.geoPath` to project and draw features from a TopoJSON file fetched via `d3.json`, with `feature` from the `topojson` library for parsing. The color scale employs `d3.scaleOrdinal` with `schemeCategory10`, while zoom is not applied.

Nnagarjuna1968
87% match