Google のチャート API を使用して折れ線グラフを表示しようとしています。
日付と数値の 2 つの列を持つデータ テーブルを作成しました。線は正しく表示されますが、X 軸のラベルがありません。すべてのデータは同じ日にありますが、時間は異なります。日付を編集して異なる日に分散させると、すべてが機能します。
グラフを 1 日だけに絞り、X 軸に時間と分を表示する必要があります。
どうやってやるの?
ありがとう。
Google のチャート API を使用して折れ線グラフを表示しようとしています。
日付と数値の 2 つの列を持つデータ テーブルを作成しました。線は正しく表示されますが、X 軸のラベルがありません。すべてのデータは同じ日にありますが、時間は異なります。日付を編集して異なる日に分散させると、すべてが機能します。
グラフを 1 日だけに絞り、X 軸に時間と分を表示する必要があります。
どうやってやるの?
ありがとう。
通常は、データを渡す方法に帰着します。あなたarrayToDataTable
の日付は単なる文字列です。JS 日付オブジェクトをインスタンス化してビルドすると、dataTable
より良い結果が得られるはずです。このコードは私にとってはうまくいきます(ライブで見てください):
function drawVisualization() {
var data = new google.visualization.DataTable();
data.addColumn('datetime', 'Time of Day');
data.addColumn('number', 'Some Measurement');
data.addRows([
[new Date(2012,10,3,11,30,0), 12],
[new Date(2012,10,3,11,45,0), 2],
[new Date(2012,10,3,12,1,0), 16],
[new Date(2012,10,3,12,15,0), 3],
[new Date(2012,10,3,12,30,0), 12],
[new Date(2012,10,3,12,45,0), 7]
]);
new google.visualization.LineChart(document.getElementById('visualization')).
draw(data, {curveType: "function",
width: 500, height: 400,
vAxis: {maxValue: 10}}
);
}
私はかつて Google ビジュアライゼーションのファンでしたが、彼らの未発表のアップデートに何度も悩まされてきました. また、多くの制限があります。時系列を非常にうまく処理するDygraphをチェックしてください。
クエリfocus my chart in one day only and show hours and minutes on the X axis.
でこれを行う必要があります。これは Google チャートとは関係ありません。haxis パラメーターを調べて、これらの値の一部を変更して目的を達成できるかどうかを確認できますhttps://google-developers.appspot.com/chart/interactive/docs/gallery/linechart