jquery flot条形图多个系列

为了使事情变得容易，我提供的代码： http ： //jsbin.com/otaruq

我们这里有一个这样的数据集:(查看源代码更多）

"label": "scott", "data": [[1317427200000, "17017"], [1317513600000, "77260"]] 

其中第一个值是UTC格式的日期，第二个值应该是分数。

现在，我要做的是让y轴上的每个日期并排表示得分的条形，如下所示：

  3 | # # 2 | # # # # # # 1 | # # # # # # # # # 0 |_________________________________ 1 oct 2 oct 3 oct 

相反，现在你可以看到这些酒吧都是在每一个上面。

任何帮助都会真正得到应用，谢谢

Answer 1

最简单的方法是手动抖动x值。 我发现50,000毫秒是一个很好的条形宽度抖动。

它产生以下结果：

---

完整代码：

 var data = [{ "label": "scott", "data": [[1317427200000-5000000*3, "17017"], [1317513600000-5000000*5, "77260"]] }, { "label": "martin", "data": [[1317427200000-5000000*2, "96113"], [1317513600000-5000000*4, "33407"]] }, { "label": "solonio", "data": [[1317427200000-5000000, "13041"], [1317513600000-5000000*3, "82943"]] }, { "label": "swarowsky", "data": [[1317427200000, "83479"], [1317513600000-5000000*2, "96357"], [1317600000000-5000000, "55431"]] }, { "label": "elvis", "data": [[1317427200000+5000000, "40114"], [1317513600000-5000000*1, "47065"]] }, { "label": "alan", "data": [[1317427200000+5000000*2, "82504"], [1317513600000, "46577"]] }, { "label": "tony", "data": [[1317513600000+5000000, "88967"]] }, { "label": "bill", "data": [[1317513600000+5000000*2, "60187"], [1317600000000, "39090"]] }, { "label": "tim", "data": [[1317513600000+5000000*3, "95382"], [1317600000000+5000000, "89699"]] }, { "label": "britney", "data": [[1317513600000+5000000*4, "76772"]] }, { "label": "logan", "data": [[1317513600000+5000000*5, "88674"]] }]; var options = { series: { bars: { show: true, barWidth: 60 * 60 * 1000, align: 'center' }, }, yaxes: { min: 0 }, xaxis: { mode: 'time', timeformat: "%b %d", minTickSize: [1, "month"], tickSize: [1, "day"], autoscaleMargin: .10 } }; $(function() { $.plot($('#placeholder'), data, options); });