This React 100% Stacked Line Chart example visualizes the family expenses with 100% stacked line series to identify who spent more money in each category. Data points are enhanced with markers and tooltips.
In this example, you can see how to render and configure the 100% stacked line chart. This chart displays multiple series of data as stacked lines, ensuring that the cumulative proportion of each stacked element always totals 100%. Markers are used to represent individual data and its values.
Tooltips are enabled in this example. To see a tooltip in action, hover over a point or tap on a point in touch enabled devices.
Injecting Module
Chart component features are segregated into individual feature-wise modules. To use 100% stacking line series, we need to inject
StackingLineSeries module into services.
More information about the 100% stacked line series can be found in this documentation section.