# A page showing a blocky black and red HBar chart

This goes in the documents header:

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

Put this where you want the chart to show up:

    <div style="width: 400px; height: 450px" id="chart-container"></div></div>

This is the code that generates the chart:

    <script>
        new RGraph.SVG.HBar({
            id: 'chart-container',
            data: [[1,1],[1,2],[1,3],[1,4]],
            options: {
                grouping: 'grouped',
                yaxisLinewidth: 10,
                yaxisLabels: ['Kevin','Luis','Paul','Charles gy gu '],
                yaxisTextBold: true,
                xaxisMax: 6,
                xaxisLinewidth: 10,
                xaxisLabelsCount: 0,

                vmargin: 15,
                vmarginGrouped: 2,

                backgroundGrid: false,
                colors: ['red', 'black'],
                gutterLeftAutosize: false,
                gutterLeft: 150
            }
        }).wave();
    </script>

« Back