Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Viewing a saved revision (read-only)

547608c492d84190a70418434c5dd8e2

Responding to Resize

0 stars0🌍 Public
ZZhang Shengli
Last edited Sep 23, 2019
Created on Sep 23, 2019

This example demonstrates how a D3.js v5 visualization can dynamically respond to browser resizing. It draws two thick green lines forming an X shape that always spans the full width and height of the chart container. The code uses CSS positioning to fill the viewport, then extracts the container’s `clientWidth` and `clientHeight` in a `redraw` function to update the SVG’s dimensions. A window `resize` event listener triggers `redraw`, which rebinds and updates the line elements through D3’s data join pattern.

AI-generated description