Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Viewing a saved revision (read-only)

1962ca3ec3434c1b9e44a85bda2736ee

Responding to Resize

0 stars0🌍 Public
JJai Aswani
Last edited Apr 5, 2020
Created on Apr 5, 2020

This example demonstrates how a D3.js visualization can respond dynamically to browser resizing. A full-screen SVG element displays a large green X composed of two diagonal lines, with the chart container styled to fill the viewport using fixed CSS positioning. The `redraw()` function extracts the container’s current dimensions via `clientWidth` and `clientHeight`, then updates the SVG’s width and height attributes and adjusts the line coordinates accordingly. A window `resize` event listener triggers a redraw on every size change, ensuring the graphic always fits the available space.

AI-generated description