Adjusting your charts interactively - Line chart

Share RGraph:   
Update If you don't like the line being drawn outside of the chart area (ie in the gutter where the title or the labels are) you can use the new (in February 2016) outofboundsClip option
[No canvas support]

The Line chart can be adjusted by dragging the line(s) up and down. When you click on a line to adjust it (and hold the mousebutton down) you can then retrieve the relevant details of that point from the registry:


RGraph.Registry.get('chart.adjusting.shape');
<script>
    window.onload = (function ()
    {
        var line = new RGraph.Line({
            id: 'cvs',
            data: [
                [45,74,84,85,45,35,65,68,87,97,45,34,12],
                [15,14,12,16,18,19,14,12,74,84,95,65,35]
            ],
            options: {
                labels: ['Kev','Matt','Rich','Dave','Iggy','Polly','Fiona','Fred','Pete','Lou','Fred','Bob'],
                ylabelsInside: true,
                linewidth: 2,
                hmargin: 10,
                shadow: false,
                adjustable: true,
                title: 'An adjustable line chart',
                outofbounds: true,
                spline: true,
                textAccessible: true
            }
        }).draw()
    })
</script>

Comments

Add a new comment...