This demonstration shows how you can use the YAxis drawing API object to draw multiple axes on your chart.
This goes in the documents header:<script src="RGraph.common.core.js"></script> <script src="RGraph.drawing.yaxis.js"></script> <script src="RGraph.bar.js"></script>Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="250"> [No canvas support] </canvas>This is the code that generates the chart:
<script> colors = [ 'Gradient(white:red)', 'Gradient(white:brown)', 'Gradient(white:blue)' ]; bar1 = new RGraph.Bar({ id: 'cvs', data: [[2,0,0],[4,0,0],[6,0,0]], options: { colorsStroke: 'rgba(0,0,0,0)', axes: false, yaxisLabels: false, marginLeft: 150, colors: colors, backgroundGridVlinesCount: 3, hmargin: 25, hmarginGrouped: 3, shadowColor: '#666', shadowOffsetx: 2, shadowOffsety: 2, shadowBlur: 2, textSize: 14 } }).draw(); bar2 = new RGraph.Bar({ id: 'cvs', data: [[0,20,0],[0,30,0],[0,40,0]], options: { colorsStroke: 'rgba(0,0,0,0)', axes: false, yaxisLabels: false, marginLeft: 150, colors: colors, backgroundGrid: false, hmargin: 25, hmarginGrouped: 3, shadowColor: '#666', shadowOffsetx: 2, shadowOffsety: 2, shadowBlur: 2, yaxisScaleMax: 50, textSize: 14 } }).draw(); bar3 = new RGraph.Bar({ id: 'cvs', data: [[0,0,70],[0,0,80],[0,0,90]], options: { colorsStroke: 'rgba(0,0,0,0)', xaxisLabels: ['Monday','Tuesday','Wednesday'], yaxis: false, yaxisLabels: false, marginLeft: 150, colors: colors, backgroundGrid: false, hmargin: 25, hmarginGrouped: 3, shadowColor: '#666', shadowOffsetx: 2, shadowOffsety: 2, shadowBlur: 2, yaxisScaleMax: 100, textSize: 14 } }).draw(); yaxis1 = new RGraph.Drawing.YAxis({ id: 'cvs', x: 25, options: { yaxisScaleMax: 10, yaxisLabelsColor: 'red', colors: ['red'], textSize: 14 } }).draw(); yaxis2 = new RGraph.Drawing.YAxis({ id: 'cvs', x: 75, options: { yaxisScaleMax: 50, yaxisLabelsColor: 'brown', colors: ['brown'], textSize: 14 } }).draw(); yaxis3 = new RGraph.Drawing.YAxis({ id: 'cvs', x: 125, options: { yaxisScaleMax: 100, yaxisLabelsColor: 'blue', colors: ['blue'], textSize: 14 } }).draw(); </script>