Syncfusion Feedback

Basic charts

React Line chart

Line chart

Line charts display data over time, highlighting trends at continuous intervals.

Column chart

Column chart

Vertical bar charts provide a clear visual comparison of distinct sets of data.

React Area chart

Area chart

Similar to line charts, area charts display data as continuous lines, but with the space beneath the line filled in.

React Bar chart

Bar chart

To compare values among categories, data can be represented using horizontal bars.


Spline charts

React Spline chart

Spline chart

Data points are connected by a smoothly flowing line.

React Spline area chart

Spline area chart

Smooth lines connect the data points and the space beneath the lines is filled in.


Step charts

React Step line chart

Step line chart

Connect data points using vertical and horizontal lines to represent step-like progression.

React Step area chart

Step area chart

Like the step line chart, but with the areas connected to the lines shaded.


Stacked charts

React Stacked bar chart

Stacked bar

Horizontal, stacked bars plot layered data points to show the contribution of each part to the total value.

React Stacked column chart

Stacked column

Data points are plotted one above the other using vertical bars.

React Stacked area chart

Stacked area

Like the area chart, but with the data points stacked on top of each other.

React Percent stacked area chart

100% stacked area

Shows the contributing percentages of multiple data series in stacked columns. The cumulative value of each stacked column is always 100%.

React Percent stacked bar chart

100% stacked bar

Shows the contributing percentages of multiple data series in stacked bars. The cumulative value of each stacked bar always totals 100%.

React Percent stacked column chart

100% stacked column

Shows the contributing percentages of multiple data series in stacked columns. The cumulative value of each stacked column is always 100%.


Range charts

React Range area chart

Range area chart

Shows variations in the data values for a given time. The area between the beginning and end of the range is filled.

React Spline range area chart

Spline range area chart

Similar to the range area chart, except that the data points are connected by a smooth line.

React Range column chart

Range column chart

Like the column chart, but this shows the variations in the data values for a given time using vertical bars.


Correlation charts

React Scatter Chart

Scatter

A scatter plot displays each data point using two numerical variables to reveal the relationship between them.

React Bubble Chart

Bubble

Data is visualized with three numerical dimensions, where the third is indicated by the size of the bubble.

React Combination chart

Combination chart

Combination charts, or mixed charts, combine different chart types in one display to enhance data interpretation.


Circular charts

React Pie chart

Pie chart

Displays proportions of whole among different categories.

React Donut chart

Donut chart

Similar to a pie chart, but with an open space at the center.


Financial charts

React Candle chart

Candle chart

Used in the stock market to represent the high, low, open, close values of a stock with candle structures.

React OHLC chart

OHLC chart

Used in the stock market to represent the high, low, open, close values of a stock with OHLC structures.

React Hilo chart

Hilo chart

Shows the high and low values of the stock over the given period of time.


Pure React Components

Developed using React’s core principles, this library employs functional components and hooks without any external dependencies.

Scroll up icon