wijmo.cloud Class GoogleSheet Wijmo API Class

GoogleSheet Class

Represents a Google Sheets spreadsheet with one or more sheets.

Each sheet is represented by a Sheet object that exposes the data on the sheet as a CollectionView object which can be used as a data source for any Wijmo control.

In addition to full CRUD support you get all the CollectionView features including sorting, filtering, paging, and grouping. The sorting, filtering, and paging functions are performed on the on the client.

The code below shows how you can instantiate a GoogleSheet object that loads data from three sheets:

import { GoogleSheet } from '@grapecity/wijmo.cloud';
const SHEET_ID_NW = '1qnf-FCONZj_AmOlyNkpIA3mKvP8FQtVOr7K8Awpo360';
const API_KEY = 'AIzaSyCvuXEzP57I5CQ9ifZDG2_K8M3nDa1LOPE';
let gsNWind = new GoogleSheet(SHEET_ID_NW, API_KEY, {
    sheets: [ 'Products', 'Categories', 'Suppliers' ]


  • GoogleSheet



  • new GoogleSheet(sheetId: string, apiKey: string, options?: any): GoogleSheet
  • Initializes a new instance of the GoogleSheet class.


    • sheetId: string

      Parameter used to identify which GoogleSheet is to be accessed. This ID is the value between the "/d/" and the "/edit" in the URL of your GoogleSheet.

    • apiKey: string

      Identifier used to authenticate requests associated with the app. To generate API keys, please go to https://console.cloud.google.com/.

    • Optional options: any

      JavaScript object containing initialization data (property values and event handlers) for this GoogleSheet.

    Returns GoogleSheet



accessToken: string

Gets or sets the OAuth 2.0 access token used to gain write access to the sheet.

You can use the OAuth2 class to provide user authentication. The OAuth2 class has methods that allow users to log in and provides accessToken strings that can be used to access the sheet.


apiKey: string

Gets the API key that this GoogleSheet is associated with.


columnDataTypes: IColumnDataType[] | null

Gets or sets an array containing IColumnDataType objects that determine the data types for the sheet columns.

Column data types are determined automatically based on the sheet data. In some cases, however, you may want to override that and set the column data types explicitly. This may be useful for sheets that contain empty cells or columns with cells of mixed types.

The code below causes the GoogleSheet to parse columns named "PostalCode", "Phone", and "Fax" as strings and any columns with names ending in "Date" as dates:

import { DataType } from '@grapecity/wijmo';
import { GoogleSheet } from '@grapecity/google';
let ssNWind = new GoogleSheet(SHEET_ID_NW, {
    apiKey: API_KEY,
    columnDataTypes: [
        { pattern: /^(PostalCode|Phone|Fax)$/, dataType: DataType.String },
        { pattern: /Date$/, dataType: DataType.Date },


isLoading: boolean

Gets a value that indicates the GoogleSheet is currently loading data.

This property can be used to provide progress indicators.


sheetId: string

Gets the ID of this GoogleSheet.


Gets the list of Sheet objects in this GoogleSheet.



  • getSheet(title: string): Sheet







accessTokenChanged: Event<GoogleSheet, EventArgs>

Occurs when the value of the accessToken property changes.


Occurs when there is an error reading or writing data.


Occurs when the GoogleSheet finishes loading data.


Occurs when the GoogleSheet starts loading data.