UMDのサポート

Spread.Sheetsでは、どこでも動かせるJavaScriptモジュールを実現するためのUMD（Universal Module Definition）パターンがサポートされます。

通常、Spread.SheetsのUMDパターンには、AMD（非同期モジュール依存）およびCommonJSのサポートが含まれます。これは、開発者がモジュール形式でコードを記述できるようにするためのモジュール仕様です。UMDパターンを使用したモジュール型プログラミングでは、コードの再利用性を確保できるだけでなく、コードの効率性も高まり、開発にかかる時間やリソースを大幅に縮小できます。さらに、JavaScriptでのコーディング時に、特定の規定に従ってスクリプトを記述しなければならないという依存性もなく、起こりがちないくつものプログラミング問題に対処するソリューションを提供しやすくなります。

UMDパターンは、Spread.Sheetsにおける以下の6つのjavascriptファイルでサポートされます。

gc.spread.sheets.all.xx.x.x.min.js
gc.spread.sheets.charts.xx.x.x.min.js
gc.spread.sheets.pdf.xx.x.x.min.js
gc.spread.sheets.print.xx.x.x.min.js
gc.spread.sheets.resources.xx.xx.x.x.min.js
gc.spread.excelio.xx.x.x.min.js

AMDの使用

AMD（ブラウザ優先）の依存モジュールは非同期にロードできるので、ブラウザの応答が失われる可能性を回避できます。

次のコードは、AMD、Excel IO SpreadおよびAMDの組み合わせを使用して、RequireJSを設定し、Spread.sheetsを初期化します。

JavaScript	コードのコピー
// RequireJSを設定します。 <script type="text/javascript"> requirejs.config({ "baseUrl": "./lib", "paths": { "gc-spread-sheets": "gc.spread.sheets.all.12.0.0", "gc-spread-excelio": "gc.spread.excelio.12.0.0" } }); </script> // SpreadJSおよびExcelIOを初期化します。 <script type="text/javascript"> var spread, excelIo, json; require(['gc-spread-sheets', 'gc-spread-excelio'], function (gc, excel) { spread = new gc.Spread.Sheets.Workbook(document.getElementById("ss")); excelIo = new excel.IO(); }); function SaveExcel(){ json = spread.toJSON(); excelIo.save(json, function (blob) { // BLOBをExcelファイルに保存します。 saveAs(blob, "export.xlsx"); }, function (e) { if (e.errorCode === 1) { alert(e.errorMessage); } }); } </script>

JavaScript

コードのコピー

// RequireJSを設定します。
<script type="text/javascript">
  requirejs.config({
    "baseUrl": "./lib",
    "paths": {
      "gc-spread-sheets": "gc.spread.sheets.all.12.0.0",
      "gc-spread-excelio": "gc.spread.excelio.12.0.0"
    }
  });
</script>

// SpreadJSおよびExcelIOを初期化します。
<script type="text/javascript">
  var spread, excelIo, json;
  require(['gc-spread-sheets', 'gc-spread-excelio'], function (gc, excel) {
    spread = new gc.Spread.Sheets.Workbook(document.getElementById("ss"));
    excelIo = new excel.IO();
  });

  function SaveExcel(){
    json = spread.toJSON();
    excelIo.save(json, function (blob) {
      // BLOBをExcelファイルに保存します。
      saveAs(blob, "export.xlsx");
      }, function (e) {
      if (e.errorCode === 1) {
        alert(e.errorMessage);
      }
    });
  }
</script>

CommonJSの使用

Common JS（サーバー優先）の依存モジュールでは、JavaScriptコードが統合開発環境（IDE）で実行されます。

次のコードは、Common JSを使用してSpread.Sheetsを初期化します。

JavaScript	コードのコピー
var gc = require('../lib/gc.spread.sheets.all.xx.x.x.min.js'); window.onload = function() { var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss')); } var gc = require('../lib/gc.spread.sheets.all.xx.x.x.min.js'); var excel = require('../lib/gc.spread.excelio.xx.x.x.min.js'); window.onload = function() { var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss')); var json = JSON.stringify(workbook.toJSON()); var excelIo = new excel.IO(); excelIo.save(json, function (blob) { // BLOBをExcelファイルに保存します。 }, function (e) { if (e.errorCode === 1) { alert(e.errorMessage); } }); }

JavaScript

コードのコピー

var gc = require('../lib/gc.spread.sheets.all.xx.x.x.min.js');

window.onload = function() {
  var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss'));
}

var gc = require('../lib/gc.spread.sheets.all.xx.x.x.min.js');
var excel = require('../lib/gc.spread.excelio.xx.x.x.min.js');

window.onload = function() {
  var workbook = new gc.Spread.Sheets.Workbook(document.getElementById('ss'));
  var json = JSON.stringify(workbook.toJSON());
  var excelIo = new excel.IO();
  excelIo.save(json, function (blob) {
    // BLOBをExcelファイルに保存します。
    }, function (e) {
    if (e.errorCode === 1) {
      alert(e.errorMessage);
    }
  });
}