# A bipolar chart with a Gauge on the same page

This an example of two different charts (on two different canvases) on one page.

This goes in the documents header:

    <script src="RGraph.common.core.js"></script>
    <script src="RGraph.common.dynamic.js"></script>
    <script src="RGraph.bipolar.js"></script>
    <script src="RGraph.gauge.js"></script>

Put this where you want the chart to show up:

    <canvas id="cvs1" width="600" height="250">[No canvas support]</canvas>
    <canvas id="cvs2" width="250" height="250">[No canvas support]</canvas>

This is the code that generates the chart:

    <script>
        window.onload = function ()
        {
            var bipolar = new RGraph.Bipolar({
                id: 'cvs1',
                left: [4,8,6,4,3],
                right: [18,4,6,3,3],
                options: {
                    textAccessible: true,
                    labels: ['Luis','Peter','Joe','Hoolio','Gina']
                }
            }).draw();

            var gauge = new RGraph.Gauge({
                id: 'cvs2',
                min: 0,
                max: 100,
                value: 87,
                options: {
                    textAccessible: true,
                    textAccessiblePointerevents: false,
                    adjustable: true
                }
            }).draw();
        };
    </script>