This isn't supported natively but is quite easy to achieve with two canvas
tags that are positioned so that one is on top of the other (as you can see
below). The rear canvas draws the same Bar chart as the front one but
without any data - so you can just see the grid. The front canvas draws the Bar
chart - and then a custom draw
event uses the standard canvas clearRect()
function to return bits of the top canvas back to transparency. So
the grid on the rear canvas then shows through.
<script src="RGraph.common.core.js"></script> <script src="RGraph.bar.js"></script>Put this where you want the chart to show up:
<div style="padding: 15px"> <canvas id="cvs1" width="750" height="250" style="position:absolute; top: 0; left: 0">[No canvas support]</canvas> <canvas id="cvs2" width="750" height="250" style="position:absolute; top: 0; left: 0">[No canvas support]</canvas> </div>This is the code that generates the chart: