The requested page is not available for the requested platform. You are viewing the content for Default platform.
All docs
V19.1
19.2 (preview)
19.1
18.2
The page you are viewing does not exist in version 18.2. This link will take you to the root page.
18.1
The page you are viewing does not exist in version 18.1. This link will take you to the root page.
17.2
The page you are viewing does not exist in version 17.2. This link will take you to the root page.

ASPxClientDashboardItemData Class

Represents multidimensional data visualized in the dashboard item.

Declaration

declare class ASPxClientDashboardItemData

Remarks

Each data-bound dashboard item uses a multidimensional representation of data (the ASPxClientDashboardItemData class). This provides the capability to visualize information hierarchically. For instance, the pivot grid allows end-users to expand or collapse column/row field values to view data at different detail levels. The Drill-Down feature provides a common way to move between different detail levels in different dashboard items. Use the ASPxClientDashboard.GetItemData method to obtain multidimensional data visualized in the specified dashboard item.

The value corresponding to a specific hierarchy level is stored in the ASPxClientDashboardItemDataAxisPoint class that defines a data point in a multidimensional space. Such data points are placed on a specific data axis that is represented by the ASPxClientDashboardItemDataAxis class. For instance, a pivot grid has the "Row" and "Column" axes, a chart has the "Argument" and "Series" axes, etc.

Use the following methods to access the displayed data.

To learn more, see the Obtaining Underlying and Displayed Data topic.

Examples

The following example demonstrates how to obtain client data corresponding to a particular visual element using ASPxDashboard's client-side API. In this example, the ASPxClientDashboard.ItemClick event is handled to obtain client data and invoke the dxPopup widget with the child dxChart.

In the event handler, the ASPxClientDashboardItemClickEventArgs.GetData method is called to obtain dashboard item's client data. The ASPxClientDashboardItemClickEventArgs.GetAxisPoint method returns the axis point corresponding to the clicked card while the ASPxClientDashboardItemData.GetSlice method returns the slice of client data by this axis point. To obtain axis points belonging to the "Sparkline" data axis, the ASPxClientDashboardItemDataAxis.GetPoints method is used. Corresponding actual/target values are obtained using the ASPxClientDashboardItemData.GetDeltaValue method.

The dxChart is used to display the detailed chart showing a variation of actual/target values over time.

function getClientData(args) {
    if (args.ItemName == "cardDashboardItem1") {
        var clientData = [],
            clientDataTable = [],
            clickedItemData,
            delta;
        var sparklineAxis = DashboardDataAxisNames.SparklineAxis,
            defaultAxis = DashboardDataAxisNames.Default;

        clientData = args.GetData();
        clickedPoint = args.GetAxisPoint(defaultAxis);
        clickedItemData = clientData.GetSlice(clickedPoint);
        delta = args.GetDeltas()[0];

        for (var i = 0; i < clickedItemData.GetAxis(sparklineAxis).GetPoints().length; i++) {
            var dataTableRow = {},
            axisPoint = clickedItemData.GetSlice(clickedItemData.GetAxis(sparklineAxis).GetPoints()[i]);

            dataTableRow["Argument"] = clickedItemData.GetAxis(sparklineAxis).GetPoints()[i].GetValue();
            if (axisPoint.GetDeltaValue(delta.Id).GetActualValue().GetValue() != null &&
                axisPoint.GetDeltaValue(delta.Id).GetTargetValue().GetValue() != null) {
                dataTableRow["Actual"] = axisPoint.GetDeltaValue(delta.Id).GetActualValue().GetValue();
                dataTableRow["Target"] = axisPoint.GetDeltaValue(delta.Id).GetTargetValue().GetValue();
            }
            else {
                dataTableRow["Actual"] = 0;
                dataTableRow["Target"] = 0;
            }
            clientDataTable.push(dataTableRow);
        }

        var $chart = $('<div/>');
        $chart.dxChart({
            height: 500,
            dataSource: clientDataTable,
            series: [{
                valueField: 'Actual', name: 'Actual'
            }, {
                valueField: 'Target', name: 'Target'
            }
            ],
            commonSeriesSettings: {
                type: 'splineArea',
                argumentField: 'Argument',
                ignoreEmptyPoints: true
            },
            argumentAxis: {
                showZero: false,
                type: 'discrete'
            },
            valueAxis: {
                showZero: false,
                type: 'continuous',
                label: { format: 'currency' }
            }
        });

        var popup = $("#myPopup").data("dxPopup");
        popup.option('title', clickedPoint.GetValue() + " - Details");
        $popupContent = popup.content();
        $popupContent.empty();
        $popupContent.append($chart);
        popup.show();
    };
}

function initPopup() {
    $("#myPopup").dxPopup({
        width: 800, height: 600,
        title: "Details",
        showCloseButton: true
    });
}
See Also

Methods

CreateTuple(values) Method

Creates a tuple based on the specified axes names and corresponding values.

Declaration

CreateTuple(values: any[] | ASPxClientDashboardItemDataAxisPoint[]): ASPxClientDashboardItemDataAxisPointTuple

Parameters

Name Type Description
values any[] | ASPxClientDashboardItemDataAxisPoint[]

An array of name-value pairs containing the axis name and corresponding values.

Returns

Type Description
ASPxClientDashboardItemDataAxisPointTuple

An ASPxClientDashboardItemDataAxisPointTuple object representing an axis point tuple.

Remarks

For instance, you can use the following syntax to pass a name-value pair to the CreateTuple method.

var axisPointTuple = clientData.CreateTuple([{ AxisName: DashboardDataAxisNames.DefaultAxis, Value: ["UK", "Robert King"]}]);

GetAxis(axisName) Method

Returns the specified data axis.

Declaration

GetAxis(axisName: string): ASPxClientDashboardItemDataAxis

Parameters

Name Type Description
axisName string

A string value returned by the DashboardDataAxisNames class that specifies the name of the data axis.

Returns

Type Description
ASPxClientDashboardItemDataAxis

A ASPxClientDashboardItemDataAxis object that contains data points corresponding to the specified value hierarchy.

See Also

GetAxisNames Method

Gets the names of the axes that constitute the current ASPxClientDashboardItemData.

Declaration

GetAxisNames(): string[]

Returns

Type Description
string[]

An array of String values that represent the names of the axes.

Remarks

The DashboardDataAxisNames class exposes constants that identify possible types of data axes.

GetDataMembers Method

Returns an array of data members available in a data source.

Declaration

GetDataMembers(): string[]

Returns

Type Description
string[]

An array of string values that represent data members available in a data source.

GetDeltaValue(deltaId) Method

Gets the summary value for the specified delta.

Declaration

GetDeltaValue(deltaId: string): ASPxClientDashboardItemDataDeltaValue

Parameters

Name Type Description
deltaId string

A String that is the data item identifier.

Returns

Type Description
ASPxClientDashboardItemDataDeltaValue

A ASPxClientDashboardItemDataDeltaValue object providing delta element values.

Remarks

Use the ASPxClientDashboardItemDataDelta.Id property to obtain the data item identifier passed to the GetDeltaValue method. The ASPxClientDashboardItemDataDelta class objects are returned by the following properties.

See Also

GetDeltas Method

Gets the deltas for the current ASPxClientDashboardItemData object.

Declaration

GetDeltas(): ASPxClientDashboardItemDataDelta[]

Returns

Type Description
ASPxClientDashboardItemDataDelta[]

An array of ASPxClientDashboardItemDataDelta objects containing the delta metadata.

See Also

GetDimensions(axisName) Method

Gets the dimensions used to create a hierarchy of axis points for the specified axis.

Declaration

GetDimensions(axisName: string): ASPxClientDashboardItemDataDimension[]

Parameters

Name Type Description
axisName string

A string value returned by the DashboardDataAxisNames class that specifies the name of the data axis.

Returns

Type Description
ASPxClientDashboardItemDataDimension[]

An array of ASPxClientDashboardItemDataDimension objects containing the dimension metadata.

GetMeasureValue(measureId) Method

Returns a total summary value for the specified measure.

Declaration

GetMeasureValue(measureId: string): ASPxClientDashboardItemDataMeasureValue

Parameters

Name Type Description
measureId string

A String that is the measure identifier.

Returns

Type Description
ASPxClientDashboardItemDataMeasureValue

A ASPxClientDashboardItemDataMeasureValue object providing the measure value and display text.

Remarks

Use the ASPxClientDashboardItemDataMeasure.Id property to obtain the data item identifier passed to the GetMeasureValue method. The ASPxClientDashboardItemDataMeasure class objects are returned by the following properties.

See Also

GetMeasures Method

Gets the measures for the current ASPxClientDashboardItemData object.

Declaration

GetMeasures(): ASPxClientDashboardItemDataMeasure[]

Returns

Type Description
ASPxClientDashboardItemDataMeasure[]

An array of ASPxClientDashboardItemDataMeasure objects containing the measure metadata.

See Also

GetSlice(tuple) Method

Gets the slice of the current ASPxClientDashboardItemData object by the specified axis point tuple.

Declaration

GetSlice(tuple: ASPxClientDashboardItemDataAxisPointTuple | ASPxClientDashboardItemDataAxisPoint): ASPxClientDashboardItemData

Parameters

Name Type Description
tuple ASPxClientDashboardItemDataAxisPointTuple | ASPxClientDashboardItemDataAxisPoint

A ASPxClientDashboardItemDataAxisPointTuple object that is a tuple of axis points.

Returns

Type Description
ASPxClientDashboardItemData

An ASPxClientDashboardItemData object that is the slice of the current client data object by the specified axis point tuple.