15 Best React Chart Libraries

Charts are an essential part of a web application for data presentation. So below I have listed 15 Best React Chart Libraries among the many on the web that can help you in data visualization.

react-vis

A collection of react components to render common data visualization charts, such as line/area/bar charts, heat maps, scatterplots, contour plots, pie and donut charts, sunbursts, radar charts, parallel coordinates, and tree maps.

react-vis

Victory

A collection of composable React components for building interactive data visualizations .

Victory

vx

The goal is to create a library of components you can use to make both your own reusable chart library or your slick custom one-off chart. vx is largely unopinionated and is meant to be build on top of. Keep your bundle sizes down and use only the packages you need.

vx

BizCharts

Powerful data visualization library based on G2 and React.

BizCharts

react-chartjs-2

React wrapper for Chart.js.

react-chartjs-2

Recharts

Quickly build your charts with decoupled, reusable React components. Built on top of SVG elements with a lightweight dependency on D3 submodules.

Recharts

echarts-for-react

A very simple echarts(v3.0 & v4.0) wrapper for react.

echarts-for-react

React Timeseries Charts

This library contains a set of modular charting components used for building flexible interactive charts. It was built for React from the ground up, specifically to visualize timeseries data and network traffic data in particular.

React Timeseries Charts

Chartkick

Create beautiful JavaScript charts with one line of React.

Chartkick

Chartify

React.js plugin for building customizable charts.

Chartify

react-pivottable

This is a React-based pivot table library with drag’n’drop functionality. It is a React port of the jQuery-based PivotTable.js by the same author.

react-pivottable

rumble-charts

React components for building composable and flexible charts to visualize your data.

rumble-charts

React JSX Highcharts

A project for integrating Highcharts into a React app, with proper React components for each Highcharts/Highstock component. Inspired by Recharts, but for Highcharts, obviously.

React JSX Highcharts

Semiotic

This is a data visualization framework for React. It provides three types of frames (XYFrame, OrdinalFrame, NetworkFrame) which allow you to deploy a wide variety of charts that share the same rules for how to display information. By adjusting the settings of a frame, you can produce very different looking charts that despite their visual difference are the same in the way they model information.

Semiotic

react-native-svg-charts

Creating beautiful graphs in React Native shouldn’t be hard or require a ton of knowledge. We use react-native-svg in order to render our SVG’s and to provide you with great extensibility. We utilize the very popular d3 library to create our SVG paths and to calculate the coordinates.

react-native-svg-charts

Leave a comment

Please be polite. We appreciate that. Your email address will not be published and required fields are marked

This site uses Akismet to reduce spam. Learn how your comment data is processed.