SpreadJSのクライアント側Excel入出力機能

こんにちは、SpreadJS担当の村上です。

先日のサービスパックリリース以降、新しくなったSpreadJSに関する沢山のお問い合わせをいただいております。(ありがとうございます!)

用法や性能、初版からの変更点など、頂戴するご質問内容は多岐に及んでいますが、なかでもひときわ多くのご質問をいただいております新機能、「クライアントサイドExcelIO」について、今日はご紹介したいと思います。

この機能を使用すると、SpreadJSで表示したスプレッドシートの内容をMicrosoft Excel形式のファイルに出力したり、Excel形式のファイルをSpreadJSに読み込んだりすることができるようになります。

使い方はとっても簡単です。以下のサンプルコードにあるように、Excelファイルを読み込むときはopenメソッド、Excelファイルを書き出すときはsaveメソッドをコールします。

Openメソッド使用例

// 例:Excelファイルオープン関数
function ImportFile() {
// SpreadJSインスタンスの取得
var workbook = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
// ExcelIOインスタンスの生成
var excelIO = new GC.Spread.Excel.IO();
// オープンするExcelファイル
var excelFile = “inputfile.xlsx”;
// Excelファイルオープン処理
excelIO.open(excelFile, function (json) {
// openメソッド成功時の処理
var workbookObj = JSON.parse(json);
workbook.fromJSON(workbookObj);
}, function (e) {
// openメソッド失敗時の処理
console.log(e);
});
}

Saveメソッド使用例

// 例:Excelファイルセーブ関数
function ExportFile() {
// SpreadJSインスタンスの取得
var workbook = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
// ExcelIOインスタンスの生成
var excelIO = new GC.Spread.Excel.IO();
// 保存ファイル名の設定
var fileName = “output.xlsx”;
// SpreadJSから保存データを取得
var json = JSON.stringify(workbook.toJSON());
// Excelファイルセーブ処理
excelIO.save(json, function (blob) {
// saveメソッド成功時の処理
saveAs(blob, fileName);
}, function (e) {
// saveメソッド失敗時の処理
console.log(e);
});
}

なお、実際のWebアプリケーションでクライアントサイドExcelIO機能を使用するためには、アプリケーションがオープン処理で参照できるようにExcelファイルをアップロードする機能や、セーブしたExcelファイルをエンドユーザーのローカル環境にダウンロードできるようにする機能の実装が必要です。

今回はこれらの周辺機能も実装した動作サンプルを用意しました。評価、実装のご参考としてお試しいただければ幸いです。

さいごに

弊社WebサイトにはSpreadJSを手軽に体験いただけるデモアプリケーションや無料のトライアル版がございます。今回の記事と併せてこちらも是非、ご確認ください。

\  この記事をシェアする  /