Mini chart
Score charts
jsx
import MiniChart from '@semcore/ui/mini-chart';NSMiniChart.Score.CommonProps
| Name | Type | Description |
|---|---|---|
| value | number | Value of score (in percents from 0 to 100) or count of selected segments (for Line with segments) |
| color | string | Color of value |
| baseBgColor | string | Color of background |
| loading | boolean | Flag to enable skeleton |
| animate | boolean | Flag to enable animate of charts |
NSMiniChart.Score.Line.Props
& & ( {value: number; color?: ; segments?: number; children?: never } | {value?: never; segments?: never; color?: never; children: })jsx
import MiniChart from '@semcore/ui/mini-chart';
<MiniChart.ScoreLine />NSMiniChart.Score.Donut.Props
&jsx
import MiniChart from '@semcore/ui/mini-chart';
<MiniChart.ScoreDonut />
<MiniChart.ScoreSemiDonut />Trend charts
NSMiniChart.Trend.CommonProps
& {...}| Name | Type | Description |
|---|---|---|
| animate | boolean | Flag to enable animate of charts |
| loading | boolean | Flag to enable skeleton |
| data | any[] | Data for chart |
NSMiniChart.Trend.Line.Props
& {...}| Name | Type | Description |
|---|---|---|
| data | number[] | List of values |
| color | string | Color of line |
| lastPointColor | string | Color of last point in chart |
| lastPointRadius | number | Radius for last point item |
jsx
import MiniChart from '@semcore/ui/mini-chart';
<MiniChart.TrendLine />
<MiniChart.TrendArea />NSMiniChart.Trend.Bar.Props
& {...}| Name | Type | Description |
|---|---|---|
| data | [] | Data to bar chart |
jsx
import MiniChart from '@semcore/ui/mini-chart';
<MiniChart.TrendBar />
<MiniChart.TrendHistogram />