{"version":"1.0","type":"rich","title":"react zoom transition","description":"This example demonstrates a zoomable React component that applies a D3 zoom behavior to any SVG content, shown here with a large “Hello, World!” text element. The `ZoomContainer` component uses `d3.zoom()` and its `zoom` event to capture the current transform, storing it in React state via `useState`, then applies that transform as `translate` and `scale` attributes on a `<g>` element. The `Stage` component provides the SVG context through React’s `Context` API, and the `useSvg` hook supplies the DOM node to D3.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/4cad2b027fac408bac6e8763f0ed6785?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}