ICE 08 11590101 Country Map

100%

ICE 08 11590101 Country Map

✓ Published1🌍 Public

Last edited Mar 30, 2023

Created on Mar 30, 2023

This choropleth map of India visualizes the country's first-level administrative divisions, with each state filled using a categorical color scheme and labeled with its name. The visualization is rendered as an SVG using D3 v5 and the TopoJSON library, which processes geographic data from a local maps.json file containing IND_adm1 boundaries. The map employs a Mercator projection with custom translation and scaling, and path generation is handled by `d3.geoPath`. State names are positioned using the projection's centroid function, and the design features a gradient background with white state borders that highlight on hover.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

ICE 08 11540905 India Map

This example displays a choropleth map of India with each state filled by a categorical color and labeled with its name. It uses a D3 geoMercator projection with custom translation and scaling to position the map, and d3.geoPath to generate SVG paths from TopoJSON data. State names are placed using pathGenerator.centroid, and hover effects change the fill to wheat. The visualization leverages d3.select, scaleOrdinal with schemeCategory10, and topojson’s feature method, with data loaded from a GitHub gist.

Nnagasai-gummadi

91% match

Loading thumbnail…

ICE - 8 - Map

This example visualizes the administrative regions of India as a choropleth map, with each state or territory filled by a distinct color and labeled with its name. It uses D3 v5’s `geoMercator` projection and `geoPath` to render TopoJSON boundaries loaded from a GitHub-hosted India dataset, after removing the first feature. The code applies D3’s `scaleOrdinal` with `schemeCategory10` for coloring, and positions each state label at the computed centroid of its path.

IIndiraSiripurapu

90% match

Loading thumbnail…

India Map: ICE-8

This visualization displays a choropleth map of India's states, with each state filled by a distinct categorical color and labeled with its name at its centroid. The map is rendered as an SVG using the D3.js library, employing a geoMercator projection with specific translation and scaling to position the country. State boundaries are extracted from a TopoJSON file fetched via d3.json, and the d3.geoPath function generates the SVG paths. State labels are placed using the pathGenerator.centroid method, while d3.scaleOrdinal and d3.schemeCategory10 assign the color palette.

PPYATA SHARAN

90% match

Loading thumbnail…

ICE - 8 - Map

This example presents a choropleth map of India's administrative regions, coloring each state according to its name using a categorical color scale. It renders the map with D3's `geoPath` and a Mercator projection, drawing state boundaries as SVG paths with white strokes. Data is loaded from a GeoJSON file hosted on GitHub, processed with `topojson`'s `feature` function, and each state is labeled at its centroid. The visualization uses D3 v5 within a React framework, with styling applied via CSS classes.

Ggunasindhuja

89% match

Loading thumbnail…

ICE - 8 : India Map

This visualization displays a choropleth map of India, with each state filled by a distinct color from a categorical scale based on its name. The map renders as an SVG using D3 v5, with geographic paths generated via `d3.geoPath` and a `geoMercator` projection. State boundaries come from a TopoJSON file parsed with `topojson.feature`, and hover interactions change the fill color through CSS.

MMahitha-Moparthi

89% match

Loading thumbnail…

Country map ICE-8

A choropleth map of Indian states renders each region in a distinct categorical color, with state names shown as hover titles. The visualization uses d3.geoMercator for projection and d3.geoPath to generate SVG paths from TopoJSON data. State boundaries are stroked in black for clarity, while d3.scaleOrdinal with schemeCategory10 assigns the fill colors. The code loads the India states TopoJSON from a remote URL and removes the first feature before rendering.

Ppethavenu

89% match

Loading thumbnail…

ICE 8 - Country Map

This visualization displays a choropleth map of India, with each state filled using a categorical color scheme. It uses `d3.geoMercator` projection and `d3.geoPath` to render the geographic boundaries, with `d3.scaleOrdinal` and `d3.schemeCategory10` for coloring. The map loads TopoJSON data from a GitHub gist via `topojson.feature` and renders as SVG. Hovering over a state turns it orange via CSS, while a title attribute reveals the state’s interpolated color value.

SSheela2930

89% match

Loading thumbnail…

Fork of ICE 08 11540905 India Map

This visualization displays a choropleth map of Indian states, with each state filled by a distinct color from a categorical scale and labeled with its name. The map uses a Mercator projection customized through translation and scaling to center on India. Built with React and D3 v5, the code loads TopoJSON data representing India’s administrative regions, converts it to GeoJSON using `feature`, and renders paths via `d3.geoPath`. State names are positioned using `pathGenerator.centroid`, and hover effects change fill color to wheat.

GGogineni44

89% match