<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" style="background-color: #70AD47"> [No canvas support] </canvas>This is the code that generates the chart:
<script> window.onload = function () { var line = new RGraph.Line({ id: 'cvs', data: [ 1.2,1.5,1.4,1.6,1.3,1.2,1.4,1.45,1.6,1.4, 1.23,1.33,1.29,1.5,1.4,1.43,1.2,1.1,1.09,1.4, 22.5,20.5,29.63,23.44,27.54,51.23,60.23 ], options: { title: 'A green line chart with custom drawing (the vertical lines)', titleColor: 'white', backgroundColor: '#70AD47', backgroundGrid: false, colors: ['white'], tickmarks: null, noyaxis: true, textColor: 'white', unitsPost: ',000k', gutterLeft: 70, gutterTop: 35, gutterRight: 35, gutterBottom: 55, noxicks: true, axisColor: '#ddd', numxticks: 0, textSize: 12, labels: [ '10-Sep','\n11-Sep','12-Sep','\n13-Sep','14-Sep','\n15-Sep','16-Sep','\n17-Sep','18-Sep','\n19-Sep', '20-Sep','\n21-Sep','22-Sep','\n23-Sep','24-Sep','\n25-Sep','26-Sep','\n27-Sep','28-Sep','\n29-Sep', '30-Sep','\n1-Oct','2-Oct','\n3-Oct','4-Oct','\n5-Oct','6-Oct','\n7-Oct' ], textAccessible: true } }).on('draw', function (obj) { var co = obj.context; for (var i=0; i<obj.coords.length; ++i) { var grad, coords = obj.coords[i], y2 = obj.canvas.height - obj.get('gutterBottom'), co = obj.context grad = RGraph.LinearGradient( obj, coords[0], coords[1],coords[0], y2, 'white', 'rgba(255,255,255,0)' ); co.strokeStyle = grad; RGraph.path2( co, 'b m % % l % % s', coords[0], coords[1], coords[0], y2 ); } }).draw(); }; </script>