I am trying to plot expense data against time axis, and I see the data bars are overlapping if they are showing data for the same date. I was expecting the graph to show the bars asjascent to each other but that is not the case. See a sample of code at this link...
$.plot($("#placeholder"), newJson,
{
bars: {
show: 1,
barWidth: 24 * 60 * 60 * 1000 * 10
},
xaxis: { mode:"time" }
});
Unfortunately, that isn't possible in flot without using some sort of plugin. I suggest you either use the stacking plugin to get a vertical stack, or an external plugin like orderBars.
In each of them, you add an option to each series specifying that it should be stacked/ordered. Or to the overall series options for bars if you want it to apply for everything.
$.plot($("#placeholder"), newJson,
{bars: { order:1, show: 1, barWidth: 24 * 60 * 60 * 1000 * 10 },
xaxis: { mode:"time" }
});
Here's a working example: http://jsfiddle.net/ryleyb/A8yNV/7/
I've just solved an issue with the ORDER property : it does not work if one of the serie has a NULL value.
Indeed, I was using NULL value to avoid a get a tiny (0) line for the serie, but in this case the following order of the stacks are completely disturb.
By setting a 0 (ZERO) instead of NULL : all is okay.
Note : the same problem with or without the "orderBars plugin".
Hope this will help.