Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Viewing a saved revision (read-only)

c19410cce3a24337b0ada7bed550b715

Responding to Resize

0 stars0🌍 Public
DDimitarDraganov
Last edited Jun 16, 2020
Created on Jun 16, 2020

This example demonstrates how to create an SVG visualization that dynamically responds to browser resizing. It uses CSS fixed positioning to make the chart container fill the viewport, and then extracts the computed `clientWidth` and `clientHeight` to set the SVG element’s dimensions. The visualization draws two crossing green lines forming an X, demonstrating that the size is correct. The code uses D3 v5 for DOM selection and SVG element creation, and listens for window resize events to call the `redraw()` function, which updates the line coordinates to span the full width and height of the container.

AI-generated description