# A Bar chart using labelsAbove

This goes in the documents header:

    <script src="RGraph.common.core.js"></script>
    <script src="RGraph.bar.js"></script>

Put this where you want the chart to show up:

    <div style="padding-left: 35px">
        <canvas id="cvs" width="750" height="250">[No canvas support]</canvas>
    </div>

This is the code that generates the chart:

    <script>
        new RGraph.Bar({
            id: 'cvs',
            data: [33.1,14.5,11.8,10.2,10.4,9.5,4.5,1.1,4.9],
            options: {
                ymax: 40,
                unitsPost: ' %',
                labelsAbove: true,
                labelsAboveDecimals: 1,
                labelsAboveUnitsPost: '%',
                labelsAboveColor: 'black',
                labelsAboveSize: 10,
                hmargin: 20,
                colors: ['#86B5BC','#E30513','#1C1C1B','#86BC24','#E5007D','#2F8DCD','#F9D900','#F6A200','#BCBCBC'],
                colorsSequential: true,
                labels: ['Nichtwahler','SPD','CDU','Grune','Linke','AfD','FDP','Piraten','Sonstige'],
                textSize: 10,
                textColor: 'gray',
                backgroundGridVlines: false,
                backgroundGridAutofitNumhlines: 4,
                backgroundGridBorder: false,
                noaxes: true,
                ylabelsCount: 4,
                title: 'Das "ehrliche" Wahlergebnis in Berlin',
                titleX: 25,
                titleY: 0,
                titleHalign: 'left',
                titleColor: '#999',
                ylabelsOffsetx: -10
            }
        }).grow({frames: 60});
    </script>