.md →
CurveEditor API#
Bases: AnyWidget
Chart-space curve editor powered by D3 line interpolators.
Drag knots on an x/y chart and switch among D3's chart-oriented curve factories. Open curves store points in x order so step, monotone, and bump curves behave like normal chart lines instead of freeform paths. Closed curves preserve point order so they can be edited as drawn loops.
Examples:
import marimo as mo
from wigglystuff import CurveEditor
editor = mo.ui.anywidget(CurveEditor(curve="catmull_rom", alpha=0.5))
editor
Create a CurveEditor widget.
Parameters:
| Name | Type | Description | Default |
|---|---|---|---|
points
|
Iterable[dict[str, Any]] | None
|
Initial knots as |
None
|
curve
|
str
|
D3 curve name. One of |
'natural'
|
x_bounds
|
tuple[float, float]
|
Data-coordinate x bounds. |
(0.0, 1.0)
|
y_bounds
|
tuple[float, float]
|
Data-coordinate y bounds. |
(0.0, 1.0)
|
width
|
int
|
SVG width in pixels. |
600
|
height
|
int
|
SVG height in pixels. |
360
|
tension
|
float
|
Cardinal spline tension, clamped to |
0.0
|
alpha
|
float
|
Catmull-Rom alpha, clamped to |
0.5
|
closed
|
bool
|
Whether to append the first point virtually when rendering. |
False
|
playing
|
bool
|
Whether playback starts immediately. |
False
|
loop
|
bool
|
Whether playback wraps from |
False
|
t
|
float
|
Initial path progress in |
0.0
|
interval_ms
|
int
|
Milliseconds between browser playback ticks. |
30
|
duration_ms
|
int
|
Milliseconds for one full |
12000
|
sync_throttle_ms
|
int
|
Minimum milliseconds between playback updates synced to Python. |
250
|
selected_index
|
int
|
Selected point index, or |
-1
|
show_axes
|
bool
|
Whether to render numeric tick marks and labels on the x and y axes. |
False
|
n_samples
|
int
|
Number of points emitted on the |
100
|
**kwargs
|
Any
|
Forwarded to |
{}
|
Source code in wigglystuff/curve_editor.py
154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 | |
current_point #
Return the current path progress point as (x, y).
In Python this is a linear distance approximation through the knots.
The browser syncs x and y from the actual rendered D3 SVG path
whenever the widget is displayed.
Source code in wigglystuff/curve_editor.py
Synced traitlets#
| Traitlet | Type | Notes |
|---|---|---|
points |
list[dict] |
Chart knots as {"x": float, "y": float} in data coordinates. Open curves store points sorted by x-coordinate; closed curves preserve drawing order. |
samples |
list[dict] |
n_samples points along the rendered curve in data coordinates, emitted by the browser after each render. |
x |
float |
Current rendered path x-coordinate at t. |
y |
float |
Current rendered path y-coordinate at t. |
t |
float |
Path progress, clamped to [0, 1]. |
curve |
str |
One of linear, step, step_before, step_after, basis, natural, cardinal, catmull_rom, monotone_x, or bump_x. |
tension |
float |
Cardinal curve tension, clamped to [0, 1]. |
alpha |
float |
Catmull-Rom alpha, clamped to [0, 1]. |
closed |
bool |
Whether to virtually append the first point so the path returns to the start. |
playing |
bool |
Whether playback is currently advancing t. |
loop |
bool |
Whether playback wraps from t=1 to t=0. |
interval_ms |
int |
Milliseconds between browser playback ticks. |
duration_ms |
int |
Milliseconds for one full t=0 to t=1 traversal. |
sync_throttle_ms |
int |
Minimum milliseconds between playback updates synced to Python. |
selected_index |
int |
Selected point index, or -1 when no point is selected. |
show_axes |
bool |
Whether to render numeric tick marks and labels on the x and y axes. |
n_samples |
int |
Number of points emitted on the samples traitlet. Must be at least 2. |
x_bounds |
tuple[float, float] |
Data-coordinate x bounds. |
y_bounds |
tuple[float, float] |
Data-coordinate y bounds. |
width |
int |
SVG width in pixels. |
height |
int |
SVG height in pixels. |
Helper methods#
| Method | Returns | Description |
|---|---|---|
current_point() |
tuple[float, float] |
Current path progress point. In Python this is a linear knot approximation; the browser syncs from the actual rendered D3 path. |