A page showing the various Y scale variations of the SVG Bar chart

This is a demo page that shows the various combinations of the Bar chart scale when used as a regular (not grouped or stacked) chart. A chart with the Y axis in the center is shown as well as a chart with an offset axis.

This goes in the documents header:
<script src="RGraph.svg.common.core.js"></script>
<script src="RGraph.svg.bar.js"></script>
Put this where you want the chart to show up:
<div style="width: 600px; height: 250px" id="chart-container1"></div></div>
<div style="width: 600px; height: 250px" id="chart-container2"></div></div>
<div style="width: 600px; height: 250px" id="chart-container3"></div></div>
<div style="width: 600px; height: 250px" id="chart-container4"></div></div>
<div style="width: 600px; height: 250px" id="chart-container5"></div></div>
This is the code that generates the chart:
<script>
    new RGraph.SVG.Bar({
        id: 'chart-container1',
        data: [-5,-7,-9,-11,-13,-15],
        options: {
            yaxisScaleMax: -5,
            yaxisScaleMin: -15,
            marginLeft: 50,
            xaxisLabels: ['Harry','Lucy','Pete','Nick','Al','John'],
            title: 'Both min and max negative',
            hmargin: 20,
            backgroundGridVlines: false,
            backgroundGridBorder: false,
            xaxis: false,
            yaxis: false
        }
    }).draw();

    new RGraph.SVG.Bar({
        id: 'chart-container2',
        data: [0,1,2,3,4,5,6],
        options: {
            marginLeft: 50,
            xaxisLabels: ['Harry','Lucy','Pete','Nick','Al','John','Kevin'],
            title: 'Min set to zero and max positive',
            hmargin: 20,
            backgroundGridVlines: false,
            backgroundGridBorder: false,
            xaxis: false,
            yaxis: false
        }
    }).draw();

    new RGraph.SVG.Bar({
        id: 'chart-container3',
        data: [10,9,8,7,6,5,4,3,2,1,0,-1,-2,-3,-4,-5,-6,-7,-8,-9,-10],
        options: {
            yaxisScaleMin: 'mirror',
            xaxisLabels: ['Harry','Lucy','Pete','Nick','Al','John','Kerridge'],
            title: 'Min negative and max positive',
            backgroundGridVlines: false,
            backgroundGridBorder: false,
            yaxis: false,
            colors: [
                'red', 'blue','green',
                'red', 'blue','green',
                'red', 'blue','green',
                'red', 'blue','green',
                'red', 'blue','green',
                'red', 'blue','green',
                'red', 'blue','green'
            ],
            colorsSequential: true,
        }
    }).draw();

    new RGraph.SVG.Bar({
        id: 'chart-container4',
        data: [5,6,7,8,9,10],
        options: {
            title: 'Both min and max above zero',
            xaxisLabels: ['Ken','Larry','Kevin','Jobe','Lucy','John'],
            marginLeft: 50,
            yaxisScaleMin: 5,
            yaxisScaleMax: 10,
            backgroundGridBorder: false,
            backgroundGridVlines: false,
            xaxis: false,
            yaxis: false
        }
    }).draw();

    new RGraph.SVG.Bar({
        id: 'chart-container5',
        data: [-5,-6,-7,-8,-9,-10],
        options: {
            title: 'Zero max and negative min',
            xaxisLabels: ['Ken','Larry','Kevin','Jobe','Lucy','John'],
            marginLeft: 50,
            yaxisScaleMin: -10,
            yaxisScaleMax: 0,
            backgroundGridBorder: false,
            backgroundGridVlines: false,
            xaxis: false,
            yaxis: false
        }
    }).draw();
</script>