DateTimeを使用していくつかのグラフをレンダリングするためにFlotr2を使用しています。これは折れ線グラフで問題なく動作していますが、カートに折れ線グラフと棒グラフの両方をレンダリングする必要があります。これは簡単なはずで、flotr2 サイトに例があります。
値を使用int
すると、すべてが希望どおりに機能します。これを に変更しDateTime
たところ、折れ線グラフは思い通りに表示されるのに棒グラフがまったく表示されずに失敗します。
以下の私のJavascript(コメントアウトされたDateTime値を含む)
function CreateRequiredChart(container)
{
var bars = {
data: [],
bars: {
show: true,
barWidth: 0.03,
lineWidth: 0,
fillColor: {
colors: ['#f00', '#f66'],
start: 'top',
end: 'bottom'
},
fillOpacity: 1
}
},
lines = {
data: [],
lines: {
show: true,
fillColor: ['#900', '#EDC13E', '#4DD43B'],
fill: true,
fillOpacity: 1
}
};
//The next lines displays the result which is desired (in that both line and bar graphs are shown). Comment these out and uncomment the next section to see the fault
bars.data.push([1, 7]);
lines.data.push([0, 4], [1, 9], [2, 5], [3, 3]);
/*The next 2 lines do not display as desired. The line graph works, the bar graph does not
bars.data.push([new Date('01/01/2013 08:30:00'), 7]);
lines.data.push([new Date('01/01/2013 08:29:00'), 5], [new Date('01/01/2013 08:30:00'), 8], [new Date('01/01/2013 08:31:00'), 4]);
*/
graph = Flotr.draw(container, [lines, bars], {
HtmlText: false,
yaxis: {
showLabels: true,
title: "Value"
},
xaxis: {
mode: "time",
timeformat: "%H%M%S",
minorTickFreq: 1,
showLabels: true,
title: "Time from start of logging",
labelsAngle: 90
},
grid: {
verticalLines: true,
backgroundColor: ['#fff', '#ccc']
}
});
}
私は何か間違ったことをしていますか、それともこれはflotr2の制限ですか?