# A black and white Line chart

This goes in the documents header:

    <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="700" height="250">
        [No canvas support]
    </canvas>

This is the code that generates the chart:

    <script>
        var line = new RGraph.Line({
            id: 'cvs',
            data: [0,10,46,13,74,100,51],
            options: {
                linewidth: 7,
                colors: ['black'],
                shadow: false,
                tickmarks: 'filledcircle',
                numxticks: 0,
                numyticks: 0,
                axisLinewidth: 7,
                ticksize: 15,
                gutterLeft: 125,
                gutterRight: 5,
                gutterBottom: 25,
                gutterTop: 20,
                backgroundGrid: false,
                ylabelsSpecific: ['100%  ', '50%  ', '0%  '],
                textSize: 24,
                textFont: 'Verdana',
                hmargin: 35,
                textAccessible: true,
                ylabelsOffsetx: -25
            }

        // Draw the "tails" to the axes
        }).on('draw', function (obj)
        {
            // This function draws the little ends to the axes
            RGraph.path2(
                obj.context,
                'b lw 7 m % % l % % m % % l % % s black',
                obj.gutterLeft, obj.canvas.height - obj.gutterBottom,
                obj.gutterLeft - 15, obj.canvas.height - obj.gutterBottom,
                obj.gutterLeft, obj.canvas.height - obj.gutterBottom,
                obj.gutterLeft, obj.canvas.height - obj.gutterBottom + 15
            );
        }).trace2({frames: 60});
    </script>