Chart
Tokenized quantitative visualization foundation.
Quantitative instrument
Live readoutSystem throughputTwo-hour samples · requests per minute
81k- Actual
- Capacity
- Actual, 08:00
- 36
- Actual, 10:00
- 52
- Actual, 12:00
- 47
- Actual, 14:00
- 68
- Actual, 16:00
- 63
- Actual, 18:00
- 81
- Capacity, 08:00
- 88
- Capacity, 10:00
- 88
- Capacity, 12:00
- 88
- Capacity, 14:00
- 88
- Capacity, 16:00
- 88
- Capacity, 18:00
- 88
CapacitySubsystem utilizationCurrent load by functional subsystem
70%AllocationWorkspace compositionShare of active resources
100%- Interface
- Data
- Automation
- Other
- Interface
- 42
- Data
- 31
- Automation
- 19
- Other
- 8
CorrelationEfficiency envelopeResponse time against completion rate · point size is volume
- Index
- Response ms 32, Completion % 91
- Resolve
- Response ms 44, Completion % 96
- Render
- Response ms 68, Completion % 89
- Persist
- Response ms 81, Completion % 94
- Export
- Response ms 118, Completion % 86
AccumulationWork completedCumulative output across the same interval
81k- Completed, 08:00
- 36
- Completed, 10:00
- 52
- Completed, 12:00
- 47
- Completed, 14:00
- 68
- Completed, 16:00
- 63
- Completed, 18:00
- 81
<ChartFrame title="System throughput" value="81k">
<LineChart series={series} />
</ChartFrame>Loading, empty, and error states
Loading state
Loading chart…
Empty state
No data available.
Error state
Telemetry unavailable.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| title | React.ReactNode | - | Conclusion-led title rendered by ChartFrame. |
| description | React.ReactNode | - | Encoding, scope, and time-range context. |
| data | CategoricalDatum[] | CartesianSeries[] | - | Typed data consumed by the selected chart graphic. |
| formatValue | (value: number) => string | - | Shared visible and accessible value formatter. |
| loading | boolean | false | Shows the chart loading state in ChartFrame. |
| error | React.ReactNode | - | Shows a readable chart error state. |
| source | React.ReactNode | - | Source or provenance displayed with the chart. |
Import
import { ChartFrame, BarChart, LineChart } from "@uxome/charts";