Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Viewing a saved revision (read-only)

cf9e64cfcc1d4fca85e2ca3fc3a4f32c

Responding to Resize

0 stars0🌍 Public
JJosé
Last edited Jul 18, 2020
Created on Jul 18, 2020

This example demonstrates how a D3.js v5 SVG visualization can respond to browser resizing. The chart container fills the page using CSS, and the `redraw()` function extracts its `clientWidth` and `clientHeight` to set the SVG’s dimensions. It then draws a dynamic X shape—two green lines with 100-pixel stroke width—that always spans the full viewport. A `window` resize event listener triggers `redraw()` on every size change, ensuring the visualization stays responsive without recalculating scales. The rendering relies on SVG elements and direct attribute updates.

AI-generated description