< DHTMLX Suite 7.2 with a New Form Control, Multiselect Editor for Grid, Custom Scrollbar, and Much More

React Charts

A multi-faceted React chart library based on Material Design. Part of the Suite UI library which provides endless customization and configuration possibilities.

How It Works

5 Quick Steps to Integrate Charts with React
1
Create a Chart.js file and import files and styles of Chart
2
Create Chart class, which extends the Component class
3
Add an empty container for Chart with the reference to it in the el property using the ref property
4
When the component is initialized, initialize Chart and attach the instance of Chart to the container with the reference to it in the el property
5
Specify a set of configuration properties if needed

Product Features

  • Cross-browser compatibility
  • Support for IE11+
  • Full control with JavaScript API
  • Wide customization options
  • Line and Spline charts
  • Bar and X-Bar charts
  • Area and Spline Area charts
  • Pie, Pie 3D, and Donut charts
  • Radar charts
  • Scatter charts
  • Stacked charts
  • Mixed charts
  • Logarithmic scale
  • Custom scale labels
  • Custom templates for tooltips
  • Configurable legend
  • Ability to hide scales and grid lines
  • Ability to show a threshold line and baseline
  • Various shapes of points and markers (circle, triangle, rhombus, etc.)
  • Data loading in the JSON format

Dynamic React Charts - Live Update

With dhtmlxChart you're able to visualize the changes in data happening in real time

Why Choose DHTMLX React Chart Library?

Create well-formed interactive React charts

dhtmlxChart component provides 11 types of charts, each of which is designed to meet different needs. Bar charts, for example, display several data sets, plotted separately side by side or stacked. Pie charts can be represented in 2D and 3D styles. It is possible to combine different chart types on a single figure, e.g., linking line and bar graphs.

Easily adjust your React JS chart

Use DHTMLX feature-rich API to empower your charts with any desirable functionality. Every element can be modified; scales, series, and legend are entirely configurable. You can decide to hide gridlines or make them dashed, add a baseline and a threshold line for illustrating a target value, set a logarithmic scale, and much more.

Adapt your React JS chart library styling

DHTMLX charting library for React brings unlimited customization opportunities to meet your project requirements. Receive complete control over paddings, margins, sizes, and colors of all charts’ parts. You can add custom templates for tooltips and scale labels, apply bar gradient, set colors and transparency of the series filling, etc.

Use Angular and Vue.js wrappers

Apart from charts for React.js, our dev team suggests trying wrappers for the most popular and widely-used frameworks. Enjoy smooth integration into your web apps based on Angular and Vue.js. You can evaluate the capabilities of dhtmlxSuite UI components for free during a 30-day trial period.

Support & Learning Resources

We provide comprehensive documentation with technical samples. Moreover, our dedicated support team is fast and qualified. Find the suitable way to get support:

Other Suite Components

dhtmlxChart Licensing

Individual Commercial Enterprise Ultimate
License Terms
Individual
Commercial
Enterprise
Ultimate
Developers
Individual
1
Commercial
5
Enterprise
20
Ultimate
Projects
Individual
1
Commercial
1
Enterprise
5
Ultimate
Use in SaaS
Individual
Commercial
Enterprise
Ultimate
Perpetual distribution rights
Individual
Commercial
Enterprise
Ultimate
Support Plan
Individual
Standard Support
Commercial
Premium Support
Enterprise
Premium Support
Ultimate
Ultimate Support
Time Period
Individual
1 year
Commercial
1 year
Enterprise
1 year
Ultimate
1 year
Updates
Individual
Minor & major updates
Bug fixes
Commercial
Minor & major updates
Bug fixes
Enterprise
Minor & major updates
Bug fixes
Ultimate
Minor & major updates
Bug fixes
Emergency bug fixes
Support requests
Individual
10
Commercial
30
Enterprise
50
Ultimate
Response Time
Individual
72h
Commercial
48h
Enterprise
48h
Ultimate
24h
Personal Account Manager
Individual
Commercial
Enterprise
Ultimate
demo-screenshot

File manager built with the help of Suite components: Layout, Grid, DataView, Toolbar, etc.

Up to 40% off

If you choose the whole Suite library instead
of buying DHTMLX UI components separately:

Suite Individual - $799

Suite Commercial - $1699

Suite Enterprise - $3499

Suite Ultimate - $6999

If you have an open-source (GNU GPL v2) project and you are not interested in PRO features, you may use DHTMLX Chart Standard Edition for free.
It comes without official technical support, but you can use the community forum instead.

Need help with DHTMLX Chart integration into your app? Contact us