列固定（フリーズペイン）

ヘッダー行や左端列をスクロール時に固定表示する方法を説明します。

列固定はPro版で利用可能です。

基本的な使い方

const ws = grid.worksheet

// 先頭1行を固定（ヘッダー行の固定）
ws.setFrozenRows(1)

// 先頭2列を固定
ws.setFrozenColumns(2)

// 固定を解除
ws.setFrozenRows(0)
ws.setFrozenColumns(0)

固定状態の取得

const frozenRows = ws.getFrozenRows()       // 固定行数
const frozenCols = ws.getFrozenColumns()     // 固定列数
const frozenWidth = ws.getFrozenWidth()      // 固定列の合計幅 (px)
const frozenHeight = ws.getFrozenHeight()    // 固定行の合計高さ (px)

仕組み

フリーズペインを設定すると、グリッドは最大 4 つのビューポートに分割されます。

+---------------+--------------------+
| 固定ヘッダー   | 固定行（横スクロール）|
+---------------+--------------------+
| 固定列         | メインエリア        |
|（縦スクロール） |（縦横スクロール）    |
+---------------+--------------------+

• 固定ヘッダー — スクロールしても動かない
• 固定行 — 横スクロールに追従、縦スクロールでは固定
• 固定列 — 縦スクロールに追従、横スクロールでは固定
• メインエリア — 通常のスクロール

使用例：データテーブル

const ws = grid.worksheet

// ヘッダー行を設定
const headers = ['ID', '名前', '部署', '入社日', '売上']
headers.forEach((h, i) => {
  ws.cell(0, i).setValue(h).setStyle({
    bold: true,
    backgroundColor: '#1e40af',
    color: '#ffffff',
  })
})

// ヘッダー行を固定
ws.setFrozenRows(1)

// ID 列を固定
ws.setFrozenColumns(1)

使用例：Excel 風のフリーズ

// B2 を基点にフリーズ（A列と1行目を固定）
ws.setFrozenRows(1)
ws.setFrozenColumns(1)