SpreadJS(日本語版)V18J

Released: Mar 26, 2025

V18J での更新項目

機能

  • データチャート: データ管理機能「データマネージャー」のデータをデータソースとしてチャートの生成が可能な「データチャート」機能を追加しました。縦棒、横棒、折れ線、円など全24種のチャートの種類をサポートします。※ データチャートは「機能限定配布ライセンス」では配布できません。
  • レポートシートと組み合わせてグラフィカルな帳票作成が可能に: データマネージャーをデータソースとするデータチャートは、同じくデータマネージャーをデータソースとする「レポートシート」でチャートを表示する用途に最適です。ダッシュボードや各種報告書などにおいてグラフィカルな表現が可能となり、これまで以上に多彩な帳票の作成を実現できます。
  • 〈ワークブック〉斜線分割型セル: セルを斜線で区切って複数のテキストを表示できる「斜線分割型セル」をセル型に追加しました。クロス集計したデータを表示する場合などに、角のセルに各データについてのタイトルを表示することができます。
  • 〈ワークブック〉テーブルとデータマネージャーのデータ連結: データマネージャーのテーブルをシートのテーブルのデータソースとしてデータ連結できるようになりました。
  • 〈ワークブック〉セル編集の許可: 新しく追加されたStyleクラスのallowEditInCellプロパティ、およびCellRangeクラスのallowEditInCellメソッドを使用して、セルの値の編集の許可/不許可を設定できるようになりました。単純にセルの値の編集を制限できるほか、セルボタンでドロップダウンを設定したセルにおいて、ドロップダウンからのみ値の設定を
  • 〈ワークブック〉Shiftキー+マウスホイール操作で水平方向にスクロール: Shiftキーを押しながらマウスホイールを操作することでワークシートを水平方向にスクロールできるようになりました。
  • 〈ワークブック〉:セルの編集モードに関する各種機能を強化: セルの編集モードに関する各種機能を強化しました。
    • セルの編集モードを変更するAPIを追加: 新しく追加された「changeEditorStatus」コマンドをcommandManagerで実行することで、以下の2つセルの編集モードを切り替えることができるようになりました。
      • 入力:空のセルに対してセルに値を入力中の状態。カーソルキーで他のセルに移動できる
      • 編集:空でないセルに対してセルの値を編集中の状態。カーソルキーで他のセルに移動できる
    • セルの編集を開始するAPIを追加: 従来のstartEditメソッドに加えて新しく追加された「startEdit」コマンドをcommandManagerで実行することで、セルの編集を開始することができるようになりました。startEditコマンドを使用すると、セルの値が空かどうかに関わらず、前述の「編集」のモードでセル入力を開始します。
    • F2キーでセル入力の開始が可能に: Excelと同様に「F2」キーでセルの入力を開始するショートカットが追加されました。「F2」キーで入力を開始した場合、セルの値が空かどうかに関わらず、前述の「編集」のモードでセル入力を開始します。
  • 〈ワークブック〉セルのコメントの検索: GC.Sheets.Search.SearchFoundFlags列挙体に「cellComment」が追加され、Worksheetのsearchメソッドで、セルのコメントを検索できるようになりました。また、リボンコンテナやSpreadJSデザイナにおいて、検索ダイアログの検索対象として新たに「セルタグ」と「コメント」を指定して検索できるようになりました。
  • 〈ワークブック〉キーボードショートカットによるフィルターの操作: フィルターのダイアログにおいて、キーボードショートカットで以下の各種操作ができるようになりました。
    • 「SPACE」キー:フィルター項目の選択と選択解除
    • 「LEFT」キー:フィルター項目の階層の折りたたみ
    • 「RIGHT」キー:フィルター項目の階層の展開
    • 「ENTER」キー:フィルター条件の適用
    • 「UP」/「DOWN」キー:フィルターリスト内のフォーカス移動
  • 〈ワークブック〉コンボボックス型セルのデータバインディング機能の強化: コンボボックス型セルのドロップダウンリストに表示する値について、従来の静的な配列データを設定する方法に加え、以下のようなデータソースと連結してリストを設定できるようになりました。
    • データマネージャーで作成したテーブル
    • FILTER、UNIQUEなどの数式関数の結果
    • ワークシート上のセル範囲
    • 上記データソースと連結する場合、ワークブックに新しく追加された「allowDynamicArray」オプションを有効にする必要があります。
  • 〈ワークブック〉テーブルのリサイズ操作の制限: TableResizingイベントの引数に新たに「cancel」プロパティが追加され、ユーザーによるリサイズ操作を特定の行数/列数の範囲内に制限することができるようになりました。
  • 〈ワークブック〉日付時刻ピッカーのデフォルト日付: 日付時刻ピッカーに新しく追加された「defaultDateTime」オプションを使用して、日付時刻ピッカーのデフォルトの日付時刻を設定できるようになりました。通常の日付時刻のほか、デフォルトの日付範囲を設定することも可能です。
  • ピボットテーブルの各種機能の強化: ピボットテーブルの各種機能を強化し、よりさまざまなユースケースに対応できるようになりました。
    • データソースの変更: Excelと同様にピボットテーブルに設定しているデータソースをUI操作で切り替えることができるようになりました。また、「updateSource」メソッドを使用してAPIから切り替えることも可能です。
    • 小計表示の制御: フィールドごとに小計を表示するかどうかを設定できるようになりました。
    • キーボードショートカットによるフィルターの操作:フィルターのダイアログにおいて、キーボードショートカットで以下の各種操作ができるようになりました。
      • 「Tab」キー:次のセクションに移動
      • 「Shift」キー+「Tab」キー:前のセクションに移動
      • 「SPACE」キー:フィルター項目の選択と選択解除
      • 「LEFT」キー:フィルター項目の階層の折りたたみ
      • 「RIGHT」キー:フィルター項目の階層の展開
      • 「ENTER」キー:フィルター条件の適用
      • 「Esc」キー:フィルターダイアログを終了、または前のダイアログに移動
      • 「UP」/「DOWN」キー:フィルターリスト内のフォーカス移動
  • レポートシートの各種機能の強化: レポートシートの各種機能を強化し、よりさまざまなユースケースに対応できるようになりました。
    • データチャートをサポート: 本バージョンで追加されたデータチャートをレポートシート上で使用できます。レポートシート内の任意の場所にデータチャートを追加することができる「フロートチャート」と、セルにチャートを設定して繰り返しの表示ができる「テンプレートセルチャート」の2つの使い方が可能です。
    • セルの展開と折りたたみ: レポート内でグループ化したセルの展開、または折りたたみの表示を制御できるようになりました。デザイナやAPIで初期表示の状態を設定可能になったほか、コンテキストメニューからの変更にも対応します。
    • データソースのフィールドの検索: レポートシートのデータソースパネルでテーブルのフィールドを検索できるようになりました。
    • ウィザードで集計関数の選択をサポート: レポートシートのウィザードを使用してレポートを作成する際に、集計関数を選択できるようになりました。
    • コンテナ: フィールドを特定の行、列、値に関連付けてデータを動的に管理できる「コンテナ」機能を追加しました。UI操作で横並び、縦並び、グループ化などのレイアウトを設計しやすくなります。
    • フィールド値エディタのドロップダウンでパラメータが選択可能に: レポートシートにパラメータが追加されている場合、データ操作設定のフィールド値エディタのドロップダウンから定義済みのパラメータを選択して設定できるようになりました。
  • 3種の統計関数を追加: 以下の3種のExcel互換の統計関数を追加しました。
    • GROUPBY(「GROUPBY関数」のデモを見る)
    • PIVOTBY(「PIVOTBY関数」のデモを見る)
    • PERCENTOF(「PERCENTOF関数」のデモを見る)
  • 〈表計算関数〉イータ縮小ラムダをサポート: LAMBDA関数の記述を縮小できる「イータ縮小ラムダ(Eta Reduced Lambda)」機能をサポートしました。
  • 〈リボンコンテナ/SpreadJSデザイナ〉非表示のセルの検索: リボンコンテナやSpreadJSデザイナに「非表示を無視」オプションを追加し、非表示のセルの値も検索できるようになりました。
  • Vue 3コンポーネントでTypeScriptの使用をサポート: SpreadJSのVue 3コンポーネントでTypeScriptを利用できるようになりました。
  • 受注明細サンプルをリニューアル: InputManJSセルを使用した受注明細サンプルアプリケーションをリニューアルしました。本サンプルでは以下の箇所でInputManJSセルの各機能を使用しています。
    • 郵便番号:マスク型
    • 受注日:日付時刻型
    • 出荷日:日付時刻型
    • 区分名:コンボ型
    • 単価:数値型
    • 数量:数値型
  • その他の機能強化: ワークブック関連の以下の機能に対応しました
    • カスタムデータプロバイダーを作成して、シート上の任意のセル範囲に対するデータ処理を効率化できるようになりました。
    • 「getUsedRange」メソッドで、セルタグの設定範囲を取得できるようになりました。