Stacked Bar Chart with Index Labels placed inside - CanvasJS
HTML5 Stacked Bar Chart with Index Labels placed inside
HTML
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
JavaScript
var chart = new CanvasJS.Chart("chartContainer", {
title:{
text:"Test"
},
animationEnabled: true,
axisX:{
interval: 1,
labelFontSize: 12,
lineThickness: 1
},
axisY2:{
valueFormatString: "$0",
lineThickness: 1,
tickLength: 0,
labelFontSize: 12,
interval: 2500,
},
legend:{
verticalAlign: "top",
horizontalAlign: "center"
},
data: [
{
type: "stackedBar",
name: "Test 1",
showInLegend: true,
axisYType: "secondary",
color: "#7E8F74",
dataPoints: [
{y: 18000, label: "Test 1"},
{y: 16000, label: "Test 2" },
{y: 14000, label: "Test 3" }
]
},
{
type: "stackedBar",
name: "Test 2",
showInLegend: true,
axisYType: "secondary",
color: "#DB9079",
dataPoints: [
{y: 10323, label: "Test 1" },
{y: 11118, label: "Test 2" },
{y: 4000, label: "Test 3" }
]
}
]
});
chart.render();