Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

D3 Line - Curve

Public visualization

Viewing a saved revision (read-only)

08dc1312ce38426483d80fc51950e25a

D3 Line - Curve

0 stars1🌍 Public
SSubhendu Karmakar
Last edited Dec 29, 2023
Created on Dec 29, 2023

Two SVG panels compare a standard D3 line path with a curved variant using D3 version 7. The code draws a linear path through six explicit coordinate points (x, y), then applies `d3.curveCardinal` to the same data via `d3.line().curve()` to produce a smoother interpolation. Each panel renders the resulting path as an SVG `<path>` element using the `lineGenerator` and `curveGenerator` functions, overlaid with reference circles marking the original data points. The example demonstrates how the curve generator modifies the path data without changing the underlying dataset.

AI-generated description

D3 Scales - scaleTime()