This is a demonstration of a chart that has been significantly customised to look like Google Search Console (formerly Google Webmaster Tools). You can see from the source code below that there's not a whole lot of configuration that is required to achieve this chart.
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: 100px" id="chart-container"></div>This is the code that generates the chart:
<script> new RGraph.SVG.Line({ id: 'chart-container', data: (function () { var arr = []; for (var i=0; i<90; ++i) { arr.push(RGraph.SVG.random({min: 150, max: 450})) } return arr; })(), options: { colors: ['blue'], linewidth: 1, yaxisMax: 1200, backgroundGridVlines: false, backgroundGridBorder: false, xaxis: false, yaxis: false, yaxisLabelsCount: 2, yaxisTextColor: '#aaa', yaxisLabelsOffsety: 10, yaxisLabelsOffsetx: 10, yaxisLabelsHalign: 'left', gutterTop: 5, gutterBottom: 5, gutterLeft: 50, textSize: 8, hmargin: 35 } }).draw(); </script>