我有一张按日期排序的图表。
我的问题是图表行从头到尾加入false。
我的选择:
var options =
{
grid:
{
color: "#dedede",
borderWidth: 1,
borderColor: "transparent",
clickable: true,
hoverable: true
},
series: {
grow: {active:false},
lines: {
show: true,
fill: false,
lineWidth: 2,
steps: false
},
points: {
show:true,
radius: 5,
lineWidth: 3,
fill: true,
fillColor: "#000"
}
},
legend: { position: "nw", backgroundColor: null, backgroundOpacity: 0, noColumns: 2 },
yaxis: { tickSize:50 },
xaxis: {
mode: "time",
tickFormatter: function(val, axis) {
var d = new Date(val);
return d.getUTCDate() + "/" + (d.getUTCMonth() + 1);
}
},
colors: [],
shadowSize:1,
tooltip: true,
tooltipOpts: {
content: "%s : %y.0",
shifts: {
x: -30,
y: -50
},
defaultTheme: false
}
};
注意:我没有重新订购任何数据。只给这个函数的时间戳:
function gd(year, month, day) {
return new Date(year, month - 1, day).getTime();
}
设置如下数据:
$.each(e.data, function(i, e){
data.push([gd(parseInt(e['year']), parseInt(e['month']), parseInt(e['day'])), parseInt(e['value'])]);
});
var entity = {
label: e.campaign,
data: data,
lines: {fillColor: randomColor},
points: {fillColor: randomColor}
};
entities.push(entity);
控制台日志:
答案 0 :(得分:3)
创建折线图时,flot将使用数据系列中的顺序连接数据点,忽略实际的x坐标。这就是为什么数据系列应该按升序排列的原因。
最小的例子(按升序使用您的数据):
var d1 = [
[1401310800000, 275],
[1401397200000, 270],
[1401483600000, 313],
[1401570000000, 279],
[1401656400000, 216],
[1401742800000, 255],
[1401829200000, 244],
[1401915600000, 70]
];
$.plot("#chart", [ d1 ]);
Here is a jsfiddle显示图表。