{"version":"1.0","type":"rich","title":"Zoom to Bounding Box with translateExtent","description":"Clicking a U.S. state zooms the map to that state’s bounding box, with a smooth 750-millisecond transition, while a gray mesh outlines all state boundaries. The view also resets to the full country when clicking the background. Built with D3 v4, the example uses `d3.zoom` with a `translateExtent` that constrains panning, `d3.geoPath` and `d3.geoAlbersUsa` for rendering TopoJSON state features as SVG paths, and `zoom.transform` to animate the zoom. The active state highlights in orange, and stroke widths scale inversely with the zoom level.","provider_name":"VizHub AI Studio","provider_url":"https://next.vizhub.com","html":"<iframe src=\"https://next.vizhub.com/viz/gist-30ecd2a1e140ca5f7bbae227cfc8552e?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"1\"></iframe>","width":960,"height":500,"cache_age":3600}