An SVG Line chart showing UFO sightings over the past century.

A straight-forward Line chart that is showing UFO sightings over the past century. As you can see - peoples inventiveness is clearly on the increase! The chart uses a gray background with a white grid on top along with a black colored line.

This goes in the documents header:

<script src="../libraries/RGraph.svg.common.core.js" ></script>
<script src="../libraries/RGraph.svg.line.js" ></script>

Put this where you want the chart to show up:

<div style="width: 750px; height: 250px" id="chart-container"></div>

This is the code that generates the chart:

<script>
    line = new RGraph.SVG.Line({
        id: 'chart-container',
        data: [0,2,3,2,3,6,5,6,10,42,46],
        options: {
            backgroundColor: '#eee',
            backgroundGridColor: 'white',
            backgroundGridVlinesCount: 20,
            backgroundGridLinewidth: 2,
            xaxisLabels: ['1910','1920','1930','1940','1950','1960','1970','1980','1990','2000','2010'],
            colors: ['black'],
            linewidth: 3,
            tickmarksStyle: 'filledcircle',
            xaxis: false,
            yaxis: false,
            yaxisUnitsPost: 'k'
        }
    }).trace();
    
</script>