React Area Chart is an extension of Line Chart where the region between the line and the baseline is filled with color. Area Charts are useful when you are interested in cumulative totals over a period of time or range of values. React Component lets you create Area Charts using a straight line or curved line (Spline-Area) or a staircase shaped line called Step-Area chart. It is also possible to stack one series on top of another using Stacked Area Chart & Stacked Area 100% Chart.
To make visualization better, markers are shown for every datapoint when there are less number of datapoints. However, markers will be hidden when the number of datapoints are large. Markers are generally used to highlight individual datapoints.
Area Charts are useful when you are interested in cumulative totals over a period of time or range of values.
Spline Area Chart is similar to area chart except that the envelope of area is a smooth curve.
Step Area charts are drawn by connecting the data points using vertical and horizontal lines and shading the enclosed area.
Stacked Area is formed by stacking multiple data-series one on top of the other.
Stacked Area 100% is similar to “Stacked Area” except that areas are rendered as a percentage of total value at any given point.
Most commonly used features in React Area Chart includes markers, colors, opacity, index-labels, etc.
Typically, React Area Charts perform well with default settings when you have up to 100,000 data points. However, if you are facing any issues with performance, there are few tweaks that you can do in order to make the chart render faster.