Question

I am using jqplot for a bar graph that has 1 very high number around 7 million and 2 very low numbers, less than 100,000 when they are charted on a bar graph the two low numbers are only a couple of pixels tall, you can barely see them.

I am wondering if it is possible to use disproportionate intervals on the x axis for example the lower half of the chart would be say 0 – 100,000 and then the upper half would go from 100,000 – 7,000,000

I can’t find it in the options anywhere, I’ve set custom ‘ticks’ but all that does is squeeze all the low numbers into a tiny space at the bottom.

Google is no help.

Here is what I have so far

function init_graph() {
    var line1 = [19877, 6643895, $('#inpSalary').val()];

    var tickers = ['low number', 'huge number', 'low number'];

            plot1 = $.jqplot('jqplot', [line1], {
                stackSeries: true,
                legend: {
                    show: true,
                    location: 'ne'
                },
                title: 'Data per month stack by user',
                seriesColors:['#fcbaac','#f5564d','#1e3045'],
                seriesDefaults: {
                    renderer: $.jqplot.BarRenderer,
                    rendererOptions: {
                        varyBarColor: true,
                        // barPadding: 6,
                        // barMargin: 15,
                        barWidth: 60,
                        highlightMouseOver: true
                    }
            // shadowAngle: 135
                },
                series: [{
                    label: 'User1'
                }],
                axes: {
                    xaxis: {
                        renderer: $.jqplot.CategoryAxisRenderer,
                        ticks: tickers         
                    },
                    yaxis: {
                        ticks: [0,20000,30000,40000,50000,60000,70000,80000,90000,100000,7000000],
                        min: 0
                    }
                }   
            });
}

Answer 1

You could switch to using the LogAxisRenderer, which by default with give you a log base 10 scale on the y-axis:

<snip>
axes: {
  xaxis: {
    renderer: $.jqplot.CategoryAxisRenderer,
      ticks: tickers         
    },
   yaxis: {
      renderer: $.jqplot.LogAxisRenderer,
      min: 100
   }
} 
<snip>