{"version":"1.0","type":"rich","title":"Zoom Skeleton","description":"This example demonstrates a zoomable SVG visualization built with React and D3, showing a simple text label that can be panned and scaled using the mouse wheel or drag gestures. The code fetches JSON data and performs data transformations with `d3.rollup` and `d3.filter`, though the rendered output remains minimal. The zoom behavior is implemented via `d3.zoom`, which updates a React state transform that is applied to a group element using SVG `transform` attributes. The visualization uses React hooks like `useState`, `useEffect`, and `useContext` to manage the SVG stage and zoom container, with D3’s event handling integrated through the `select` API.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/65ee45003b9046dcbda76b8049e21770?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}