HTML5 & JS Stacked Area Charts

Stacked Area Charts are Multi-Series Area Charts plotted together with aligned x values, such that at any point it shows cumulative total of that point for all series. Each dataSeries should contain type as stackedArea.

Cannot be combined with: Doughnut, Pie, Bar, Stacked Bar charts.




Stacked Area Chart Specific Properties

Applies To Attribute Type Default Options/Examples
dataSeries/ dataPoint markerType String “circle” “none”, “circle”, “square”, “cross”, “triangle”
dataSeries/ dataPoint markerColor String dataSeries Color “red”,”#1E90FF”..
dataSeries/ dataPoint markerBorderColor String dataSeries Color “red”,”#1E90FF”..
dataSeries/ dataPoint markerSize Number auto 5,10..
dataSeries/ dataPoint markerBorderThickness Number 0 4,7..
dataSeries lineThickness Number 2 4,7..
dataSeries fillOpacity Number .7 .2,.4,1 etc


Basic Stacked Area Chart

Try it Yourself by Editing the Code below.


Stacked Area Chart With Additional Customization

Try it Yourself by Editing the Code below.





If you have any questions, please feel free to ask in our forums.Ask Question

Comment