Querying Data

Initialization

To query for data, you must first initiate the Vizzly SDK.

Initializing the Vizzly SDK

Ensure you have loaded the Vizzly package by following the prerequisite steps in our initializing guide.

If needed, you will also then be able to fetch the Vizzly instance using the following code.

const vizzly = Vizzly.use();

Usage

Once the SDK has been initiated, you can start querying the data.

Types

export type QueryAttributes[],
 
export type QueryAttributes = {
  filter: QueryAttributes.Filter[][];
  measure: QueryAttributes.Measure[];
  dimension: QueryAttributes.Dimension[];
  timeDimension: QueryAttributes.TimeDimension | null;
  dataSetId: string;
  order: QueryAttributes.Order[];
  limit: number;
};
 
export type QueryResponse = {
  results: (Result | null)[] | (any[][] | null)[] | null;
};
 
export type Result = {
  content: any[][];
  fields: Result.Field[];
};

Example

const doSomething = async () => {
  const query: QueryAttributes[] = [
    {
      filter: [],
      measure: [
        {
          field: 'fie_1',
          function: 'sum',
        },
      ],
      dimension: [
        {
          field: 'fie_1',
          function: 'none',
          pivot: 'x',
        },
      ],
      timeDimension: null,
      dataSetId: 'data_set_1',
      order: [],
      limit: 5000,
    },
  ];
  const response: QueryResponse = await vizzly.query();
};
 
doSomething();

Full Example

You can see an example of how it can be implemented in the Custom Component page.

Optional parameters

Types

export type QueryParams = {
  abortController?: AbortController;
  instanceId?: string;
  runQueries?: CustomDriver['runQueries'];
  data?: loadDataCallback;
  queryEngineEndpoint?: QueryEngineEndpoint;
  dateFilterOptions?: DateTimeFilterOptions;
 
  // The filters that have been applied a data set.
  dashboardFilters: DataSetDashboardFilters;
}
await vizzly.query(<< QUERY >>, { << QUERY PARAMS >> });