An alternative to the other offset X axis demos - this uses the yaxisScaleMax
and yaxisScaleMin
properties instead of using drawing API objects. It has the
advantage of being significantly easier (and a smaller amount of
code) to implement.
<script src="RGraph.common.core.js"></script> <script src="RGraph.line.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> new RGraph.Line({ id: 'cvs', data: [ [5,1,16,8,9,6,-5], [2,4,15,1,6,15,13] ], options: { yaxisScaleMin: -10, yaxisScaleMax: 20, spline: true, linewidth: 2, xaxisLabels: ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'], yaxisLabelsCount: 3, yaxisTickmarksCount: 3, backgroundGridHlinesCount: 3, marginBottom: 35, marginLeft: 35, marginRight: 35, shadow: false, textSize: 14, xaxisTickmarksCount: 6, yaxisTickmarksCount: 3, linewidth: 3 } }).draw(); </script>