Chart

The Chart component renders simple charts and graphs. Currently supports bar, line, and pie charts.

Usage

<Chart 
  type="bar" 
  data={[
    { label: "Jan", value: 10 },
    { label: "Feb", value: 20 },
    { label: "Mar", value: 15 }
  ]} 
/>

Props

string

required

Type of chart: bar, line, pie, doughnut.

array

required

Array of data points { label: string, value: number, color?: string }.

number

default:"200"

Height of the chart in pixels.

boolean

default:"true"

Show X-axis labels.

boolean

default:"true"

Show Y-axis labels.

Examples

Pie Chart

<Chart 
  type="pie" 
  data={[
    { label: "Mobile", value: 60, color: "blue" },
    { label: "Desktop", value: 40, color: "green" }
  ]} 
  height={250} 
/>

Overview

Components

Guides

Chart

Chart

Usage

Props

Examples

Pie Chart

​Chart

​Usage

​Props

​Examples

​Pie Chart

Chart

Usage

Props

Examples

Pie Chart