How to draw a vertical line chart

Share RGraph:   Share or Like RGraph on Facebook!

A guide for drawing a vertical line chart. Vertical line charts aren't one of the supported base types of charts - but can be accomplished by using the Scatter chart

[No canvas support]

Vertical line charts are not supported natively in RGraph however they can be achieved using the Scatter chart. With this chart you can specify the X and Y coordinates and a connecting line can be shown as in the example.

Below is the code that is necessary to achieve the vertical line chart.

    window.onload = (function ()
        var scatter = new RGraph.Scatter({
            id: 'cvs',
            data: [[76, 6.5],[34,5.5],[12,4.5],[48,3.5],[43,2.5],[14,1.5],[5,0.5]],
            options: {
                xmax: 100,
                ymax: 7,
                line: true,
                lineLinewidth: 3,
                backgroundGridAutofitNumhlines: 14,
                backgroundGridAutofitNumvlines: 5,
                ylabelsSpecific: [
                    '', 'Monday',
                    '', 'Tuesday',
                    '', 'Wednesday',
                    '', 'Thursday',
                    '', 'Friday',
                    '', 'Saturday',
                    '', 'Sunday',
                gutterLeft: 75,
                xscale: true,
                numyticks: 14,
                tickmarks: null,
                textAccessible: true,
                textSize: 14
© Copyright Richard Heyes 2008-2017