Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Piano spline

Public visualization

Viewing a saved revision (read-only)

d758d7c79f1a4975943c5073fbbe23f0

Piano spline

0 stars0🌍 Public
SSoumyaranjan Pal
Last edited Jan 25, 2023
Created on Jan 24, 2023
Forked from HTML Starter

This example visualizes a dataset of 88 (x, y) points—reminiscent of piano keys—by drawing a smooth Catmull-Rom spline through them in SVG. It uses a JavaScript implementation of the spline with adjustable parametrization (uniform, centripetal, or chordal) to compute Bézier control points. The chart displays red input-point paths, blue spline points with interactive hover highlighting, and a side panel listing values for each point, rendered via native DOM and SVG APIs.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.