This is a demonstration of a filled spline Line chart with two datasets. It uses the filledAccumulative option in order to "stack" the datasets and also has the trace effect. Notice also that there's a small hmargin set.
This goes in the documents header:<script src="RGraph.svg.common.core.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,1,5,12,5,3,6,4,9,9], [8,2,6,15,10,5,5,8,6,8,9,5] ], options: { yaxis: false, backgroundGridVlines: false, backgroundGridBorder: false, xaxisLabels: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'], hmargin: 15, marginLeft: 75, marginRight: 25, marginBottom: 35, yaxisScaleUnitsPre: '$', spline: true, filled:true, filledAccumulative: true, linewidth: 0, filledOpacity: 0.3, title: 'A filled spline chart', titleFont: 'Arial black', titleItalic: true, titleColor: 'gray' } }).trace(); </script>