A range SVG Line chart

This is a regular Line chart with two datasets - however the fill color of the bottom most dataset has been set to transparent. The Line chart uses the spline setting and the trace() effect. No axes are enabled and the vertical background grid lines have been disabled.

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: 300px" id="chart-container"></div>
This is the code that generates the chart:
<script>
    d1 = [
        1,5,6,4,3,2,7,4,
        5,6,3,5,6,4,3,5,
        4,2,5,6,2,3,6,4, 4
    ];
    
    d2 = [
        3,7,8,6,5,4,9,6,
        7,8,5,7,8,6,5,7,
        6,4,7,8,4,5,8,6,6
    ];

    new RGraph.SVG.Line({
        id: 'chart-container',
        data: [d1, d2],
        options: {
            xaxisLabels: [
                '00','01','02','03','04','05','06','07',
                '08','09','10','11','12','13','14','15',
                '16','17','18','19','20','21','22','23',
                '00'
            ],
            filled: true,
            filledColors: ['transparent', 'rgba(0,255,0,0.25)'],
            filledAccumulative: true,
            colors: ['green', 'green'],
            spline: true,
            linewidth: 2,
            backgroundGridVlines: false,
            backgroundGridBorder: false,
            xaxis: false,
            yaxis: false
        }
    }).trace();
</script>