{"version":"1.0","type":"rich","title":"Responding to Resize","description":"This example demonstrates how a D3.js visualization can respond dynamically to browser window resizing. It shows a full-page SVG containing a large green X shape, where the X’s endpoints are recalculated to match the current viewport dimensions whenever the window is resized. The code uses `d3.select` to append an SVG element to a fixed-position chart container, then defines a `redraw` function that reads the container’s `clientWidth` and `clientHeight` properties to update the SVG’s `width` and `height` attributes. It binds the X’s line coordinates through D3’s data join pattern, and registers the `redraw` function as a listener for the browser’s `resize` event.","provider_name":"VizHub AI Studio","provider_url":"https://vizhub.com","html":"<iframe src=\"https://vizhub.com/viz/3e32d4007be2484b9f2ade70d69d4427?mode=embed\" width=\"960\" height=\"500\" scrolling=\"no\" frameborder=\"0\"></iframe>","width":960,"height":500,"cache_age":3600}