在Flot中显示时间线/线性数据

时间:2012-06-11 21:36:33

标签: javascript jquery html flot timeline

有谁知道如何让flot显示一种“时间轴”?

E.g。

Y:
Person1| -----     -------
Person2|    -------   -------
Person3| -- -----    ----
Person4|       -------
        _____________________
X:      Jan  Feb  March  April

我不确定如何在y轴上显示标签并显示数据线性

到目前为止

解决方案:)

(文档)$。就绪(函数(){

var d1 = [[(new Date("01/01/2009")).getTime(), 5], [(new Date("10/01/2009")).getTime(), 5]];

var placeholder = $("#placeholder");

// plot it
var plot = $.plot(placeholder, [d1], {xaxis:{mode:"time", timeformat:"%b.%y"}});

});

提前致谢!

2 个答案:

答案 0 :(得分:2)

终于找到了答案。使用配置'ticks'。

<强>解决方案:

//american dates
    var d1 = [[(new Date("01/01/2009")).getTime(), 1], [(new Date("01/10/2009")).getTime(), 1]];
    var d2 = [[(new Date("05/05/2009")).getTime(), 2], [(new Date("06/23/2009")).getTime(), 2]];
    var d3 = [[(new Date("03/10/2009")).getTime(), 3], [(new Date("03/15/2009")).getTime(), 3]];
    //var d1 = [[0, 5], [5, 5], null, [5, 10], [15, 10]];
    var placeholder = $("#placeholder");

    // plot it
    var plot = $.plot(placeholder, [d1,d2,d3], {
        xaxis:{mode:"time", timeformat:"%b.%y"},
        yaxis:{ticks:[[1, "Apple"], [2, "Microsoft"], [3, "Dell"]]}
    });

答案 1 :(得分:1)

查看http://people.iola.dk/olau/flot/examples/basic.html的来源 特别注意评论// a null signifies separate line segments 我认为那可以让你到达你想去的地方。