SpreadJSでは、水平方向および垂直方向のスクロールバーを使用できます。以下のさまざまなプロパティを変更して、ワークブックのスクロールバーのさまざまな側面にどのように影響するかを確認してください。
垂直スクロールバーの矢印ボタンを使用して、一度に1行ずつ上下にスクロールしたり、水平スクロールバーでは一度に1列ずつスクロールすることができます。スクロールバーのボックスをドラッグすると、より速くスクロールできます。スクロールする最も速い方法は、ボックスと矢印ボタンの間のスペースをクリックすることで、これによりページごとにシートをスクロールします。
SpreadJSスクロールバーはデフォルトで有効になっており、WorkbookオブジェクトのshowVerticalScrollbarメソッドとshowHorizontalScrollbarメソッドをfalseに設定すると無効にできます:
// get a reference to the workbook
var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));
// disable the vertical scrollbar
spread.options.showVerticalScrollbar = false;
// disable the horizontal scrollbar
spread.options.showHorizontalScrollbar = false;
スクロールバーのボックスをドラッグすると、ツールチップが表示される場合があります。垂直スクロールバーのボックスをドラッグすると、スクロールチップに一番上の行が表示されます。同様に、水平スクロールバーでは左端の列が表示されます。スクロールのヒントは、ワークブックのshowScrollTipオプションで有効にします:
var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));
// enable scroll tips for both scrollbars
spread.options.showScrollTip = GC.Spread.Sheets.ShowScrollTip.both;
// Other possible values:
// GC.Spread.Sheets.ShowScrollTip.horizontal;
// GC.Spread.Sheets.ShowScrollTip.vertical;
// GC.Spread.Sheets.ShowScrollTip.none;
通常、アクティブなシートの最後の行または列を超えてスクロールすると、空白の領域が表示されます。scrollbarMaxAlignオプションを有効にすると、行または列があるアクティブなシートの領域にスクロールが制限されます。
// prevent scrolling past the last row or column
spread.options.scrollbarMaxAlign = true;
スクロールボックスは、高速スクロールでの使用に加えて、シートの上部または下部に達するまでのスクロール量をそのサイズで視覚的に示します。スクロールボックスのサイズは2つのオプションで制御できます:1つ目はscrollbarShowMaxで、アクティブなシートの行または列の総数に基づいてコンテナのサイズを計算します。2つ目はscrollIgnoreHiddenで、サイズの計算において非表示の行または列を無視します。
次のアイテムは非表示として扱われます:
// control the height or width of the scroll box container:
// the area between the scrollbar's box and arrows
spread.options.scrollbarShowMax = true;
// Ignore hidden rows when calculating the size of the scroll
// box container
spread.options.scrollIgnoreHidden = true;