Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Responding to Resize

Public visualization

Responding to Resize

0 stars0🌍 Public
KkarthikLingeswaran
Last edited Jun 3, 2020
Created on Jun 3, 2020

This example demonstrates how a D3.js visualization can respond to browser resizing by redrawing an SVG to fill the viewport. A green X-shaped pair of lines is rendered with thick, semi-transparent strokes, and its dimensions update dynamically whenever the window size changes. The code uses a container `<div>` with CSS `position: fixed` to occupy the full page, then extracts `clientWidth` and `clientHeight` during a `redraw` function. It sets the SVG's `width` and `height` attributes accordingly and rebinds line coordinates via `selectAll` and `merge`, with a `resize` event listener triggering updates.

AI-generated description

Comments

Sign in to join the discussion.

MIT Licensed