この記事では、JavascriptでCSVファイルを読み込んで一部のデータを取り出す方法をソースコード付きでまとめました。
データを部分抽出
Javascriptでは、Ajaxを使ってサーバー上にあるCSVファイルを読み込むことが出来ます。
今回は、読み込んだ時系列データのうち、特定の日付のデータだけを取り出しました。
ソースコード
サンプルプログラムのソースコードです。
// CSVを読み込んで配列に変換 var csvToArray = function(path) { var csvData = new Array(); var data = new XMLHttpRequest(); data.open("GET", path, false); data.send(null); var LF = String.fromCharCode(10); var lines = data.responseText.split(LF); for (var i = 0; i < lines.length; ++i) { var cells = lines[i].split(","); if( cells.length != 1 ) { csvData.push(cells); } } return csvData; }; // 特定の日時のデータを抽出 var getDateData = function(date, src) { var dst = new Array(); for(var i = 0; i < src.length; i++) if (src[i][0].indexOf(date) !== -1) { dst.push(src[i]); } } return dst; }; // ページロード時に実行 window.onload = function(){ var csvData = csvToArray("data.csv"); var date = "2016-12-12"; var data2 = getDateData(date, csvData); alert(data2); };
読み込んだCSVファイル:data.csv
実行結果
サンプルプログラムの実行結果です。
サンプルデモページ
2016-12-12のデータのみを取り出してダイアログに表示しました。
- | 関連記事 |
---|---|
1 | ■Chart.js入門 グラフ・チャート作成 |
2 | ■Javascript入門 |
コメント