# An SVG Line chart that used to be a front page demo

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>

« Back