The VScissorsOpen effect first covers the chart with DIV tags and then reveals the it by reducing the height of the DIV tags, alternately tmoving towards the top and the bottom.
This goes in the documents header:<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="RGraph.svg.common.core.js"></script> <script src="RGraph.svg.common.fx.js"></script> <script src="RGraph.svg.line.js"></script>Put this where you want the chart to show up:
<div style="width: 750px; height: 300px" id="chart-container"></div>This is the code that generates the chart:
<script> new RGraph.SVG.Line({ id: 'chart-container', data: [4,8,6,3,5,9,6], options: { linewidth: 5, hmargin: 0, title: 'The vscissorsopen effect', marginLeft: 50, marginBottom: 50, yaxisScaleDecimals: 2, tickmarksStyle: 'circle', tickmarksLinewidth: 5, tickmarksSize: 7, xaxisLabels: ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'], shadow: true } }).vscissorsopen(); </script>