This is a basic example that shows two charts on the same page. Both charts are created on seperate canvas tags and in the window.onload event.
This goes in the documents header:<script src="RGraph.common.core.js"></script> <script src="RGraph.common.tooltips.js"></script> <script src="RGraph.common.dynamic.js"></script> <script src="RGraph.pie.js"></script> <script src="RGraph.bar.js"></script>Put this where you want the chart to show up:
<canvas id="cvs1" width="300" height="250">[No canvas support]</canvas> <canvas id="cvs2" width="300" height="250">[No canvas support]</canvas>This is the code that generates the chart:
<script>
window.onload = function ()
{
var bar = new RGraph.Bar({
id: 'cvs1',
data: [12,13,16,15],
options: {
textAccessible: true,
gutterLeft: 35,
colors: ['red'],
labels: ['Kev', 'Brian', 'Fred', 'John'],
tooltips: ['Kev', 'Brian', 'Fred', 'John']
}
}).draw();
var pie = new RGraph.Pie({
id: 'cvs2',
data: [8,4,9,5,6,8],
options: {
labels: ['Rachel','Luis','June','Kevin','Pete','Lou'],
textAccessible: true,
textColor: '#999'
}
}).draw();
};
</script>