How to Dynamically Hide TableSheet Scrollbars

In some cases, you may want the scrollbars of the TableSheet hidden when they are not needed in order to clean up the UI. You can reference the following material in order to accomplish this.

You can get the height and width of the worksheet canvas, then hide the vertical scrollbars if the height of the rows is less than the viewportCanvasHeight, and vice versa for the width. For example:

let viewportCanvasWidth = (document.querySelector('canvas[gcuielement="gcWorksheetCanvas"]') as any).width;

let viewportCanvasHeight = (document.querySelector('canvas[gcuielement="gcWorksheetCanvas"]') as any).height;
        if (totalRowsHeight < viewportCanvasHeight) {
            spread.options.showVerticalScrollbar = false;
        }
        if (totalColumnWidth < viewportCanvasWidth) {
                spread.options.showHorizontalScrollbar = false;
        }

You can reference the following sample here for the working code (thanks to Ankit Kumar).

Note that the showVerticalScrollbar and showHorizontalScrollbar properties are applied to the current sheet. If you'd like to apply the properties in the same way to other sheets, you may do so by handling the SheetChanged event. You can also apply the properties upon triggering the RowHeightChanged and ColumnWidthChanged events.