This is a mockup of an old Line chart demo, that was for a long time, used on the front page of the website. The spline option is enabled, it has a thick linewidth and it's using the trace effect.
This goes in the documents header:<script src="../libraries/RGraph.svg.common.core.js" ></script> <script src="../libraries/RGraph.svg.line.js" ></script>
<div style="width: 450px; height: 250px" id="chart-container"></div>This is the code that generates the chart:
<script>
var line = new RGraph.SVG.Line({
id: 'chart-container',
data: [
[4,6,12,16,8,4,2,8,18,16,14,16],
[2,4,8,4,2,6,6,12,8,10,6,8]
],
options: {
xaxisLabels: ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'],
yaxisUnitsPost: '%',
xaxisTextColor: '#333',
yaxisTextColor: '#333',
gutterLeft: 40,
gutterTop: 35,
gutterRight: 15,
gutterBottom: 50,
colors: ['red','black'],
linewidth: 7,
shadow: true,
shadowBlur: 3,
shadowOpacity: 0.25,
spline: true
}
}).trace();
</script>