我有一个带有 orderBars 插件的 Flot 图表。
我有来自 2 个不同年份的 JSON
数据,当我将它们渲染在一起时,它们变得太小了。当我每年单独渲染时,看起来还不错。
我尝试覆盖选项中的条形宽度,但没有成功。
如何解决这个问题? Example
最佳答案
orderBars 插件尝试执行的操作是计算适当的抖动值以相互偏移条形。考虑到较大的 javascript 毫秒纪元值,它看起来会惨败(它没有考虑大范围的数据,并且似乎尝试将它们抖动 1 秒)。因此,正如我对 flot
的建议一样,跳过插件并自己抖动条形。
一年有 3.15569e10 毫秒;除以条数,是良好 +-
抖动值的基础:
var millisInYear = 3.15569e10;
var N = raw2013.length;
var jitter = millisInYear / N;
for (var i = 0; i < N; i++){
// find the midpoint and jitter around it
// this way the "middle" bar is over the year tick
if (i < N/2){
raw2013[i].data[0][0] = raw2013[i].data[0][0] - (jitter * (N/2 - i));
}else{
raw2013[i].data[0][0] = raw2013[i].data[0][0] + (jitter * (i - N/2));
}
}
这是更新的 fiddle (请原谅我删除了 JSON 解析,但是用我正在喝的威士忌更容易思考:)
关于jquery - FLot 订购的条形太小且彼此距离太长,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20891888/