View the RGraph Facebook page View the RGraph Google+ page Share RGraph on Twitter Share RGraph on LinkedIn

Bar charts Line charts and Pie charts

Bar charts

[No canvas support]

Bar charts documentation
<script>
    var bar = new RGraph.Bar('cvs', [[3,4,6],[2,5,3],[1,5,2],[1,4,6],[1,6,8]])
        .set('labels', ['Mal', 'Barry', 'Gary', 'Neil', 'Kim'])
        .set('colors', ['Gradient(#99f:#27afe9:#058DC7:#058DC7)', 'Gradient(#94f776:#50B332:#B1E59F)', 'Gradient(#fe783e:#EC561B:#F59F7D)'])
        .set('hmargin', 15)
        .set('strokestyle', 'white')
        .set('linewidth', 1)
        .set('shadow', true)
        .set('shadow.color', '#ccc')
        .set('shadow.offsetx', 0)
        .set('shadow.offsety', 0)
        .set('shadow.blur', 10)
        .draw();
</script>

Line charts

[No canvas support]

Line charts documentation
<script>
    var line = new RGraph.Line('cvs', [8,9,15,16,21,23, 4, 6,21,15,18,11])
        .set('spline', true)
        .set('numxticks', 11)
        .set('numyticks', 5)
        .set('background.grid.autofit.numvlines', 11)
        .set('colors', ['red'])
        .set('linewidth', 5)
        .set('gutter.left', 40)
        .set('gutter.right', 15)
        .set('labels',['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'])
        .set('shadow',true)
        .set('shadow.color','#aaa')
        .set('shadow.blur',5)
        .set('tickmarks',null)
        .draw();
</script>

Pie charts

[No canvas support]

Pie charts documentation
<script>
    var pie = new RGraph.Pie('cvs', [4,8,6,3,5,2])
        .set('exploded', [20])
        .set('shadow', true)
        .set('shadow.blur', 10)
        .set('shadow.color', '#aaa')
        .set('shadow.offsetx', 0)
        .set('shadow.offsety', 0)
        .set('strokestyle', 'rgba(0,0,0,0)')
        .set('labels', ['Henning','Louis','John','Pete','Lucy','Fred'])
        .draw();
</script>

Bipolar charts

[No canvas support]

Bipolar charts documentation
<script>
    var bipolar = new RGraph.Bipolar('cvs', [4,8,6,3,5,2,4], [9,5,6,7,8,7,8])
        .set('gutter.left', 40)
        .set('gutter.right', 15)
        .set('gutter.center', 90)
        .set('colors', ['Gradient(blue:#aaf:white:#aaf:blue)'])
        .set('labels', ['Monday','Tuesday','Wednesday','Thursday','Friday','Saturday','Sunday'])
        .draw();
</script>

Horizontal Bar charts

[No canvas support]

Horizontal Bar charts documentation
<script>
    var hbar = new RGraph.HBar('cvs', [4,8,-6,-3,2,-1,5,6])
        .set('labels', ['Fred','Lucy','Carl','Olga','Pete','Jill','Kevin','Gary'])
        .set('yaxispos', 'center')
        .set('gutter.left', 40)
        .set('gutter.right', 15)
        .draw();
</script>