ElementStacks
HTML
<script src="http://highcharts.com/js/testing.js"></script>
<div id="container" style="height: 400px"></div>
JavaScript
var cTest;
var gTitle = "Title";
var gSubTitle = "SubTitle";
var gxCategories = ["2011","2010", "2009"];
var gxTitle = "xaxis";
var gyTitle = "Y axis title";
var gSeries = [{"name": "Test Score #1", "data": [[1,69.6],[0,71.9]]},
{"name": "Test Score #2", "data": [[1,79.6],[2,81.9]]},
{"name": "Test Score #3", "data": [[1,72],[0,73.1]]}];
$(document).ready(function () {
MakeTSChart();
});
function MakeTSChart() {
cTest = new Highcharts.Chart({
chart: {
renderTo: "container", defaultSeriesType: "bar"
},
title: { text: gTitle },
subtitle: { text: gSubTitle },
xAxis: { categories: gxCategories,
title: { text: gxTitle }
},
legend: { enabled: false },
yAxis: { title: { text: gyTitle }, min: 0, max: 100 },
tooltip: { enabled: true,
formatter: function () { return this.series.name + " (" + this.x + "): " + this.y; }
},
plotOptions: { bar: { dataLabels: { enabled: true, connectNulls: true, rotation: 0, color: "#000000", align: "right", x: -5, y: 5, formatter: function() { return this.series.name; } },
enableMouseTracking: true
}
},
series: gSeries
});
}