india map

100%

✓ Published1🌍 Public

Last edited Jul 9, 2022

Created on Jul 9, 2022

Forked from Fork of Fork of Fork of india map

This visualization shows India’s administrative boundaries with district-level polygons filled by state using a categorical color scale, overlaid with state outlines. Pan and zoom are enabled via d3.zoom. The map uses d3.geoMercator projection and d3.geoPath to render TopoJSON data from two external sources: state boundaries and district boundaries. District polygons include hover effects and tooltips displaying district and state names via SVG title elements.

AI-generated description

A bare minimum HTML page.

Similar vizzes

Loading thumbnail…

india map

This interactive visualization displays a choropleth map of India, with district-level polygons colored by state and state boundaries outlined in black. Users can pan and zoom the map using d3.zoom. The map is rendered with SVG paths generated by d3.geoPath and a d3.geoMercator projection. District and state boundaries come from TopoJSON files, with district tooltips showing district and state names on hover. The map uses d3.scaleOrdinal with d3.schemeCategory10 for district coloring.

Bbindhureddy98

94% match

Loading thumbnail…

Map of India

This visualization displays the districts of India as colored polygons, with state boundaries outlined in black. District polygons are colored according to their state, using a categorical color scheme, and each includes a hover tooltip showing the district and state name. The map supports zooming and panning via d3.zoom. The code uses d3.json to load TopoJSON data, d3.geoMercator with clipExtent, and d3.geoPath to render the features.

RRahulChaitu999

93% match

Loading thumbnail…

India map

This interactive map of India displays state and district boundaries as SVG paths, with districts colored by state using a categorical scale. Users can pan and zoom the map via d3.zoom. The visualization uses d3.geoMercator for projection, d3.geoPath to generate paths, and topojson.feature to parse geographic data from TopoJSON sources, including state and district boundary datasets. Hovering over a district path changes its fill to dark green and reveals a tooltip showing the district and state names.

Vvarun-030

92% match

Loading thumbnail…

India Map

This interactive map of India displays state and district boundaries overlaid on a Mercator-projected SVG. Users can pan and zoom the map using d3.zoom, with districts colored via d3.scaleOrdinal and schemeCategory10. Hovering over a district reveals its name and state in a tooltip. The visualization uses d3.geoPath, d3-geo-projection, and topojson to render geographic data from two JSON sources containing state and district boundaries, with text labels placed at path centroids.

Nnikhilagopi

90% match

Loading thumbnail…

INDIA

This interactive visualization presents a map of India, highlighting its states and districts in color. Users can explore the geography through zooming and panning via d3.zoom, while the map’s districts display hover tooltips that reveal district and state names. The visualization uses d3.geoPath with a geoMercator projection to render GeoJSON features built from TopoJSON data, which is sourced from external repositories for Indian state and district boundaries.

Aadapavaishnavi12

90% match

Loading thumbnail…

India Map

This example displays a choropleth map of India with district-level boundaries colored by state and state outlines highlighted in green. Built with React and D3, it uses `d3.geoMercator` for projection, `d3.geoPath` for rendering, and `d3.zoom` for pan and zoom interactions. The visualization renders as SVG, combining TopoJSON data from two sources—one for state borders and another for district polygons. Hovering over districts turns them black, with tooltips revealing district and state names.

Hharika-1929

90% match

Loading thumbnail…

Map - India

This example visualizes the states and districts of India as an interactive SVG map. Users can pan and zoom the map using d3.zoom, while hover states reveal district names via title elements. The visualization uses d3-geoMercator for projection, d3.geoPath for rendering paths, and d3.scaleOrdinal with schemeCategory10 to color districts. Geographic data comes from two TopoJSON sources: India state boundaries and 2019 district boundaries. The code also loads city data from a CSV, though points are not plotted in the final rendering.

Llambda-fox

90% match

Loading thumbnail…

Fork of India Map

This interactive map of India displays state and district boundaries, with each district colored by its state using a categorical color scale. The visualization uses d3.geoMercator for projection, d3.geoPath to render TopoJSON features for both administrative levels, and d3.zoom to enable panning and zooming. Hovering over a district reveals a tooltip with its name and state; the code also attempts to label states with text positioned via path centroids, though that feature is incomplete.

SsreepavanKothapalli

89% match