KPI

A KPI (Key Performance Indicator) renders a measure calculated by the GoodData platform.

Structure

import { Kpi } from "@gooddata/sdk-ui";
import { newMeasure } from "@gooddata/sdk-model";

const measure = newMeasure("<measure-identifier>");

<Kpi
    measure={measure}
    filters={<filters>}
    separators={<separators>}
/>

Example

The following sample KPI calculates the total sales in California:

import { Kpi } from "@gooddata/sdk-ui";
import { newPositiveAttributeFilter } from "@gooddata/sdk-model";
import * as Md from "./md/full";

<Kpi
    measure={Md.$TotalSales}
    filters={[
        newPositiveAttributeFilter(Md.StateName, ["California"])
    ]}
/>

Properties

NameRequired?TypeDescription
measuretruestringThe measure URI
filtersfalseFilterItem[]An array of filter definitions
formatfalsestringThe measure format. If specified, overrides the format stored with the measure.
backendfalseIAnalyticalBackendThe object with the configuration related to communication with the backend and access to analytical workspaces
workspacefalsestringThe workspace ID
separatorsfalseobjectThe format of the thousands separator and decimal separator used in measures. The default is { thousand: ",", decimal: "." }. For more information about setting the regional number format in a GoodData account,
onErrorfalsefunctionCustom error handler. Called with the argument containing the state and original error message, for example, { status:ErrorStates.BAD_REQUEST,error: {...} }.
onLoadingChangedfalsefunctionCustom loading handler. Called when a KPI changes to/from the loading state. Called with the argument denoting a valid state, for example, { isLoading:false}.