2018年10月14日日曜日

JavaScriptでExcelファイルを読み込む方法

JavaScriptでエクセルファイルを処理して、分析したい場合があります。その方法を紹介します。

エクセルを処理するライブラリは色々と公開されていますが、以下のサイトで公開されている 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 件のコメント:

コメントを投稿

JavaScriptで10進数と16進数を変換する方法

JavaScriptで10進数と16進数を変換する方法を紹介します。 まず、16進数を、10進数に変換する方法です。 以下のサンプルコードでは、16進数の"DB"や"0A"を、10進数に変換しています。 var a = pa...