How to center graph labels along the x axis by tick marks between ticks

I have a serial chart created using flot.js: http://jsfiddle.net/tFy46/6/ .

As you can see from the violin, he does not understand which set of bars each tick belongs to.

Even if I change each data point so that each set of bars is centered around the tick ( http://jsfiddle.net/tFy46/7/ ), this is not very clear (especially when the number of series increases.

I would like to be able to center tag labels between each set of ticks. Is it possible? (I tried to labelWidthno avail, do I need to mess with a function tickFormatter?)

+4
source share
1 answer

Sorry, I misunderstood what you were after.

Unfortunately, the Fleet draws marks at the tick position, so shifting the mark from the checkmark will be problematic.

The best solution is to disable ticks, and then use the grid parameter markingsto demarcate the column groups:

    xaxis: {
        ticks: [[0.5,"1st Nov to 3rd Nov"],[2.0,"11th Nov to 15th Nov"]],
        tickLength: 0, // disable tick
        min: -0.2,
        max: 2.7
    },
    yaxis: {
        tickLength: 0 // disable tick
    },
    grid: {
        markings: [ { xaxis: { from: 1.25, to: 1.25 }, color: "black" } ] // create demarcation line
    }

Fiddle is here .

enter image description here

+3
source

All Articles