Fieldbook
Sign in

Charts

Series Switch Trend

A ninety-day trend line with two total tiles in the header; picking a tile morphs the line to that series and tweens the stroke to its accent.

Using Series Switch Trend

A ninety-day trend line with two total tiles in the header; picking a tile morphs the line to that series and tweens the stroke to its accent.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: primaryColor, secondaryColor, days, strokeWidth, showGrid

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

Dotted Trend Line
2294Dotted Trend LineChartsA smooth single series curve with a filled marker on every point and a ringed marker that snaps to whichever point the pointer is nearest.
Plain trend line
2288Plain trend lineChartsA minimal single series line chart with a smooth undecorated curve and no point markers, kept as bare and legible as a trend line can be.
Straight segment line
2289Straight segment lineChartsA bare single series chart drawn as straight segments from point to point, with no markers, so every turn in the data stays exactly where it happened.
Wiping multi series line
1903Wiping multi series lineChartsA multi series line chart that wipes in on first paint, glides to a new range as the data changes, and shows a snapping crosshair readout across every series.
Category dot line
2287Category dot lineChartsA single smooth curve across five named categories where each point marker is colored from a hue-rotated accent ramp, so the markers double as the legend.
Forecast tail line
1859Forecast tail lineChartsA dashed continuation that carries a series past its last real point to a horizon, drawing itself out and landing on a hollow marker.