Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 linear slider

Public visualization

D3 linear slider

0 stars1🌍 Public
AAlpineStranger
Last edited Oct 29, 2022
Created on Oct 27, 2022
Forked from D3 Starter

This example shows a draggable linear slider rendered as an SVG triangle handle that moves along an axis. Dragging the handle updates a numeric value between 34 and 100, logged to the console via a callback. The slider is built using D3 v7's `scaleLinear` for positioning, `axisBottom` for tick marks, and `drag` for user interaction. The handle is drawn with `symbol` and `symbolTriangle`, while `slideScale.invert` converts the dragged position back into the data domain.

AI-generated description

Linear slider using D3

Comments

Sign in to join the discussion.

MIT Licensed