Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 drag test

Public visualization

D3 drag test

0 stars1🌍 Public
Ggjonor
Last edited Feb 20, 2020
Created on Feb 20, 2020
Forked from HTML Starter

This example demonstrates a draggable splitter that resizes two adjacent panes in a web layout. Using D3 v5’s `drag` behavior, dragging the central divider horizontally triggers `event.x` to update each pane’s inline width and reposition the splitter via `setOffset`. The panes hold static text, with dimensions computed from the container’s current pixel width. The implementation uses `select`, `selectAll`, and `style` from D3, plus React for overall structure, and plain CSS for layout and hover cursor styling.

AI-generated description

A bare minimum HTML page.

See also React Starter.

Comments

Sign in to join the discussion.

MIT Licensed