エクセルを処理するライブラリは色々と公開されていますが、以下のサイトで公開されている xlsx.full.min.js を使うことにします。
https://github.com/SheetJS/js-xlsx
以下がサンプルコードです。
// エクセルファイルを処理する関数。inputタグでファイルを受け取り、jQueryのイベントeとして受け取る想定。 function parseExcel(e) { var files = e.target.files; var file = files[0]; var reader = new FileReader(); reader.onload = function (e) { var data = e.target.result; var wb; var arr = fixdata(data); wb = X.read(btoa(arr), { type: 'base64', cellDates: true, }); var output = to_json(wb); // 変数outputにJSON形式のデータが格納される。 // ここから、JSON形式になったエクセルのデータを処理可能 }; reader.readAsArrayBuffer(file); } function fixdata(data) { var o = "", l = 0, w = 10240; for (; l < data.byteLength / w; ++l) { o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w + w))); } o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w))); return o; } function to_json(workbook) { var result = {}; workbook.SheetNames.forEach(function (sheetName) { var roa = X.utils.sheet_to_json( workbook.Sheets[sheetName], { raw: true, }); if (roa.length > 0) { result[sheetName] = roa; } }); return result; }fixdataとto_jsonは、おまじないだと思ってもよいでしょう。
正常に処理できれば、変数outputに、JSON形式に変換されたエクセルデータが格納されます。
一度、console.logなどで変換されたデータを出力してみれば、どのような形でデータにアクセスすればよいかが、わかるでしょう。
これで、JavaScriptの豊富なプレゼンテーションライブラリを使い、エクセルデータを可視化することができます!
0 件のコメント:
コメントを投稿