{"version":"1.0","type":"rich","title":"Fork of react first level drilldown map using zoom","description":"This example demonstrates a two-level drilldown choropleth map of India, showing state boundaries upon initial load and transitioning to district-level boundaries when a state is clicked. The visualization uses React for component state management, with D3 geoMercator projection and geoPath for rendering SVG shapes, and applies a zoom-to-bounding-box transition via d3.zoom and zoomIdentity. The map animates through a 500-millisecond transition, scaling and translating the viewport to focus on the selected region’s geometry, with data fetched from TopoJSON files for both state and district outlines.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/dfaba7148cff446c9289e9a32752d6e0?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}