MindSphere Web Components
Aspect Variable Selector

The Aspect Variable Selector allows users to select one or multiple variables or aspects of one or more assets.

It can be configured to only display dynamic or static aspects, or variables of a specific datatype.

Example¶

Interface¶

Selector¶

<mdsp-aspect-variable-selector></mdsp-aspect-variable-selector>

Properties¶

Events¶

Models¶

interface IAspectVariablesSelection {
    assets: Asset[];
}

class Asset implements IAsset {
    public assetId: string;
    public tenantId: string;
    public name: string;
    public etag: number;
    public externalId: string;
    public t2Tenant: string;
    public description: string;
    public parentId: string;
    public typeId: string;
    public location: ILocation;
    public variables: any[];
    public aspects: any[];
    public deleted: string;
    public _links: any;
    public aspectsDefinition: IAspect[];
}

interface IAspect {
    name: string;
    holderAssetId: string;
    aspectTypeId: string;
    aspectTypeName: string;
    category: AspectCategory;
    description: string;
    variables: IVariable[];
}

interface IVariable {
    name: string;
    dataType: VariableDataType;
    unit: string | null;
    searchable: boolean;
    length: number | null;
    qualityCode: boolean;
}

interface IDataModel {
  // forces reload of data // forces reload of data, e.g. re-loading the aspects / variables
  refresh(): void;
}

interface IViewModel {
  refresh(): void;
}

Remarks¶

• The Aspect Variable Selector currently supports up to 5 assets with up to 10 aspects each, where each aspect has up to 10 variables.

Roles¶

• mdsp:core.AssetManagement.xxx (Asset Management API is used)

Optional: * mdsp:core:iot.timUser (if property time-series-info is set to true)

Snippets¶

Display Aspects in a flat list¶

<mdsp-aspect-variable-selector view-mode="Aspects"></mdsp-aspect-variable-selector>

Display Variables in a flat list¶

<mdsp-aspect-variable-selector view-mode="Variables"></mdsp-aspect-variable-selector>

Display Aspects and their Variables in a flat list¶

<mdsp-aspect-variable-selector view-mode="All"></mdsp-aspect-variable-selector>

Display Aspects in a Drop-Down List¶

<mdsp-aspect-variable-selector view-mode="AspectsAsDropDown"></mdsp-aspect-variable-selector>

Display Variables in a Drop-Down List¶

<mdsp-aspect-variable-selector view-mode="VariablesAsDropDown"></mdsp-aspect-variable-selector>

Display Aspects and their Variables in a Drop-Down List¶

<mdsp-aspect-variable-selector view-mode="AllAsDropDown"></mdsp-aspect-variable-selector>

Display Aspects and their Variables in a single selection mode¶

The single selection mode fires a selectedAspectsAndVariablesChanged event when you press the add button of a variable. The detail of this event contains only the variable the user clicked on.
Aspects of the asset are shown, but not selectable.

<mdsp-aspect-variable-selector view-mode="VariableSingleSelection"></mdsp-aspect-variable-selector>

Update an Time Series Chart with the selected Variables¶

The following attributes are recommended when the selected variable is to be displayed in an Time Series Chart:

• category="Dynamic": only show dynamic aspects
• data-types="INT,LONG,DOUBLE,BOOLEAN": list only datatypes supported by the Time Series Chart

<mdsp-aspect-variable-selector category="Dynamic" data-types="INT,LONG,DOUBLE,BOOLEAN" view-mode="All"></mdsp-aspect-variable-selector>

When the user changes the selection, an event is triggered. Use the detail property of this event to update the variablePaths parameter of the Time Series Chart:

 aspectVariableSelectorComp.addEventListener('selectedAspectsAndVariablesChanged', function (eventParams) {
            timeSeriesChart.variablePaths = eventParams.detail;
        });

Indicator when aspect holds time series data¶

<mdsp-aspect-variable-selector time-series-info="true"></mdsp-aspect-variable-selector>

Any questions left?

Ask the community

Except where otherwise noted, content on this site is licensed under the MindSphere Development License Agreement.