Dual Axis Time Series
Dual y-axis chart with recession indicators and time range selection. Perfect for comparing two metrics with different scales.
Preview placeholder
timeseries-dual-axis-v1
Installation
npx @ontopic/viz add recharts/generic/timeseries-dual-axis-v1Props
| Prop | Type | Description |
|---|---|---|
data | DualAxisData[] | Data with two value columns |
yAxisLeft | AxisConfig | Left axis configuration |
yAxisRight | AxisConfig | Right axis configuration |
See full TypeScript interface on GitHub for all props.
Usage Example
import { DualAxisTimeSeries } from '@/viz/components/recharts/generic/timeseries-dual-axis-v1';Metadata
- Last Updated2025-01-12
- FrameworkRecharts
- CategoryTime Series
- Subcategorygeneric
Dependencies
Quick Install
npx @ontopic/viz add recharts/generic/timeseries-dual-axis-v1Related Components
Time Series Line Chart
Multi-group trends with presidential context, confidence interval toggles, and interactive legend. Ideal for tracking indicators over time with demographic breakdowns.
Basic Time Series
Simple line chart with error bars for straightforward time series visualization without complex features.
Indexed Time Series
Indexed comparison normalized to a base period with recession bands. Useful for comparing growth rates across different metrics.
Economic Time Series
Economic data visualization with recession shading and brush selector for time range filtering.