Flot：以 Date/Time 作为 x 轴的图形未正确绘制

Question

我试图显示随时间变化的值，但无论我尝试绘制什么数据，图表上都没有显示任何内容。 JsFiddle here.

见下面的代码。我究竟做错了什么？

HTML:

<div id="theGraph"></div>

CSS:

#theGraph{
    height:300px;
    width:500px;
}

Javascript:

var graphData = [
    [new Date("2015-03-13T08:00").getTime(), 2],
    [new Date("2015-03-15T00:00").getTime(), 3]
];

var options = {
    series: {
        lines: {
            show: true,
            lineWidth: 2
        },
        points: {
            show: true
        }
    },
    lines: {
        show: true
    },
    points: {
        show: true
    },
    yaxis: {
        min: 0,
        max: 5
    },
    xaxis: {
        mode: 'time',
        minTickSize: [1, 'hour'],
        min: new Date("2015-03-13T00:00").getTime(), 
        max: new Date("2015-03-15T08:00").getTime(), 
        timeformat: '%m/%d %H:%M'
    }
};

$.plot($('#theGraph'), graphData, options);

Answer 1

$.plot 方法采用 div 的占位符/ID 来绘制图形。 $.plot('#id',.......) 也做同样的事情。

而且您的代码 $.plot() 中只有一个问题。参数 'graphData' 应该在 [] 大括号中，因为 $.plot 需要系列数据数组。

修改后的代码：

$.plot($('#theGraph'), [graphData], options);

你可以提may数据系列在flot中绘制多条线。

 var d1 = [], d2 =[], d3 =[];
 $.plot($('#theGraph'), [d1,d2,d3], options);

Flot：以 Date/Time 作为 x 轴的图形未正确绘制

Flot: Graph with Date/Time as x axis not plotting correctly

javascript

flot