Flat Chart

React

Is new design vision part implemented using new tokens?

Up to date

Storybook

React guidance

Source

GitHub code

Storybook failed to load. Please connect to the VPN to access.


                                                        
                                                        
                                                            import { FlatChart } from '@optimus-web/core';
                                                        
                                                        <FlatChart
                                                          animated={true}
                                                          data={data}
                                                          id="flat-chart"
                                                          title="My flat chart"
                                                          minWidth="400px"
                                                          labelFormatter={capitalize}
                                                          valueFormatter={myFormatter}
                                                          legend
                                                        />

Name	Description	Type	Default
animated?	Apply animation to the chart on load	boolean	true
data	The dataset rendered by the chart	ChartData[]	-
empty?	Sets empty state of chart with default message or you can define custom message	boolean \| { message: ReactNode }	undefined
error?	Sets empty state of chart with default message or you can define custom message	boolean \| { message: ReactNode }	undefined
id?	Sets an unique id for the chart	string	undefined
labelFormatter?	Callback for formatting the label inside the tooltip	LabelFormatter	undefined
legend?	Enables the legend component on top of the chart	boolean	false
loading?	Show skeleton loader	boolean	undefined
minWidth?	Applies min-width to the chart container	string	100%
title?	Chart title, used for aria label, does not render in the UI	string	undefined
valueFormatter?	Callback for formatting the value inside the tooltip	ValueFormatter	undefined

Resources

Example

API