[Solved]-How do I set a minimum upper bound for an axis in Highcharts?-Highcharts

HigtCharts has a really good documentation of all methods with examples.

http://www.highcharts.com/ref/#yAxis--min

In your case I think you should the "min" and "max" properties of "yAxis".

min : Number The minimum value of the axis. If null the min value is automatically calculated. If the startOnTick option is true, the min value might be rounded down. Defaults to null.

max : Number The maximum value of the axis. If null, the max value is automatically calculated. If the endOnTick option is true, the max value might be rounded up. The actual maximum value is also influenced by chart.alignTicks. Defaults to null.

If you are creating your chart dynamically you should set

min=0 max=10 , if your all data values are less then 10

and

only min=0, if you have value greater then 10

Good luck.

Try setting the minimum value of the axis and the interval of the tick marks in axis units like so:

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    yAxis: {
        min: 0,
        max: 10,
        tickInterval: 10
    }
});

Also don't forget to set the max value.

Hope that helps.

Adding to Julian D's very good answer, the following avoids a potential re-positioning problem if your calculated max varies in number of digits to your desired upper bound.

In my case I had percentage data currently going into the 20's but I wanted a range of 0 to at least 100, with the possibility to go over 100 if required, so the following sets min & max in the code, then if dataMax turns out to be higher, reassigns max up to it's value. This means the graph positioning is always calculated with enough room for 3-digit values, rather than calculated for 2-digits then broken by squeezing "100" in, but allows up to "999" before there would next be a problem.

var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container',
        events: {
            load: function(event) {
                thisSetMax = this.yAxis[0].getExtremes().max;
                thisDataMax = this.yAxis[0].getExtremes().dataMax;
                if (thisDataMax > thisSetMax) {
                    this.yAxis[0].setExtremes(0, thisDataMax);
                    alert('Resizing Max from ' + thisSetMax + ' to ' + thisDataMax);
                }
            }
        }        
    },
    title: {
        text: 'My Graph'
    },
    xAxis: {
        categories: ['Jan 2013', 'Feb 2013', 'Mar 2013', 'Apr 2013', 'May 2013', 'Jun 2013']
    },
    yAxis: {
        min: 0,
        max: 100,
        title: {
            text: '% Due Tasks Done'
        }
    }
    //Etc...
});

A way to do this only using options (no events or functions) is:

yAxis: {
    min: 0,
    minRange: 10,
    maxPadding: 0
}

Here minRange defines the minimum span of the axis. maxPadding defaults to 0.01 which would make the axis longer than 10, so we set it to zero instead.

This yields the same results as a setExtreme would give. See this JSFiddle demonstration.