Can axis number be controlled independently of tickSize?

Basically I want to do something like this: http://i.stack.imgur.com/JEKOg.png (grid lines, not a graph).

It seems if tickSize is set to one (below) then there are a bunch of lines drawn with their respective axis number below.

xaxis, yaxis: {
    show: true,
    min: -20,
    max: 20,
    tickSize: 1,
    tickLength: 0
}

      

If it is not set (below), the graph will automatically draw once every 5 units along with their numbers

xaxis, yaxis: {
    show: true,
    min: -20,
    max: 20,
    tickLength: 0
}

      

I want the grids to be every 1 unit, but numbers every 5, but I don't see a method to do this.

+3


source to share


1 answer


You can manually specify tick labels using an array:

ticks: [[0, "0"], [1, ""], [2, ""], [3, ""], [4, ""], [5, "5"]],

      

Or you can specify a function for this:

ticks: function(axis) {
    var tickArray = [[0,"0"]];
    for(var i=axis.min; i<axis.max+1; i++) {
         var label = i%5?"":i;
         tickArray.push([i, label]);
    }
    return tickArray;
},

      



Demo: http://jsfiddle.net/jtbowden/gryozh7x/

You can also use tickFormatter

:

tickSize: 1,
tickFormatter: function (val, axis) {
    return val%5?"":val;
}

      

Demo: http://jsfiddle.net/jtbowden/gryozh7x/1/

+3


source







All Articles