DashboardState Class

A data container for changes resulting from end-user interaction - selected master filter values, drill-down levels, selected dashboard item layers and current parameter values.

Declaration

export class DashboardState

Remarks

The DashboardState class includes states of individual dashboard items (the DashboardState.Items property) and currently selected parameter values (DashboardState.Parameters).

How to Apply a Dashboard State

The following example shows how to apply the dashboard state to the Energy Statistics demo. The Year parameter is 2008, the Card‘s master filter value is Solid Fuels. MVCxDashboard is the client instance name of the DashboardControl.

function onClick() {
  var control = MVCxDashboard.GetDashboardControl();
  control.setDashboardState({
    "Parameters": {
      "Year": 2008
    },
    "Items": {
      "cardProductionImportByType": {
          MasterFilterValues: [["Solid Fuels"]]
      }
    }
  });
}

The code below shows how to apply the dashboard state to the Sales Overview demo. The Range Filter‘s predefined period is 6 Month, the Grid‘s master filter value is Nevada. MVCxDashboard is the client instance name of the DashboardControl.

function onClick() {
  var control = MVCxDashboard.GetDashboardControl();
  control.setDashboardState({
      "Items": {
      "gridSalesByState": {
        MasterFilterValues: [["Nevada"]]
      },
      "range": {
        RangeFilterState: {
          PeriodName: "6 Months"
        }
      }
     }
  });
}

How to Reset a Dashboard State to Default

The code below clears filters (unselects all master filter values), the RangeFilter state, and drill-down levels for dashboard items. To do this, pass an empty object of a dashboard item state to the entire dashboard state.

Note

The control variable in the example below is the obtained DashboardControl instance. Refer to the following topic for information on how to obtain a DashboardControl for each platform: Web Dashboard - Client-Side Specifics.

function onClick() {
  //... 
  var state = JSON.parse(control.getDashboardState());
  if (state && state.Items) {
      Object.keys(state.Items).forEach(function (itemName) {
          var itemState = state.Items[itemName];
          itemState.MasterFilterValues = [];
          itemState.DrillDownValues = [];
          itemState.RangeFilterState = { };
      }) 
  }
  control.setDashboardState(JSON.stringify(state));
}

Properties

Items Property

Provides access to states of individual dashboard items displayed in the dashboard.

Declaration

Items: {
    [id: string]: ItemState;
}

Property Value

Type	Description
[id: string]: ItemState	A collection of ItemState objects that are states of individual dashboard items.

Remarks

The Items property provide access to the following states:

State Value	API
selected master filters values	ItemState.MasterFilterValues
current drill-down levels	ItemState.DrillDownValues
a selected tab page	ItemState.TabPageName
Range Filter settings	ItemState.RangeFilterState
a selected dashboard item layer[1]	ItemState.SelectedLayerIndex

Footnotes

1. For the Pie, Card, Treemap, Gauge and Choropleth Map dashboard items.

Parameters Property

Specifies the selected parameter values.

Declaration

Parameters: {
    [id: string]: DevExpress.Dashboard.Data.PrimitiveType | Array<DevExpress.Dashboard.Data.PrimitiveType>;
}

Property Value

Type
[id: string]: PrimitiveType | PrimitiveType[]

Remarks

The following example shows how to apply the dashboard state to the Energy Statistics demo. The Year parameter is 2008. MVCxDashboard is the client instance name of the DashboardControl.

function onClick() {
  var control = MVCxDashboard.GetDashboardControl();
  control.setDashboardState({
    "Parameters": {
      "Year": 2008
    }
  });
}