Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Viewing a saved revision (read-only)

b235350976b9489289654ebd69c616cf

Responding to Resize

0 stars0🌍 Public
Kkosakase
Last edited Oct 30, 2019
Created on Oct 30, 2019

This example demonstrates how a D3.js visualization can automatically adapt to its container size. A green X-shaped set of lines is drawn inside an SVG, and the entire graphic redraws whenever the browser window is resized. The code uses a fixed-position `#chart` div that fills the page, with `clientWidth` and `clientHeight` extracting the computed dimensions. Those values then set the SVG’s `width` and `height` attributes, and the lines are repositioned via a `redraw` function wired to the window’s `resize` event. The rendering uses SVG elements and D3’s data join pattern.

AI-generated description