Freeze Panes
Toggle frozen rows and columns interactively. Scroll a 50-row dataset while headers stay fixed.
How it works
This demo renders a 50-row regional sales table with 12 monthly columns, then lets you toggle between four freeze configurations using the buttons above the grid.
- "Freeze Header Row" — row 0 stays visible while you scroll down through all 50 rows
- "Freeze First Column" — the region column stays pinned while you scroll right through Jan–Dec
- "Both" — row 0 and column 0 are frozen simultaneously, anchoring the corner cell
- "None" — removes all freeze and lets you scroll freely in all directions
- Frozen sections are rendered as separate Canvas layers so there is no performance cost compared to an unfrozen grid
Key APIs used
ws.setFrozenRows(count) Pin the top N rows so they remain visible while scrolling vertically
ws.setFrozenColumns(count) Pin the left N columns so they remain visible while scrolling horizontally
ws.setGridSize(rows, cols) Set the worksheet dimensions before populating data
ws.cell(row, col).setStyle(style) Apply header styles (bold, background color) to differentiate frozen header cells
Source Code
Related Documentation
Related Demos
Cell Types Dashboard
Progress bars, star ratings, sparkline charts, checkboxes, and hyperlinks — all rendered inside spreadsheet cells.
Data Filter & Sort
Click column header dropdowns to filter and sort rows. Switch between 300, 1K, and 10K rows to test performance.
Cell Styles
Font styles, colors, backgrounds, text alignment, and border options — a showcase of the Cell Style API.