Flot JS 折线图顺序不同 属性
Flot JS Line Chart Order by different property
我有一个这样的数组:
["Week 1, Year 2014", 3, { full_date: "Sun Apr 06 2014 00:00:00 GMT+0100 (GMT Daylight Time)"}]
我遇到的问题是日期排序不正确,我有五个不同的折线图,每个都有不同的日期。但是折线图是将它们加在一起而不是将它们插入中间,所以如果我的第一个数组有第 1 周、第 3 周和第 4 周,而我的第二个数组有第 1 周、第 2 周和第 4 周,结果会像
第 1 周、第 3 周、第 4 周、第 2 周而不是订购它们。我的解决方案是创建一个填充数组,它具有所有数组的所有选项,所以一条不可见的线但是每个日期都有,但我想知道是否有一个选项让它自己做这个或者如果可能的话按不同的排序属性,例如full_date.
var options = {
series: {
lines: {
show: true
},
points: {
radius: 3,
fill: true,
show: true
}
},
xaxis: {
tickLength: 0,
mode: "categories",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 10
},
yaxes: [{
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 3,
}, {
position: "right",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 3
}
], legend: {
noColumns: 1,
labelBoxBorderColor: "#000000",
position: "nw"
},
grid: {
hoverable: true,
borderWidth: 2,
borderColor: "#633200",
backgroundColor: { colors: ["#ffffff", "#EDF5FF"] }
},
colors: ["#FF0000", "#0022FF"]
};
不,flot本身没有更简单的选项。
创建包含所有周的填充数组或为缺失的周使用空值扩展现有数组是最佳选择。根据您的服务器端代码,其中一种可能更容易。
我有一个这样的数组:
["Week 1, Year 2014", 3, { full_date: "Sun Apr 06 2014 00:00:00 GMT+0100 (GMT Daylight Time)"}]
我遇到的问题是日期排序不正确,我有五个不同的折线图,每个都有不同的日期。但是折线图是将它们加在一起而不是将它们插入中间,所以如果我的第一个数组有第 1 周、第 3 周和第 4 周,而我的第二个数组有第 1 周、第 2 周和第 4 周,结果会像
第 1 周、第 3 周、第 4 周、第 2 周而不是订购它们。我的解决方案是创建一个填充数组,它具有所有数组的所有选项,所以一条不可见的线但是每个日期都有,但我想知道是否有一个选项让它自己做这个或者如果可能的话按不同的排序属性,例如full_date.
var options = {
series: {
lines: {
show: true
},
points: {
radius: 3,
fill: true,
show: true
}
},
xaxis: {
tickLength: 0,
mode: "categories",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 10
},
yaxes: [{
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 3,
}, {
position: "right",
axisLabelUseCanvas: true,
axisLabelFontSizePixels: 12,
axisLabelFontFamily: 'open sans',
axisLabelPadding: 3
}
], legend: {
noColumns: 1,
labelBoxBorderColor: "#000000",
position: "nw"
},
grid: {
hoverable: true,
borderWidth: 2,
borderColor: "#633200",
backgroundColor: { colors: ["#ffffff", "#EDF5FF"] }
},
colors: ["#FF0000", "#0022FF"]
};
不,flot本身没有更简单的选项。
创建包含所有周的填充数组或为缺失的周使用空值扩展现有数组是最佳选择。根据您的服务器端代码,其中一种可能更容易。