2

我正在使用Flot Graph Api绘制图表,我想在条形图中绘制时间值。

我的桌子看起来像这样

在此处输入图像描述

我的 X 轴应该是原因列表,Y 轴应该是时间变量。我的图表应该是这样的。

在此处输入图像描述

但我得到了这样的东西,因为 Json 对象被错误地打包了。

在此处输入图像描述

如何绘制时间值的图表

我的情节 JS 代码是

    <script language="javascript" type="text/javascript">  
$(document).ready(function(){
$.getJSON('ReasonByTime.txt', function(json) {
   //succes - data loaded, now use plot:
       var plotarea = $("#placeholder");
       var dataBar=json.data;
        $.plot(plotarea , [
            {
                data: dataBar,
                bars: { show: true},
                legend: {show: true},
                yaxis: {
                    mode: 'time',
                    timeformat: "%y/%m/%d",
                        min: ( new Date('2012/01/01') ).getTime(),
                        max: ( new Date('2020/01/01') ).getTime(), 
                        minTickSize: [1, 'hour']
                }
            }          
        ]
    );
});

});

而我当前的 Json 对象是这样的。

  {"data":[[0,5202],[0,19620],[0,82920],[0,240],[0,75720],[0,3060],[0,72840]],"label":"Tea break"}

因为我是新来的,所以我对这项工作很感兴趣,我做了一些研究,但我无法解决我的问题。有人可以帮我吗。

4

2 回答 2

2

问题不在于 JSON,而在于您的数据本身。您的 x 轴值都为零,因此 Flot 正确地将所有条形图相互叠加。

于 2012-11-21T15:06:47.200 回答
0

感谢 DNS,问题是我所有的 x 轴值都为零,所以我将 JSON 更改为以下格式,

  [{"data":[[0,5202]],"label":"Over Time"},{"data":[[1,19620]],"label":"Shift Start"},{"data":[[2,82920]],"label":"Maintenance break"},{"data":[[3,240]],"label":"Lunch break"},{"data":[[4,75720]],"label":"BreakDown"},{"data":[[5,3060]],"label":"Break"},{"data":[[6,72840]],"label":"Tea break"},{"data":[[6,79260]],"label":"Power Failure"}]

现在我得到这样的图表,

在此处输入图像描述

于 2012-11-21T15:46:58.837 回答