機能一覧
ReoGrid Web 1.3.0 の全機能 — 描画・数式・データ操作・入出力・UI の 39 機能を、実際のスクリーンショット付きで紹介します。
コア機能
基盤となる機能 — 高性能な描画、セルデータ、スタイル、ワークブック構造。
Canvas 描画
HTML5 Canvas によるハイパフォーマンスなセル描画。DOM の肥大化がなく、10,000 行を 60fps で表示します。
createReogrid({ workspace: '#grid' }) 
マルチシートワークブック
1 つのグリッドが複数ワークシートのワークブックに。標準のシートタブバーで追加・名前変更・並べ替え・非表示・タブ色設定が可能。各シートが独自のデータ・選択・固定・Undo 履歴を保持します。
instance.workbook.addSheet('Sheet2') 
セルデータ
シンプルな API で値の読み書き、データの一括読み込み、表示テキストの取得が行えます。
worksheet.loadCells(data) 
セルスタイル
フォント（ファミリー・サイズ・太字・斜体・下線）、文字色・背景色、水平/垂直配置、テキスト折り返しに対応。
worksheet.setRangeStyle(range, style) 
数値フォーマット
Excel 互換のフォーマットコード — 桁区切り、通貨、パーセント、日付/時刻（#,##0、¥#,##0、0.00% など）。
worksheet.setCellNumberFormat(r, c, '#,##0') 
罫線
セル・範囲の罫線を上下左右ごとに設定。スタイル・色・太さを制御できます。
worksheet.setRangeBorders(range, borders) 
行・列のサイズ変更
ヘッダーのドラッグまたは API で行高・列幅を変更。内容に合わせた自動フィットにも対応。
worksheet.setColumnWidth(col, 120) その他の機能
行・列の挿入・削除と表示・非表示の切り替え。数式の参照は自動的にシフトします。
数式エンジン
自動再計算とクロスシート参照に対応した Excel 互換の数式エンジン。
数式エンジン
Excel 互換の AST パーサーと依存関係グラフ — 参照先セルは自動再計算されます。A1 形式の相対・絶対参照、範囲参照に対応。
worksheet.setCellInput(r, c, '=A1+B1*2') 
クロスシート数式
他シートのセルを参照 — =Sheet1!A1、=SUM(明細!A1:A3)、=VLOOKUP(A1,Master!A1:C10,2)。シート名変更で数式が書き換わり、編集は全シートへ伝播します。
=SUM('My Sheet'!A1:B2) 
検索・参照関数
VLOOKUP、HLOOKUP、XLOOKUP、INDEX、MATCH、XMATCH、ADDRESS、ROW、COLUMN、ROWS、COLUMNS。
=VLOOKUP(A2, D2:F10, 2) 
条件付き集計
SUMIF、COUNTIF、AVERAGEIF と複数条件版の *IFS（SUMIFS、COUNTIFS、MAXIFS、MINIFS）。
=SUMIFS(C2:C20, A2:A20, "East") その他の機能
高度な機能
データアプリケーション向けの機能 — フィルター、ソート、グループ化、リッチなセルタイプ、100万行データセット。
オートフィル（フィルハンドル）
選択範囲右下の四角をドラッグして値を上下左右へ拡張。コピー・等差数列・日付加算・数式の相対参照シフトを自動判定します。
オートフィルター
Excel 風のヘッダードロップダウンで値によるデータ絞り込み。ソートと組み合わせ可能で、1 万行超でも軽快に動作します。
worksheet.createAutoFilter(range) 
セルタイプ
チェックボックス、ドロップダウン、ボタン、プログレスバー、レーティング、スパークライン、ハイパーリンク — セル内で動くインタラクティブな部品。
worksheet.setCellType(r, c, { type: 'progress' }) 
条件付き書式
値・数式・テキストマッチによるルールで該当セルをリアルタイムに装飾。サイドごとの罫線オーバーライドにも対応。
worksheet.addConditionalFormat(rule) 
遅延ロード — 1,000,000 行
setDataSource() が可視行のみをオンデマンドでフェッチ — メモリは数百行のまま 100 万行のデータセットを表示できます。
worksheet.setDataSource({ rowCount: 1_000_000, load }) その他の機能
シート保護とセル単位のロック。入力セルだけ編集可能にし、テンプレートを保護できます。
グリッド上に画像を挿入・配置。請求書のロゴやカタログの商品写真に。
データ入出力
データの入出力 — Excel ファイル、無損失 JSON、クリップボード、印刷。
XLSX インポート
URL・File オブジェクト・ArrayBuffer から Excel ファイルを読み込み — 全シート・スタイル・結合・罫線・数式に対応。大容量ファイル向けのチャンク非同期ロードも。
instance.loadFromUrl('/data/report.xlsx') その他の機能
ワークブック全体を .xlsx ファイルとして保存 — マルチシート・スタイル・数式・罫線・条件付き書式が Excel と相互運用できます。
無損失のネイティブシリアライゼーション — セル・スタイル・数値書式・結合・罫線・固定・条件付き書式・アウトライン・フィルター・セルタイプ・保護を保持します。
OS クリップボードでのコピー・カット・ペースト（TSV / HTML 形式）。Excel や Google スプレッドシートと相互運用できます。
ワークシートをスタイル付き HTML テーブルに変換してブラウザ印刷。結合や罫線も保持されます。
UI 機能
洗練された編集 UX を標準装備 — インラインエディタ、Undo/Redo、ショートカット、アニメーション。
交互行カラー
偶数・奇数行の背景色を自動で塗り分け。セルごとのスタイル設定なしで読みやすい表に。
その他の機能
ダブルクリック・F2・Enter で始まるインライン WYSIWYG 編集。エディタはセルのフォント・行高・配置をそのまま反映します。
アクションベースの取り消し・やり直し（既定 30 ステップ、undoCapacity で変更可能）。シートごとに独立した履歴を持ちます。
Ctrl+Z/Y、Ctrl+C/V/X、Tab、Enter、矢印キーによるナビゲーションなど。
右クリックイベント API。アプリケーションに合わせたカスタムコンテキストメニューを構築できます。
シートごとにグリッドラインの表示・非表示を切り替え。請求書のような帳票レイアウトに便利です。
エディション比較
| Lite (無料) | Pro (有料) | |
|---|---|---|
| 行数 | 最大 100 行 | 無制限 |
| 列数 | 最大 26 列 (A〜Z) | 無制限 |
| 数式 | 算術演算のみ | 全 109 関数 |
| マルチシートワークブック | ✓ | ✓ |
| クロスシート数式 | ✓ | ✓ |
| セルスタイル | ✓ | ✓ |
| 数値フォーマット | ✓ | ✓ |
| 罫線 | ✓ | ✓ |
| セル結合 | ✓ | ✓ |
| オートフィル | ✓ | ✓ |
| スマート数式エディター | ✓ | ✓ |
| フリーズペイン | — | ✓ |
| XLSX インポート | ✓ | ✓ |
| XLSX エクスポート | — | ✓ |
| ReoGrid JSON 入出力 | ✓ | ✓ |
| セルタイプ | — | ✓ |
| 行・列の挿入/削除 | — | ✓ |
| 行・列の表示/非表示 | — | ✓ |
| ソート・フィルター | — | ✓ |
| 遅延ロード（1,000,000行） | — | ✓ |
| グループ化 | — | ✓ |
| 条件付き書式 | — | ✓ |
| セルツールチップ | — | ✓ |
| アニメーション | — | ✓ |
| 画像 | — | ✓ |
| 印刷 | — | ✓ |
フレームワーク対応
| フレームワーク | パッケージ | コンポーネント |
|---|---|---|
| React ≥17 | @reogrid/lite/react or @reogrid/pro/react | <Reogrid> (forwardRef) |
| Vue ≥3 | @reogrid/lite/vue or @reogrid/pro/vue | <Reogrid> (Composition API) |
| Vanilla JS/TS | @reogrid/lite or @reogrid/pro | createReogrid() |