Amazing React Charts

A simple library to create and handling awesome canvas charts.

This package is based on echarts and echarts-for-react wrapper.

Installation

Amazing React Charts is avaliable as a NPM package.

• With npm:

npm install --save amazing-react-charts

• With yarn:

yarn add amazing-react-charts

Usage

Here is a quick example to get you started, it's all you need:

import VerticalBarChart from 'amazing-react-charts'

<VerticalBarChart
    color='green'
    xType='time'
    barWidth={ 100 }
    yComplement='%'
    tooltip={{ 
        label: 'Axis x tooltip label',
        result: 'Axis y tooltip label'
    }}
    data={[
        { label: 'value 1', result: 50 },
        { label: 'value 2', result: 21 },
        { label: 'value 3', result: 84 },
        { label: 'value 4', result: 79 }
    ]}
/>

Demo

To run the demo:

git clone https://github.com/nginformatica/amazing-react-charts.git

yarn && yarn start

Components

• AreaChart
• HorizontalBarChart
• StackedBarChart
• VerticalBarChart
• PieChart
• CoordinateLineChart
• DonutChart
• LineChart
• PictorialChart

Special Components

• AudiometryChart
• ForecastAreaChart

Next Components

• CalendarChart
• ClusteredBarChart
• RadarChart

Documentation

Check out our documentation website.

Contributing

Bug reports, feature requests and other contributions are more than welcome!
Whenever possible, please make a pull request with the implementation instead of just requesting it.

If the feature is big, open an issue first for discussion.

The descriptions of the props used on this package are found in: https://echarts.apache.org/en/option.html

License

This project is licensed under the terms of the MIT license.