In normal column one can have multiple columns on one label, like
<script type="text/javascript">
window.onload = function () {
var chart = new CanvasJS.Chart("chartContainer", {
title:{
text: "Fruits sold in First & Second Quarter"
},
data: [ //array of dataSeries
{ //dataSeries - first quarter
/*** Change type "column" to "bar", "area", "line" or "pie"***/
type: "column",
name: "First Quarter",
dataPoints: [
{ label: "banana", y: 18 },
{ label: "orange", y: 29 },
{ label: "apple", y: 40 },
{ label: "mango", y: 34 },
{ label: "grape", y: 24 }
]
},
{ //dataSeries - second quarter
type: "column",
name: "Second Quarter",
dataPoints: [
{ label: "banana", y: 23 },
{ label: "orange", y: 33 },
{ label: "apple", y: 48 },
{ label: "mango", y: 37 },
{ label: "grape", y: 20 }
]
}
]
});
chart.render();
}
</script>
However, I don’t know how to replicate this with stacked charts to create something like this:
| ____ ____
| | | ____ | | ____
6| |__| | | |__| | |
| | | |__| | | | |
| |__| | | | | |__|
3| | | | | | | | |
| | | | | | | | |
|__|__|_|__|___|__|_|__|____
June July
This may already exist as a feature, but I can’t find it.
.
