Here we have an example of a basic Stacked Horizontal Bar chart. There's nothing special about this chart and the background grid horizontal lines have been disabled.
This goes in the documents header:<script src="RGraph.svg.common.core.js"></script> <script src="RGraph.svg.hbar.js"></script>Put this where you want the chart to show up:
<div style="padding: 15px">
<div style="width: 350px; height: 500px" id="chart-container"></div>
</div>
This is the code that generates the chart:
<script>
new RGraph.SVG.HBar({
id: 'chart-container',
data: [[5,4,8],[8,4,6],[6,2,9],[8,8,9],[4,6,3],[8,4,1],[6,5,6]],
options: {
grouping: 'stacked',
yaxisLabels: ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'],
xaxis: false,
backgroundGridHlines: false,
backgroundGridBorder: false,
title: 'A stacked HBar chart',
vmargin: 10
}
}).draw();
</script>