グレープシティ、JavaScriptライブラリ「SpreadJS」を発売、ExcelライクなUIのほか、新たに多彩なデータレイアウトを可能にするコントロールを搭載

　グレープシティは、ExcelライクなUIと、多彩なデータレイアウトを可能にするグリッドUIの2つのコントロールを収録するJavaScript製品「SpreadJS（スプレッドJS）」を9月27日より発売する。税別の1開発ライセンス価格は150000円。

　「SpreadJS」は、ExcelライクなUIを実現する「Spread.Sheets」と、グリッド表現の枠を超え多彩なデータレイアウトを可能にする「Spread.Views」の2つのコントロールを収録したJavaScript製品。

　Spread.Sheetsは、2016年7月発売の「SpreadJS 9J」リファクタリング版の後継コントロールで、いくつかの機能が強化されている。Spread.Viewsは、今回追加された全く新しいコントロールで、グリッドUIの可能性を追求することによって、カレンダーやガントチャートなど自由なデータ表現を実現した。

　Spread.Sheetsに追加された機能は主に以下の3点。

• クライアントサイドのExcel入出力機能の強化
• パディング領域の設定とラベル機能の追加
• Spread.Sheetsデザイナの搭載

　クライアントサイドのExcel入出力の強化については、従来のSpreadJS 9Jにも備わっていたAPIを用いたクライアントサイドのExcel入出力機能をアップデート。データ、数式、セルの書式設定に加え、スパークライン、条件付き書式の設定などもそのままインポート・エクスポートできるようになる。

　また、セルの内側にパディング領域を設定できるようになるため、より柔軟なセル配置が可能。下図のように、セルにラベルを追加したフォームを作成することも容易だ。

セルの内側にパディング領域を設定できるようになり、フォーム作成が容易に

　さらに、SpreadJS 9Jのリファクタリング前のものには搭載されていた、GUIベースのデザイナが復活。スプレッドシートのレイアウト設計が簡単にできる専用デザイナを搭載した。Excelで作成したシートデザインをインポートして活用することもできるため、エンドユーザーのイメージをスムーズに表現できる。

　新コントロールSpread.Viewsは、標準的なグリッド表示はもちろんのこと、カレンダーやガントチャート、タイムラインなどの表現を実現する。これにより、「業務アプリケーションを独自にカスタマイズしたい」「サーバーからデータを取り出した際の見せ方を工夫したい」といったニーズに応える。

「Spread.Views」は多彩なデータレイアウトを可能にする

　製品で提供するレイアウトは、「グリッド」「カレンダー」「ガントチャート」「カード」「トレリス」「タイムライン」「メーソンリー」の7種。

　例えば、最もオーソドックスなグリッド表示では、列を水平方向に配置して表示する「水平レイアウト」も設定可能。行テンプレート機能を使用すれば、1レコード複数行表示にも対応できるなど柔軟性の高いレイアウトとなっている。また、ガントチャートは、プロジェクトの進捗管理に最適なガント形式でデータを表現。連結データに親子関係を設定すれば、チームやタスク種別ごとにデータをまとめて階層表示を行うことも可能だ。さらに、データをカード状に並べて表示するカードレイアウトは、ECサイトなどでの商品データ陳列に適していたり、トレリスは、タスク管理に便利なボード表示を実現したりと、多様な用途にマッチできるコントロールとなっている。また、表示したデータはそのレイアウトのまま編集も可能で、3つの編集モードを搭載している。

「ガントチャート」は視認性が高くプロジェクトの進捗管理に適している

　ライセンス体系も従来のマシン単位から一新され、ユーザー単位での提供となる。1ライセンスで3台のマシンに製品をインストールでき、異なるOSでの動作確認や設計作業のたびの入れ替えが不要になる。また、今回よりサブスクリプション方式となり、契約期間中はテクニカルサポートやフリーアップグレードのサービスが利用できるようになる。ライセンスの詳細は専用サイトより確認できる。

　Spread.Sheetsの対応ブラウザは、Internet Explorer 9以上、Microsoft Edge、Chrome、FireFox、Safari 5.1以上、iOS（Safari、Chrome）で、Spread.ViewsではInternet Explorer 11、Microsoft Edge、Chrome、Safari 5.1以上、iOS（Safari、Chrome）が対応。Android用ブラウザには非対応。

【関連リンク】
・グレープシティ
・SpreadJS