0% found this document useful (0 votes)
172 views69 pages

Analytic Applications - Part 2

Uploaded by

sujanreddy
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
172 views69 pages

Analytic Applications - Part 2

Uploaded by

sujanreddy
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 69

8/9/2020

SAP Analytics Cloud Help


Generated on: 2020-08-09

SAP Analytics Cloud | Q2 2020 (2020.8)

PUBLIC

Original content: https://help.sap.com/viewer/00f68c2e08b941f081002fd3691d86a7/release/en-US

Warning

This document has been generated from the SAP Help Portal and is an incomplete version of the official SAP product
documentation. The information included in custom documentation may not re ect the arrangement of topics in the SAP Help
Portal, and may be missing important aspects and/or correlations to other topics. For this reason, it is not for productive use.

For more information, please visit the https://help.sap.com/viewer/disclaimer.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 1/69
8/9/2020

Scripting Patterns and Examples


When you start writing scripts in analytics designer , it might be helpful for you to see and go through typical use cases and
examples for scripting in analytic applications. You can then adjust the scripts according to your business needs.

Here you nd typical scripting patterns and examples to help you script with analytics designer:

Using Version Management APIs on Data Models for SAP Analytics Cloud

Using Version Management APIs on SAP BPC Models

Possible Error Messages in the Context of Version Management APIs

Using the Planning APIs setUserInput and submitData

Using Formatting APIs to Format Numbers and Dates

Using Navigate APIs

Using Layout APIs

Using Selection API Functions for Tables and Charts

Example 1: Using OData Actions in an Application

Example 2: Using OData Actions in an Application

Best practices
Here you nd typical use cases for creating analytic applications and setting up the interaction among widgets through scripting:

Best Practice: Switching between Chart and Table

Best Practice: Filtering Table and Chart through Dropdown (Single Selection)

Best Practice: Filtering Table and Chart through Checkboxes (Multi Selection)

Using Version Management APIs on Data


Models for SAP Analytics Cloud
You can use version management APIs (script functions) to publish or delete versions and to publish revert data from planning
versions even if the table is not planning-enabled.

You can use the following APIs for version management:

Planning.getPrivateVersion

Planning.getPrivateVersions

Planning.getPublicVersion

Planning.getPubllicVersions

PlanningPrivateVersion.publish

PlanningPrivateVersion.publishAs

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 2/69
8/9/2020
PlanningPublicVersion.isDirty

PlanningPublicVersion.publish

PlanningPublicVersion.revert

PlanningVersion.deleteVersion

PlanningVersion.getDisplayId

PlanningVersion.getId

PlanningVersion.copy

privateVersion.getOwner

 Note
If you don't want version management scripts to be executed when you have disabled planning on the table, use the API
Table.getPlanning().isEnabled() to check this.

Related Information
Using the deleteVersion API
Using the publish API for Public Planning Versions
Using the publish API for Private Planning Versions
Using the revert API
Using the publishAs Public Version API
Using Version Management APIs on SAP BPC Models
Using the copy API
Using the getOwner API

Using the deleteVersion API


You can use the deleteVersion API (script function) to delete a public or private planning version.

Before you start


Before you use the deleteVersion API, make sure you have checked the following:

You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the deleteVersion API to the application user.

Example
The following script shows how you can use the deleteVersion API:

 Sample Code
// delete private version "actualPrivateVersionToDelete" => replace VersionManagement UI

var versionToDelete = Table_1.getPlanning().getPrivateVersion("actualPrivateVersionToDelete");

if (versionToDelete ) {

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 3/69
8/9/2020

versionToDelete.deleteVersion()

};

// delete public version "actualPublicVersionToDelete" => replace VersionManagement UI

var versionToDelete = Table_1.getPlanning().getPublicVersion("actualPublicVersionToDelete");

if (versionToDelete ) {

versionToDelete.deleteVersion()

};

Using the publish API for Public Planning


Versions
You can use the publish API (script function) to publish public planning versions.

Before you start


Before you use the publish API make sure you have checked the following:

You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the publish API to the application user (for example,
you want the application user to use a button in order to publish a version).

Example
The following script shows how you can use the publish API to replace the Version Management section of the application
toolbar at runtime:

 Sample Code
// publish modified public version "Actual" => Toolbar Button Publish Data / VersionManagement

var actualVersion = Table_1.getPlanning().getPublicVersion("Actual");

if (actualVersion) {

if(actualVersion.isDirty()) {

actualVersion.publish();

};

};

Example

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 4/69
8/9/2020
The following script shows how you can use the publish API to replace the dialog Publish All in the Publish Data section of the
application toolbar at runtime:

 Sample Code
// publish all modified public versions => Toolbar Button Publish Data

var publicVersions = Table_1.getPlanning().getPublicVersions();

for (var j = 0; j < publicVersions.length; j++) {

if (publicVersions[j].isDirty()){

publicVersions[j].publish();

};

};

Using the publish API for Private Planning


Versions
You can use the publish API (script function) to publish a private planning version.

Before you start


Before you use the publish API make sure you have checked the following:

You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the publish API to the application user (for example,
you want the application user to use a button in order to publish a version).

You can call this script function in two different ways:

1. No input parameters are given (the original version is overwritten):

In this case you can use the following scripting code:

 Sample Code

// override the original version from which myActual was created

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publish();

};

2. The target version is speci ed. In this case you can specify if you want to update the entire version or only those parts of
the version that have been changed. You can use the following scripting code:

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 5/69
8/9/2020

 Sample Code

// override the forecast version with myActual and update only changed data

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

var forecastVersion = Table_1.getPlanning().getPublicVersion("Forecast");

if (myActualVersion && forecastVersion) {

myActualVersion.publish(forecastVersion, true);

};

Using the revert API


You can use the revert API (script function) to revert planning versions.

Before you start


Before you use the revert API make sure you have checked the following:

You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the revert API to the application user (for example,
you want the application user to use a button in order to revert a version).

Example
The following script shows how you can use the revert API to replace the Revert menu of the Version Management section in
the application toolbar at runtime:

 Sample Code
// revert modified public version "Plan" => Toolbar Button Publish Data / VersionManagement

var planVersion = Table_1.getPlanning().getPublicVersion("Plan");

if (planVersion) {

if(planVersion.isDirty()) {

planVersion.revert();

};

};

Example
You can also use the revert API to replace the Revert All dialog in the Publish Data dialog:

 Sample Code
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 6/69
8/9/2020

// revert all modified public versions => Toolbar Button Publish Data

var publicVersions = Table_1.getPlanning().getPublicVersions();

for (var j = 0; j < publicVersions.length; j++) {

if (publicVersions[j].isDirty()){

publicVersions[j].revert();

};

};

Using the publishAs Public Version API


You can use the publishAs API (script function) to publish a planning version as a public version.

Before you start


Before you use the publishAs API, make sure you have checked the following:

You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the publishAs API to the application user.

This API works with a string as input for the new version name. Optionally, you can specify a category. If no category is provided,
the original category of the source version is used.

Example
The following script shows how you can use the publishAs API:

 Sample Code
// publish private version myActual as public version with name "newBudget"

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publishAs("newBudget", Category.Budget);

};

Using the copy API


You can copy planning versions by using the PlanningVersion.copy API. This API function only works for SAP Analytics
Cloud models.

Before you start


Before you use the copy API make sure you have checked the following:

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 7/69
8/9/2020
You have created an application that contains a table and planning model for SAP Analytics Cloud.

You have assigned the planning model to the table.

You've made up your mind on how you want to visualize or expose the copy API to the application user (for example, you
want the application user to use a button to copy a version).

Example
The following script shows how you can use the copy API instead of the Copy menu of the Version Management section in the
application toolbar at runtime:

 Sample Code
// copy private version "privateVersionToCopy" with all data and Category = Budget

var originalVersion = Table_1.getPlanning().getPrivateVersion("privateVersionToCopy");

if (originalVersion) {

originalVersion.copy("targetVersionName", PlanningCopyOption.AllData, PlanningCategory.Budget)

};

// copy public version "publicVersionToCopy" with no data and without changing the category

var originalVersion = Table_1.getPlanning().getPublicVersion("publicVersionToCopy");

if (originalVersion) {

originalVersion.copy("targetVersionName", PlanningCopyOption.NoData)

};

 Note

Currently the copy API only supports the options to copy all or no data.

Keep in mind that all versions are copied with the default currency conversion and that you can't change the currency
conversion.

Using the getOwner API


You can use the getOwner API to check if a private planning version is owned by the current user of the private version.

The check is necessary because a user cannot perform certain operations on a private version like delete, copy, or publish if the
version is not owned by the user.

Before you start


This API can only be called on a private version and is therefore not relevant for BPC models.

Example
The following script shows how you can use the getOwner API:

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 8/69
8/9/2020

 Sample Code
// check if the private version is owned by the current user

var privateVersion = Table_1.getPlanning().getPrivateVersion("privateVersionName");

if (privateVersion && privateVersion.getOwner() === Application.getUserInfo().id) {

privateVersion.deleteVersion();

} else {

// fallback. e.g. show message to user that they may not do certain operations on this version

Using Version Management APIs on SAP


BPC Models
You can use the Version Management APIs for SAP BPC Models.

For SAP Business Planning and Consolidation (SAP BPC), there is always exactly one version (of type public version with ID "All
Versions"). You cannot delete this version. When working with SAP BPC models, therefore, you don't have to think about private-
version APIs or the deleteVersion API.

To retrieve the SAP BPC version, you can use either the getPublicVersions()[0] or getPublicVersion("All
Versions") API. Both API calls return the same version.

Example
This example shows how you can use the publish API to publish modi ed data on SAP BPC and replace the toolbar button
Publish Data:

 Sample Code
// publish modified data to BPC => replace Toolbar Button Publish Data

var bpcVersion = Table_1.getPlanning().getPublicVersion("All Versions");

if (bpcVersion) {

if(bpcVersion.isDirty()) {

bpcVersion.publish();

};

};

Example
This example shows how you can use the revert API to revert a version.

 Sample Code
// publish modified data to BPC => replace Toolbar Button Publish Data

var bpcVersion = Table_1.getPlanning().getPublicVersions()[0];

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f0… 9/69
8/9/2020
if (bpcVersion) {

if(bpcVersion.isDirty()) {

bpcVersion.revert();

};

};

Possible Error Messages in the Context of


Version Management APIs
Learn how to prevent possible error messages when you use version management APIs.

Operate on Deleted Planning Versions


A previously deleted versions (no matter if it was deleted by the script APi or through user interaction in the application), will
behave different from a non-deleted version.

Return values for calls made on deleted versions

Use the following getter functions on versions:

PlanningVersion.getId() => returns last ID before deletion

PlanningVersion.isDirty() => returns last modified stated before deletion

PlanningVersion.deleteVersion() => returns true (the promised state was reached)

PlanningVersion.publish() => returns false (the promised state cannot be reached)

PlanningVersion.publishAs() => returns false (the promised state cannot be reached)

PlanningVersion.revert() => returns true (the promised state was reached)

Reproduction

The easiest way to reproduce this, is to delete any version and simply continue with script execution:

// delete new Budget version and operate on it afterwards

var newBudgetVersion = Table_1.getPlanning().getPublicVersion("newBudget");

if (newBudgetVersion) {

console.log("VersionId before deletion:" + newBudgetVersion.getId());

newBudgetVersion.deleteVersion();

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 10/69
8/9/2020
console.log("VersionId after deletion:" + newBudgetVersion.getId());

newBudgetVersion.publish();

};

When calling any action function (revert, publishAs, publish or delete), the following error message will be displayed:
Version 'newBudget' does not exist anymore.

Publish a Private Version with a Wrong Name


There are several errors that can occur when you use the publishAs API.

Empty string as version name

Below code will lead to an error, as the version name may not be empty:

// below code will lead to an error, as the version name may not be empty

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publishAs("");

};

The following error message is shown: Enter a name for your version before you publish it.

Too long string as version name

Below code will lead to an error, as the version name is too long:

// below code will lead to an error, as the version name is too long

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publishAs("255characters");

};

The following error message is displayed: Enter a version name that is shorter than 255 characters.

Unauthorized characters in version name

Below code will lead to an error, as the version name contains characters that are not allowed:

// below code will lead to an error, as the version name contains characters that are not allowed

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publishAs("\:Version");

};

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 11/69
8/9/2020
The following error message is displayed: Enter a version name that doesn't contain the characters \\ : ; ' = [
].

Name already exists

Below code will lead to an error, as the version name already exists:

// below code will lead to an error, as the version name already exists

var myActualVersion = Table_1.getPlanning().getPrivateVersion("myActual");

if (myActualVersion) {

myActualVersion.publishAs("Actual");

};

The following error message is displayed: You can't save this version with name 'Actual', because this name
already exists. Please use a different name.

Delete actual version

Below code will lead to an error, as the actual version may not be deleted.

// below code will lead to an error, as the actual version may not be deleted

var actualVersion = Table_1.getPlanning().getPublicVersion("Actual");

if (actualVersion) {

actualVersion.deleteVersion();

};

The following error message is displayed: You can't delete the public version of category 'Actual'. This
version always has to be available.

Using the Planning APIs setUserInput and


submitData
With the setUserInput and submitData APIs, you can enable the application user to change the value of a cell in a table at
runtime.

The following prerequisites must be met:

You have assigned a planning model to the table - either a SAP BPC model or an SAP Analytics Cloud planning model.

You have set the table to planing- enabled ( just check the table property Planning enabled).

The setUserInput and submitData APIs work together.

Working with Booked and Unbooked Cells

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 12/69
8/9/2020
When you change a booked value, the leaf members that aggregate up to that value are adjusted proportionally to re ect your
change. When you enter a new value in an unbooked cell, which displays a dash character (-) instead of a value, values are also
booked to one or more leaf members for each dimension that aggregates up to the cell.

 Note
Be aware that you can’t use the setUserInput API for planning on an unbooked cell or a null cell displaying a (#) character
for SAP BPC models as it is currently not supported.

setUserInput(selection, value)
This API updates the cell of a table with a speci ed value and returns true if the operation was successful and false if the operation
failed.

Table_1.getPlanning().setUserInput(selection: Selection, value: string):boolean

The selection must be a selection from the table, and the value must be supplied according to the user formatting settings. It can
be one of these:

a string representing a number

The string can have 17 characters maximum.

If you attempt to use anything else than a number for a value, an error message mentioning that the value is not valid, is
displayed. Examples that trigger an error message:

If you use an empty string like Table_1.getPlanning().setUserInput({<selection>}, "");.

If you try to reset the value of a cell like Table_1.getPlanning().setUserInput({<selection>}, "-


");

If you use an empty space for planning like Table_1.getPlanning().setUserInput({<selection>},


" ");

Example of cases that shall trigger an error:

a scalar of the form *[multiplying factor]

The scalar can have 7 characters maximum.

submitData()
This API submits the updated cell data with all the modi ed data and triggers the refresh of data. It returns true if the operation
was successful and false if the operation failed.

Table_1.getPlanning().submitData();

The submitData API should be called after all the desired cells have been planned. Just call submitData() once to observe the
results on the planned table.

Example
The example is based on a table called Table_1 that has an underlying planning model.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 13/69
8/9/2020

Method Sample Code

Planning a cell with


 Sample Code
the selection object
Table_1.getPlanning().setUserInput({<selection>}, "5000000");
Even if the table is
Table_1.getPlanning().submitData();
hidden, it is still
possible to plan a
cell.

Planning a cell with


 Sample Code
the selection from
the table Table_1.getPlanning().setUserInput(Table_1.getSelections()[0], "500000000.99");
Table_1.getPlanning().submitData();

Planning a cell with


 Sample Code
the value from an
input eld Table_1.getPlanning().setUserInput({<selection>}, InputField_1.getValue());
Table_1.getPlanning().submitData();
This example
assumes the
existence of an
Input Field widget
called
InputField_1.

Useful Details
When you work with the APIs, please note the following information:

If you add a new dimension using an API, you must rst expand the dimension to be able to plan the cell.

If you plan a cell with the same value, the API returns true and overwrites the existing value.

If you plan setUserInput() with an invalid value, an error message is displayed and the API returns false.

If there is more than one table with the same underlying model, all the tables will be updated once you plan a cell.

Using Data Locking APIs


You can use data locking APIs to check if a model is data-locking enabled and to set or get data locks, even if the table is not
planning enabled.

You can use the following APIs for data locking:

Table.getPlanning().getDataLocking

Table.getPlanning().getDataLocking.getSate

Table.getPlanning().getDataLocking.setState

The following prerequisites must be met:

You have assigned an SAP Analytics Cloud planning model to the table.

You have a license that allows you to read the data locking state.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 14/69
8/9/2020

 Note

Data locking and the data locking APIs are not supported for SAP BPC models.

If data locking is disabled for a model, all locks will be deleted. If it is turned on again later, all members are reset to the
default lock state. The same happens if the default lock state or driving dimensions are changed.

Using the getDataLocking API


You can use the getDataLocking API to check if a planning model is enabled for data locking.

The check is necessary because an application user cannot perform certain operations on a table, like setState and getState, if
the model is not data-locking enabled.

 Example

 Sample Code

var planning = Table_1.getPlanning();

//gets the DataLocking object of the table - if DataLocking is enabled on the model

console.log(planning.getDataLocking());

Using the getState API


You can maintain the locking state of a cell belonging to a driving dimension by using the
Table.getPlanning().getDataLocking.getSate API. This API function only works for SAP Analytics Cloud planning
models that are enabled for data locking.

 Example
Please have a look at the example below for how to set the data lock state for a selected cell, instead of using the Manage Data
Locksquick actions menu option of the table.

 Sample Code

var selection = Table_1.getSelections()[0];

//get the state of the selection


var selectionLockState = Table_1.getPlanning().getDataLocking().getState(selection);

To make this example work, you have to select a cell on the table for which you want to retrieve the lock state. Alternatively, you
can de ne the selection yourself in the script editor.

The API returns the state of the selection, which can be OPEN, RESTRICTED, LOCKED, or MIXED. If the state of the selection
can't be determined, the API returns unde ned. This can happen under following conditions:

Your selection is invalid.


https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 15/69
8/9/2020
The cell that belongs to the selection is not found.

The cell has an unknown state.

The cell has been created by the quick action menu "Add Calculation" at runtime.

You don't have a license that allows you to maintain the data locking state.

If you have activated the option to show data locks for the table (select Show/Hide Data Locks in the table's quick action menu),
the lock icons will be updated after the API has been run.

Using the setState API


You can lock a cell belonging to a driving dimension by using the Table.getPlanning().getDataLocking.setSate API.
This API function only works for SAP Analytics Cloud planning models that are enabled for data locking.

The API returns true if the setting of the lock was successful, and false for the following cases:

You can't set the data lock state on a private version. In this case, the error message You can only set data locks on public
versions. Please use a public version and try again. is displayed.

If you try to set the state with the value Mixed, you will be noti ed in the script editor with the error message You can't set
the state with the value 'mixed'. Please specify either 'open', 'restricted' or 'locked' as value.. The same error message is
shown at runtime, if you attempt to execute the script, and the script fails.

If you select multiple cells and attempt to set the state, only the selection of the rst cell will be considered when setting
the state.

 Example
Set the selection to the locked state

 Sample Code

var selection = Table_1.getSelections()[0];

/sets the selection to Locked


var isSetStateSuccessful = Table_1.getPlanning().getDataLocking().setState(sel, DataLockingState.

 Note
This API replaces the table's quick action menu Manage Data Locks.

Using Formatting APIs to Format Numbers


and Dates
As an application designer, you can write scripts to allow end users to format certain existing number values and date values in an
application.

The format options for these two types of values are as follows:

Number Values
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 16/69
8/9/2020
Set maximum decimal places

Example: 1.23456 will be turned into 1.234 if the maximum decimal place is set as 3.

Set minimum decimal places

Example: 1.23 will be turned into 1.230 if the minimum decimal place is set as 3.

Set the decimal separator

Example: 1.23 will be turned into 1 23 if the decimal separator is set as empty space.

Enable digit grouping

Example: If enabled, 123456 will be turned into 123,456

Set separator of the digit grouping

Example: 123,456 will be turned into 123.456, if dot is set as the separator of the digital grouping.

Display sign value and set format of the sign value

Example: In a normal case, “+” and “-” can be set as the format of the sign value. In some special cases, “()” can be set to
indicate negative value too.

Display scale and set scale multiplier and affix

Example: E can be used as the scale multiplier, such as 1E-3; M can be set as a scale affix so that 123,456,789 can be set as
123M.

Date Values

Set the pattern of the date

Example: 2016/01/10 will be turned into Jan 10, 2016 if you set a date pattern in MMM dd, yyyy format.

For detailed information about all related APIs, refer to the Analytics Designer API Reference.

 Example
If you want to allow end users to click a button and display the formatted current system date in a text widget Text_1, write the
script below for the button:

 Sample Code

var s = DateFormat.format(new Date(), "MM dd, yyyy");


Text_1.applyText(s);

 Example
If you want to allow the end users to click a button and format the digit grouping of a number input in the widget InputField_1
according to the user preference settings, write the script below:

 Sample Code

var s = InputField_1.getValue();
var n = Number.parseFloat(s);
Text_1.applyText(NumberFormat.format(n));

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 17/69
8/9/2020
The formatted number will be displayed in the widget Text_1.

 Example
If you want to allow end users to click a button and format the digit grouping of a number input in the widget InputField_1
according to a customized setting, write the script below:

 Sample Code

var s = InputField_1.getValue();
var n = Number.parseFloat(s);
var nf = NumberFormat.create();
nf.setMinimumDecimalPlaces(3);
nf.setGroupingSeparator(".");
nf.setDecimalSeparator(",");
Text_1.applyText(nf.format(n));

The new format will set the digit grouping separator as “.” and the decimal separator as “,” and the formatted number will be
displayed in the widget Text_1.

Using the Refresh Data API


By leveraging the refresh data API, you can allow end users to trigger a data refresh for a widget associated with a data source.

You can also allow end users to trigger a data refresh for data sources of the application, which updates the widgets associated
with these refreshed data sources. The supported widgets are chart and table.

 Note
Currently, the R visualization widget is not supported.

Refresh Data of All Widgets Related to Data Sources of an Application


You can refresh all data sources of an application, which updates the widget associated with each data source, with the following
API:

Application.refreshData();

Refresh Data for a Speci c Data Source


You can refresh speci c data sources, which updates the widget associated with each speci ed data source, with the following
API:

Application.refreshData(datasources: [DataSource]);

Refresh Data of a Speci c Widget


You can refresh the data source of a widget, which updates the widget, with the following API:
Widget.getDataSource().refreshData();

 Sample Code

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 18/69
8/9/2020

//Example 1, write the script for the onClick event of a button to refresh all data sources when th

Application.refreshData();

// Example 2, write the script for the onClick event of a button to refresh the data sources of cha

var ds1 = Chart_1.getDataSource();


var ds2 = Table_1.getDataSource();
Application.refreshData([ds1, ds2]);

// Example 3, Use the refresh API together with timer API to refresh a widget in a certain interval
// Write the script for the onTimeout event of Timer_1 to refresh data of Chart_1 and Chart_2 every

Chart_1.getDataSource().refreshData();
Chart_2.getDataSource().refreshData();
Timer_1.start(60);

For more information about how to set up and use a timer, you can refer to Using Timer.

Related Information
Con guring Auto Refresh in Stories

Using Navigate APIs


Navigation APIs allow end users to navigate from one analytic application to another or to a speci c page of a story.

When running the analytic application, an application designer can de ne which story or analytic application to navigate to, which
parameters to use for the target URL, and whether to open the story or analytic application in a new tab or in the current browser,
using the following API events:

 Code Syntax
NavigationUtils {
openStory(storyId: string, pageId: string, parameters ? : UrlParameter | UrlParameter[], newTab
openApplication(appId: string, parameters ? : UrlParameter | UrlParameter[], newTab ? : boolean
createStoryUrl(storyId: string, pageId: string, parameters ? : UrlParameter | UrlParameter[]):
createApplicationUrl(appId: string, parameters ? : UrlParameter | UrlParameter[]): string
openUrl(url: string, newTab ? : boolean): void
}

For example, if you want to allow users to open Page 2 of Story_1 when clicking Button_1, and at the same time create a script
variable script_var_1 and add it to the URL as a parameter, then write the following script for Button_1:

 Sample Code
NavigationUtils.openStory("story_id", "page_id", UrlParameter.create("p_script_var_1", "123"));

In the script above, you don’t need to enter story_id and page_id manually. By typing Ctrl + Space , a value help dialog will pop
up. If you choose Open story selector, you can go to My Files and select the corresponding story or analytic application.

Using Layout APIs


As an application designer, you can directly set a widget's size and position in a parent container in the Styling panel. In addition to
that, by leveraging the layout related APIs, you can allow application users to dynamically set a widget's size and position

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 19/69
8/9/2020
according to the application logic and window size.

In some special cases, API calls will be ignored as they set invalid values:

Changing the height of widgets, such as dropdown, lter line, input slider, and range slider, won't take effect because they
are read-only.

Different widgets have minimal width and height size differences. Input values smaller than the minimal size won't take
effect.

Cannot set the size and position of a canvas. You can only get a canvas' current size and position (always {top: 0px, left:
0px}) and set them to a widget.

Related Layout script APIs are as bellow:

 Code Syntax
LayoutUnit.Pixel // sets the unit of the layout as Pixel
LayoutUnit.Auto // sets the unit of the layout as Auto
LayoutUnit.Percent // sets the unit of the layout as Percent
LayoutValue.create(value: number, LayoutUnit: Unit) // sets the layout value by creating a value wi

getLayout(): Layout // gets the layout of a widget


Layout.getLeft(): Unit; // Returns the left margin between the widget that you define layout for an
Layout.setLeft(value: Unit); // Sets the left margin between the widget that you define layout for
Layout.getRight(): Unit; // Returns the right margin between the widget that you define layout for
Layout.setRight(value: Unit); // Sets the right margin between the widget that you define layout fo
Layout.getTop(): Unit; // Returns the top margin between the widget that you define layout for and
Layout.setTop(value: Unit); // Sets the top margin between the widget that you define layout for an
Layout.getBottom(): Unit; // Returns the bottom margin between the widget that you define layout fo
Layout.setBottom(value: Unit); // Sets the bottom margin between the widget that you define layout
Layout.getWidth(): Unit; // Returns the width of the widget that you define layout for.
Layout.setWidth(value: Unit); // Sets the width of the widget that you define layout for.
Layout.getHeight(): Unit; // Returns the height of the widget that you define layout for.
Layout.setHeight(value: Unit); // Sets the height of the widget that you define layout for.

// Application Canvas Resize Event, the event is cached to be dispatch every 500ms when the applica
Application.onResize() = function() {
};

Application.getInnerHeight() // If canvas' size is fixed, it returns the height of the canvas; if d


Application.getInnerWidth() // If canvas' size is fixed, it returns the width of the canvas; if dyn

 Example
Add a table (Table_1), a button (Button_1) and two shapes (Shape_1, Shape_2) to the canvas. Write the script for Button_1 to
click the button to set table size to 600*400, and meanwhile set the top margin of Shape_1 to 60 px and the top margin of
Shape_2 to 10 percent of its parent container:

 Sample Code

Table_1.getLayout().setWidth(600);
Table_1.getLayout().setHeight(400);
Shape_1.getLayout().setTop(LayoutValue.create(60,LayoutUnit.Pixel));Shape_2.getLayout().setTop(Layo

If you set the canvas’ size to dynamic, after you click the button and resize your window, the top margin of Shape_1 will stay as 60
px while the top margin of Shape_2 will automatically t to new size of the window.

 Example

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 20/69
8/9/2020
When the application's canvas size is dynamic, write the script for the onResize event to make the size of Table_1
automatically adjust to the size of the window whenever you resize the window.

 Sample Code

var ResponsiveHeight = Application.getInnerHeight().value;


var ResponsiveWidth = Application.getInnerWidth().value;

Table_1.getLayout().setHeight(ResponsiveHeight);
Table_1.getLayout().setWidth(ResponsiveWidth);

Related Information
Styling Options for Widgets and Canvas

Using Selection API Functions for Tables and


Charts
You can use the selection API functions for tables and charts to retrieve the currently selected members and their dimensions. For
example, you can use this information to retrieve the corresponding data cells from the data source.

Getting a Selection
The getSelections() functions return an array of Selection objects, each representing a single selection.

Selection API Functions

Selection API Function Return Value

Table_1.getSelections() array of Selection (= Object<string>)

Chart_1.getSelections() array of Selection (= Object<string>)

The properties of such a Selection object are the dimension IDs. The values are the member IDs.

 Sample Code

"dim1": "member1",

"dim2": "member2"

You can access the selected member of a dimension using var memberId = selection[“dimensionId”];

You can iterate over all dimensions of a selection with a for-in loop like this:

 Sample Code

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 21/69
8/9/2020

var selection = Table_1.getSelections()[0];

for (var dimensionId in selection) {

var memberId = selection[dimensionId];

Using a Selection
With a Selection you can retrieve speci c data from data sources.

DataSource.getData() expects a selection object:

 Sample Code

var selection = Table_1.getSelections()[0];

var dataCell = Table_1.getDataSource().getData(selection);

When you specify the selection object passed into a getData() call, a value help for dimensions and members helps you to
enter the required dimension and member IDs.

Related Information
Using the Value Help for the Selection Object

Using Result Set APIs


The result set API allows you as an application designer to get a result set based on an input data selection in a table or chart, so
that you can traverse and get each data cell in the result set.

Before the result set API is introduced, you can retrieve individual data cells using DataSource.getData(). However it's not
possible to retrieve all members for a dimension in a speci c result set.

In a result set API, the input data selection speci es all or an arbitrary subset of the initial data set, for example:

 Sample Code
//A selection that retrieves values of "sales", "profit" if "maritial_status" is in "M" or "S".
{"marital_status": ["M", "S"], "(MEASURES_DIMENSION)": ["sales", "profit"]}

If the input data selection is left empty, all values of the initial data set will be retrieved

For a chart with multiple measures per data point, for example a bubble or scatterplot chart, the result set API will return all
available measures of each data point as different records. And if the source data has a hierarchy, parent member information will
also be returned.

Some changes made by end users when running an application will affect data returned by the result set as well, including:

Adding rows or columns to a table

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 22/69
8/9/2020
Hiding or excluding rows or column in a table. Only data of visible rows or columns will be returned.

Collapsing parent node in a table. All its children won't be returned.

Showing total value in a chart

Showing parent in a chart

Getting the new dimension or measure added by smart grouping and new forecast data in a predictive scenario.

Adding or removing comments in a chart or table.

 Note
If dataSource is set to lazy load, getResultset(), getDataSelections() returns [ ] and getResultMember()
returns unde ned.

Script API
Take table as an example:

 Code Syntax
// Returns the result sets according to the selections.
Table_1.getDataSource().getResultSet(selection?: Selection | Selection[] | SelectionContext, offset

// Returns the context of the data cells.


Table_1.getDataSource().getDataSelections(selection?: Selection | Selection[] | SelectionContext, o

//Returns the result member by dimension ID and selection. This works for data cells and header cel
Table_1.getDataSource().getResultMember(dimension: String | DimensionInfo, selection: Selection) :

//Returns number of visible rows and columns to help users understand current table structure.
Table.getRowCount(): integer
Table.getColumnCount(): integer

Code Example
Example 1

The rst example speci es that the input parameter location equals CT1.

 Source Code
// Input parameter is Selection
Chart_1.getDataSource().getResultset({
"@MeasureDimension": "[Account_BestRunJ_sold].[parentId].&[Gross_Margin]",
"Location_1": "[Location_1].[State_1].&[CT1]"
});

It returns a result set as below:

 Output Code
[{
"@MeasureDimension": {
"id": "[Account_BestRunJ_sold].[parentId].&[Gross_Margin]",
"description": "Gross Margin",
"formattedValue": "489000000",
"rawValue": "489000000"
},
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 23/69
8/9/2020
"Location_1": {
"id": "[Location_1].[State_1].&[CT1]",
"description": "California",
"parentId": "[Location_1].[State_1].&[SouthAmerica]"
}
}]

Example 2

The second example leverages the getDataSelections API to get the product dimension members of the data selected in the table.

 Sample Code
// Get distinct product member of the table widget
var selections = Table_1.getDataSource().getDataSelections();
var memberIds = ArrayUtils.create(Types.string);
for (var i = 0; i < selections.length; i++) {
var member = Table_1.getDataSource().getResultMember("Product_1", selections[i]);
if (member && member.id && memberIds.indexOf(member.id) < 0) {
memberIds.push(member.id);
}
}

For more information about the APIs, refer to Analytics Designer API Reference.

Using Range and Exclude Filters


The script API DataSource.setDimensionFilter() supports range lters and exclude lters.

Exclude Filters
You can lter out members from the drill-down with exclude lters. The following examples show the use of exclude lters:

In the following example, a single lter value is set for dimension "EMPLOYEE_ID". This keeps only the member with
employee ID 230 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {value: "230"});

In the following example, a single but excluding lter value is set for dimension "EMPLOYEE_ID". This removes the
member with employee ID 230 from the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {value: "230", exclude: true});

In the following example, multiple lter values are set for dimension "EMPLOYEE_ID". This keeps the members with
employee IDs 230 and 240 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {values: ["230", "240"]});

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 24/69
8/9/2020
In the following example, multiple but excluding lter values are set for dimension "EMPLOYEE_ID". This removes the
members with employee IDs 230 and 240 from the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {values: ["230", "240"], exclude: true});

Range Filters
You can lter ranges of members in the drill-down with range lters.

 Note
Please note the following when using range lters:

Range lters can only be applied to numeric dimensions.

A time dimension is not a numeric dimension.

SAP BW does not support numeric dimensions.

The following examples show the use of range lters:

In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
between 230 and 240 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {from: "230", to: "240"});

In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
less than 230 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {less: "230"});

In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
less or equal than 230 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {lessOrEqual: "230"});

In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
greater or equal than 230 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {greaterOrEqual: "230"});

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 25/69
8/9/2020
In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
greater than 230 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", {greater: "230"});

You can also apply multiple range lters at once.

In the following example, the range lter applied to dimension "EMPLOYEE_ID" keeps the members with employee IDs
less than 230 and greater than 240 in the drill-down:

 Sample Code

DS_1.setDimensionFilter("EMPLOYEE_ID", [{less: "230"}, {greater: "240"}]);

Example 1: Using OData Actions in an


Application
You can execute OData (V4) actions exposed by a connected on-premise SAP S/4HANA system within an analytic application.

Prerequisites
You have created an analytic application and have added an OData service to your application.

Context
In this example you see the following elements for ODataService_1:

The system: FUB

The end-point URL for the OData service

As metadata, the OData version and two actions, Flight/Book and CancelMyFlights

Procedure
1. Insert a Button widget and change the text of the button to Cancel Flight in the Properties of the Styling panel.

2. Start the script editor by clicking in the quick actions menu of the widget.

You will be creating a script to trigger execution of the OData action in the source system.

The script editor opens.

3. Type in the name of the OData service you have added and speci ed.

The script editor assists you with code completion and value help wherever possible when you click CTRL + Space . In
the script editor, do the following:

a. Type in the name of the OData Service: ODataService_1, followed by .

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 26/69
8/9/2020
b. Press CTRL + Space , then select the function executeAction().

c. Place the mouse cursor between the brackets ( () ) and press CTRL + Space , then select action
CancelMyFlights from the value help of executeAction(), followed by , and {}. Select Action CancelMyFlights
from value help of executeAction() by placing the cursor between the brackets ( () )and CTRL + Space , followed
by, and {}.

d. Place the mouse cursor between the brackets ({}), then press CTRL + Space to select the parameter DateFrom
from value help,, followed by : .

e. Type in the date 2019-01-01, followed by ,.

f. Press CTRL + Space and select DateTo from value help, folllowed by :.

g. Type in the date 2019-12-31 and nish with ;.

You have created a script to execute an OData action. This action has a simple syntax with two parameters and looks like
this:

ODataService_1.executeAction("CancelMyFlights", {DateFrom: "2019-01-01", DateTo: "2019-12-31"});

4. Insert another button, rename it to Book Flight in the Styling panel, and open the script editor.

The BookFlight Action is a bound action which is more complex than the rst one.

5. Type in the following script in the script editor by using code completion and value help:

ODataService_1.executeAction("Flight/Book", {Flight:{Airline:"UA",Flightconnection:"0941", Fligh

Results
You nished a simple OData action and a second one that is more complex. Now you can run your application and book and cancel
ights for the selected values.

You can enhance your application and start using other script methods to ll the parameter values dynamically with local or global
variables.

Finally, you can make the response from the backend system visible in the application by writing the response as a message in a
text eld.

To nd out how to do this, see Example 2: Using OData Actions in an Application

Example 2: Using OData Actions in an


Application
You can display the back-end system's response to an action in an application by writing the response as a message in a text eld.

Prerequisites
You have created an application and used a simple and a more complex OData action within this application for two buttons to
book and cancel ights for selected values.

Procedure
1. Insert six Text widgets on the canvas and rename the last one to MessageBox.

2. Rewrite your script from the Book Flight button as follows:


https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 27/69
8/9/2020

var ret = ODataService_1.executeAction("Flight/Book", {Flight:{Airline:"UA",Flightconnection:"09

var succ = "";

if (ret.ok === true) {

succ = "SUCCESS";

} else {

succ = "ERROR";

MessageBox.applyText(succ);

Text_2.applyText(succ + " message :" + ret.error.message);

Text_3.applyText(succ + " code :" + ret.error.code);

Text_4.applyText("target :" + ret.error.target);

Text_5.applyText("");

3. Rewrite your script from the Cancel Flight button as follows:

var ret = ODataService_1.executeAction("CancelMyFlights", {DateFrom: "2019-01-01", DateTo: "2019

console.log(ret);

var succ = "";

if (ret.ok === true) {

succ = "SUCCESS";

} else {

succ = "ERROR";

MessageBox.applyText(succ);

Text_2.applyText(succ + " message :" + ret.error.message);

Text_3.applyText(succ + " code :" + ret.error.code);

Text_4.applyText("target :" + ret.error.target);

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 28/69
8/9/2020

var info = "";

//if (false) {

if (ret.ok === true) {

var numberofoccupiedseats = ConvertUtils.integerToString(ret.value[0].Numberofoccupiedseats);

var flightprice = ConvertUtils.numberToString(ret.value[0].Flightprice);

var totalnumberofseats = ConvertUtils.integerToString(ret.value[0].Totalnumberofseats);

var currency = ret.value[0].Currency;

info = "Your flight price was " + flightprice + " " + currency + ". " + "There are " + numberofo

Text_5.applyText("" + info);

4. Run the application and book and cancel a ight to see the error messages.

Best Practice: Switching between Chart and


Table
Learn how to switch between a chart and a table using a toggle feature in an analytic application.

Prerequisites
You've already added a table and a chart widget to your canvas and placed them on top of each other.

To follow this sample use case, use the model BestRun_Advanced as data source.

Context
To switch between chart and table, you add to the application one image that represents a chart and another that represents a
table. Then you write scripts for each of the images so that when the user clicks on the chart image, the chart appears and the
table is hidden, and vice-versa.

The default setting for running the application is to have the table visible and the chart invisible.

Procedure
1. Select the table widget in your canvas and click Designer.

a. Go to the Styling panel and under Actions, make sure that Show this item at view time is selected.

b. Under Analytics Designer Properties, change the name of the widget to Table.

2. Select the chart widget in your canvas and click Designer.

a. Go to the Styling panel and under Actions, deselect Show this item at view time.

b. Under Analytics Designer Properties, change the name of the widget to Chart.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 29/69
8/9/2020
3. Add the images you want the application user to click when toggling between chart and table.

For example: and .

a. Click (Add...) Image .

b. Optional: If you need to upload the images rst, click Upload Image and upload your images.

c. Select the chart image and click Insert.

d. Repeat the above steps for the table image, and place the table image directly on top of the chart image.

When the application user clicks on the chart image, the table image appears in the same place.

4. To enable the switch between table and chart, you need to edit the names and then the scripts of both images. Change the
name of the table image to Switch_to_Table_display, and the name of the chart image to
Switch_to_Chart_display.

You do this on the Styling panel under Analytics Designer Properties, or on the Layout panel under Canvas Image_1
More Rename .

5. To edit the chart image's script, select the chart image and click .

The script editor opens the onClick script of this image. Here, you'll write a script that makes it possible to switch from
the chart to the table.

6. Enter this script:

 Sample Code

Chart.setVisible(true);
Table.setVisible(false);
Switch_to_Table_display.setVisible(true);
Switch_to_Chart_display.setVisible(false);

This script makes the chart visible and the table invisible and it sets the visibility of the table image to true and the visibility
of the chart image to false. You have con gured the application in a way that, when the chart is visible, the table image is
visible indicating that the user can switch back to the table.

7. Select the table image and click .

8. Enter this script in the script editor:

 Sample Code

Chart.setVisible(false);
Table.setVisible(true);
Switch_to_Table_display.setVisible(false);
Switch_to_Chart_display.setVisible(true);

This script makes the table visible and the chart invisible and it sets the visibility of the chart image to true and the visibility
of the table image to false. You have con gured the application in a way that, when the table is visible, the chart image is
visible indicating that the user can switch back to the chart.

9. Save the application and click Run Analytic Application.

Results
When you run the application, it looks like this:

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 30/69
8/9/2020

The table is displayed, because you've set it to default.

When you click on the chart image, the chart appears instead of the table and the image changes its look to a table icon:

When you click on the table image, the table appears instead of the chart and the image changes its look to a chart icon, as
shown in the above screenshot showing the default view when you rst run the application.

Best Practice: Filtering Table and Chart


through Dropdown (Single Selection)
Learn how to lter a table or a chart using a single measure selected from a dropdown widget.

Prerequisites
You've already added a table and a chart widget to your canvas and placed them on top of each other.

To follow all functions of this sample use case, you've completed the exercise Best Practice: Switching between Chart and
Table and can now enhance your analytic application.

Context
In the dropdown widget, you load all the measures of your data source and set the default ltering measure of the table to Gross
Margin Plan. When the application user selects a different measure in the dropdown, this lter is applied to both table and chart.

Procedure
1. Click (Add...) Dropdown .

2. Change the name of the dropdown to Dropdown_Measures.

You do this on the Styling Panel under Analytics Designer Properties, or on the Layout panel under Canvas Dropdown_1
More Rename .

3. Add a label to the dropdown that indicates to users that they can select measures through the dropdown.

a. Click (Add...) Text .

b. Place the text widget to the left of the dropdown.

c. Enter a text, Selected Measure, for example.

d. Optional: Resize the text widget.

4. To let users select a value from the dropdown, add a script variable that acts as a global variable, which can be accessed
from anywhere in your application.

a. On the Layout panel under Scripting, click (Add Script Variable).

b. In the Script Variable panel under Structure, enter CurrentMeasureFilterSelection as name, leave type
as string and enter [Account_BestRunJ_sold].[parentId].&[Gross_MarginActual] as default
value.

c. To close the Script Variable panel, click Done.

This script variable de nition lets Gross Margin appear as the default value in the dropdown when running the application.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 31/69
8/9/2020
5. To de ne what will happen when users select a lter value from the dropdown, create a script object. In this object, write a
function that sets the measure lter according to what the user has chosen from the dropdown.

a. On the Layout panel under Scripting, click (Add Script Object).

b. To rename the folder, hover over ScriptObject_1, click More Rename and enter Utils.

c. To rename the function, hover over function1, click More Rename and enter setMeasureFilter.

d. Click on the function setMeasureFilter, and when the Script Function panel opens, click (Add Argument).

e. Enter selectedId as name of the argument, leave type as string and click Done.

f. To write the script for the function, hover over the setMeasureFilter function, click and enter this script in the
script editor:

 Sample Code

Table.getDataSource().removeDimensionFilter("Account_BestRunJ_sold");
if (CurrentMeasureFilterSelection !== "") {
Chart.removeMeasure(CurrentMeasureFilterSelection, Feed.ValueAxis);
}
Table.getDataSource().setDimensionFilter("Account_BestRunJ_sold",selectedId);
Chart.addMeasure(selectedId, Feed.ValueAxis);

With this script you de ne what happens to the table and the chart when users select a measure from the
dropdown:

You remove any already set dimensions of the table or measures of the chart and add the captured value as the new
dimension and measure of the table as well as the chart.

De ne how to pass the captured value to the setMeasureFilter function by creating an onSelect function of the dropdown
widget.

6. To open the onSelect function, hover over the dropdown widget in the Layout panel, click and enter this script:

 Sample Code

Utils.setMeasureFilter(Dropdown_Measures.getSelectedKey());

This script gets the selected value of the dropdown and passes it to the setMeasureFilter function as parameter.

7. De ne what will happen when the analytic application is rst run by creating the onInitialization function of the
canvas itself.

a. Hover over the Canvas in the Layout panel, click and select onInitialization.

b. Enter this script in the script editor:

 Sample Code

var measures = Table.getDataSource().getMeasures();


var selectedKey = "";
if (measures.length > 0) {
for (var i=0;i<measures.length; i++){
// Measure
Dropdown_Measures.addItem(measures[i].id,measures[i].description);
if (selectedKey === "" && i === 0) {
selectedKey = measures[i].id;
Dropdown_Measures.setSelectedKey(selectedKey);

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 32/69
8/9/2020
console.log(["selectedKey ", selectedKey]);
}
console.log(["CurrentMeasure ", measures]);
}
}
Utils.setMeasureFilter(selectedKey);

With this script you make sure that on initialization, you load all the available measures of the table into your
dropdown.

After doing that, you set the selected key to the rst measure in that list and then you set your measure lter to that
rst measure in your list.

8. Save the application and click Run Analytic Application.

Results
When you run the application, it looks like this:

When you click on the dropdown, you can select a measure from all the listed measures that will lter the results of the table or the
chart.

You can click on to switch to the chart and select Gross Margin Plan, for example:

If you select Discount, the chart looks like this:

Best Practice: Filtering Table and Chart


through Checkboxes (Multi Selection)
Learn how to lter a table or a chart using multiple measures selected from a checkbox group widget.

Prerequisites
You've already added a table and a chart widget to your canvas and placed them on top of each other.

To follow all functions of this sample use case, you've completed the exercise Best Practice: Switching between Chart and
Table and can now enhance your analytic application.

Context
Unlike the dropdown widget, the checkbox group widget lets you use multiple measures as lters. In this use case, you add a
checkbox group widget where you list all the measures of your data source. On top of that, you add three buttons:

Button set selected to lter the table and the chart according to the selected measures of the checkbox group

Button remove all to remove all the selected measures rather than deselecting them one by one in the checkbox group

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 33/69
8/9/2020
Button set all to display all the available measures in your table and chart rather than selecting them one by one in the
checkbox group

Procedure
1. Click (Add...) Checkbox Group and place this widget on the left side of your table.

2. Change the name of the checkbox group to CheckboxGroup_Measures on the Layout panel under
Canvas CheckboxGroup_1 More Rename .

3. Remove the initial values Value 1 and Value 2 from the checkbox group value list in the Builder panel: Select these two
values one after the other, click , and then click Apply.

4. Add a label to the checkbox group that indicates to users that they can select measures through the checkboxes.

a. Click (Add...) Text .

b. Place the text widget on top of the checkbox group.

c. Enter a text, Measures, for example.

d. Optional: Resize the text widget.

5. For easy access to the checkbox group's measures, add the three buttons mentioned above:

a. Click (Add...) Button and place it beneath the label.

b. Repeat the step above for the other two buttons.

c. Select the rst button, click Designer Styling , and enter Button_setMeasureFilter as name and set
selected as text.

d. Select the second button, click Designer Styling , and enter Button_removeAllMeasures as name and
remove all as text.

e. Select the third button, click Designer Styling , and enter Button_setAllMeasures as name and set all as
text.

6. To access the values users select in the checkbox group, create two script variables that act as global variables, which can
be accessed from anywhere in your application:

The rst script variable, called AllMeasures, is set as an array and holds all the measures that users can select in the
checkbox group.

The second script variable, called CurrentMeasureFilterSelection, is set as a string and holds the measures that
users currently selected in the checkbox group.

a. On the Layout panel under Scripting, click (Add Script Variable).

b. In the Script Variable panel under Structure, enter AllMeasures as name, leave type as string, and toggle the
Set As Array button to YES.

c. To close the Script Variable panel, click Done.

d. Add a second script variable, and in the Script Variable panel under Structure, enter
CurrentMeasureFilterSelection as name, leave type as string, and toggle the Set As Array button to YES.

e. To close the Script Variable panel, click Done.

7. To de ne what will happen when users select a lter value in the checkbox group, create a script object. In this object, write
a function that sets the measure lter according to what the user has chosen from the checkbox group.

a. On the Layout panel under Scripting, click (Add Script Object).

b. To rename the folder, hover over ScriptObject_1, click More Rename , and enter Utils.

c. To rename the function, hover over function1, click More Rename , and enter setMeasureFilter.

d. Click on the function setMeasureFilter, and when the Script Function panel opens, click (Add Argument).

e. Enter selectedIds as name of the argument, leave type as string, toggle the Set As Array button to YES, and
click Done twice.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 34/69
8/9/2020
f. To write the script for the function, hover over the setMeasureFilter function in the Layout panel, click , and enter
this script in the script editor:

 Sample Code

// remove Measures
Table.getDataSource().removeDimensionFilter("Account_BestRunJ_sold");
if (CurrentMeasureFilterSelection !== [""]) {
for (var i=0;i<CurrentMeasureFilterSelection.length; i++){
Chart.removeMeasure(CurrentMeasureFilterSelection[i], Feed.ValueAxis);
}
}

// add Measures
Table.getDataSource().setDimensionFilter("Account_BestRunJ_sold",selectedIds);
for (i=0;i<selectedIds.length; i++){

Chart.addMeasure(selectedIds[i], Feed.ValueAxis);
}
// save the current selection into global variable
CurrentMeasureFilterSelection = selectedIds;

With this script you de ne what happens to the table and the chart when users select lter values in the checkbox
group:

You remove any already set dimensions of the table or measures of the chart.

You add the captured values the users have selected in the checkbox group as new dimensions of the table
and as new measures of the chart.

You take the currently selected measures and save them in the script variable
CurrentMeasureFilterSelection.

8. De ne what will happen when users click the buttons you created.

a. Hover over the set selected button in the Layout panel, click , and enter this script:

 Sample Code

Utils.setMeasureFilter(CheckboxGroup_Measures.getSelectedKeys());

This onClick function script calls the Utils.setMeasureFilter function and passes to it the selected
measures of the checkbox group.

b. Hover over the remove all button in the Layout panel, click , and enter this script:

 Sample Code

CheckboxGroup_Measures.setSelectedKeys([""]);
Utils.setMeasureFilter([""]);

This onClick function script removes all the selected measures from the checkbox group itself and passes an
empty array to the Utils.setMeasureFilter that updates your table and chart as well as your global variable
CurrentMeasureFilterSelection.

c. Hover over the set all button in the Layout panel, click , and enter this script:

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 35/69
8/9/2020

 Sample Code

CheckboxGroup_Measures.setSelectedKeys(AllMeasures);
Utils.setMeasureFilter(AllMeasures);

This onClick function script sets the selected keys of the checkbox group to the AllMeasures script variable you
de ned before and passes the same variable to the Utils.setMeasureFilter function.

9. De ne what will happen when the analytic application is rst run, by creating the onInitialization function of the
canvas itself.

a. Hover over the Canvas in the Layout panel, click , and select onInitialization.

b. Enter this script in the script editor:

 Sample Code

// get all measures from the table data source


var measures = Table.getDataSource().getMeasures();

// define array or the selected Keys


var selectedKeys = ArrayUtils.create(Type.string);

if (measures.length > 0) {
for (var i=0;i<measures.length; i++){
// add the Measure to checkbox group
CheckboxGroup_Measures.addItem(measures[i].id,measures[i].description);
//add the measure to the selectedKeys
selectedKeys.push(measures[i].id);
CheckboxGroup_Measures.setSelectedKeys(selectedKeys);

console.log(["CurrentMeasure ", measures]);


}
}

console.log(["selectedKey ", selectedKeys]);


AllMeasures = selectedKeys;
Utils.setMeasureFilter(selectedKeys);

With this script you make sure that on initialization, you get all the available measures of the table's data source.

You de ne a selected keys array of type string and, using a loop, you add the measures to your checkbox group and
the selected keys array. You also call on the setSelectedKeys function of the checkbox group and set its
selected keys to your array.

Finally, you set the script variable AllMeasures and the measure lter to the selected keys.

10. Save the application and click Run Analytic Application.

Results
When you run the application, it looks like this:

If you click the remove all button, all measures are deselected and there is no table or chart (when you click on ).

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 36/69
8/9/2020

If you click the set all button, all measures are selected and the table (or chart) looks the same as when you rst ran the
application.

Let's select a few measures (Gross Margin Plan, Quantity Sold, Original Sales Price abs Dev, and Discount) in the checkbox group
and click the set selected button. The table is updated accordingly, (and also the chart when you click on ):

Best Practice: Using Filter Line for Filtering


Table, Chart and R Visualization
Learn how to lter a Table, a Chart or an R Visualization using a Filter Line widget.

Prerequisites
You've already added a table and a chart widget to your canvas and placed them on top of each other.

To follow all functions of this sample use case, you've completed the exercise Best Practice: Switching between Chart and
Table and can now enhance your analytic application.

Context
Instead of loading all the dimensions in your data set into a checkbox group or a dropdown widget, you select speci c dimensions
to load into a lter line. Unlike other data bound widgets (such as table or chart), R visualization can add multiple input data
models. To support R visualization in lter line, one dropdown list is added to select the connected input data.

Procedure
1. Click (Add...) Filterline and place this widget above your table.

2. Change the name of the lter line to FilterLine. You do this on the Styling panel under Analytics Designer Properties
or on the Layout panel under Canvas FilterLine_1 More Rename .

3. Select the lter line in your canvas and click Designer.

a. Go to the Builder panel, and under source widget select Table.

b. Under Dimension Selection click on Add Dimension and select Location, Product, Sales Manager and Store in the
checklist.

4. To enable the option to toggle between table and chart you need to click on the fx next to the table in the Layout and
choose onResultChanged.

a. Enter this script in the script editor:

 Sample Code

console.log('OnResultChanged');
Chart.getDataSource().copyDimensionFilterFrom(
Table.getDataSource(), "Location_4nm2e04531");
Chart.getDataSource().copyDimensionFilterFrom(
Table.getDataSource(), "Product_3e315003an");
Chart.getDataSource().copyDimensionFilterFrom(
Table.getDataSource(),

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 37/69
8/9/2020
"Sales_Manager__5w3m5d06b5");
Chart.getDataSource().copyDimensionFilterFrom(
Table.getDataSource(),
"Store_3z2g5g06m4.Store_GEOID");

This script makes that the lter you chose stay the same while toggling between table and chart. It is copied four
times, one for each of the dimensions added in the lter line.

5. Save the application and click Run Analytic Application.

Results
When you run the application it looks like this:

When you click on the lter line the 4 measures you added appear.

By clicking on one of the measures (in this example Location) a window pops up and lets you choose which members of that
measure (in this example San Francisco, Las Vegas, and Portland) you want to include in the table or chart.

Table and chart will be updated and you can switch between them by using the table and chart images as in the best practice
chapter before.

Best Practice: Filtering Table and Chart


through Cascaded Filtering
Learn how to lter on dimensions and then according to hierarchies (such as Flat Presentation, ABC, Category…) to choose how to
display the data.

Prerequisites
You've already added a table and a chart widget to your canvas and placed them on top of each other.

To follow all functions of this sample use case, you've completed the exercise Best Practice: Switching between Chart and
Table and can now enhance your analytic application.

Context
You add two dropdown lists, one for ltering dimension and the other for ltering hierarchies and depending on what dimension
you choose to lter on, the Dropdown List for the hierarchies lters will change. There is always one consistent lter for hierarchies

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 38/69
8/9/2020
which is Flat Presentation and according to your chosen dimension, you might either only have that one or have more options. The
different lters can be chosen by simply selecting them from the dropdown lists you added.

Procedure
1. Click (Add...) Dropdown and place this widget above your table.

2. Change the name of the dropdown to Dropdown_Dimensions. You do this on the Styling panel under Analytics
Designer Properties or on the Layout panel under Canvas Dropdown_1 More Rename .

3. Click (Add...) Dropdown and place this widget above the table next to the other dropdown. Leave some space in
between the dropdowns so you can add name labels for them later on.

4. Change the name of the dropdown to Dropdown_Hierarchies. You do this on the Styling panel under Analytics
Designer Properties or on the Layout panel under Canvas Dropdown_1 More Rename .

5. Add the values you want to chose from in the widget.

a. In your Canvas select the Dropdown_Dimensions widget and click Designer.

b. b. Go to the Builder Panel and under Dropdown Value click .

c. Insert Location_4nm2e04531 as Value 1 and Location as dedicated text.

d. Click and insert Product_3e315003an as Value 1 and Product as dedicated text.

e. Click and insert Store_3z2g5g06m4 as Value 1 and Store as dedicated text.

f. Click and insertSales_Manager__5w3m5d06b5 as Value 1 and Sales Manager as dedicated text.

g. g. Set Location as default value.

h. Click Apply to save the changes.

6. To distinguish the dropdown lists create a label for each of them.

a. Click (Add...) Text and place it on the left side of the widget Dropdown_Dimensions.

b. Doubleclick the label and type Dimension.

c. Change the name of the text widget to Dropdown_Dimensions_Label. You do this on the Styling panel under
Analytics Designer Properties or on the Layout panel under Canvas Text_1 More Rename .

d. Click (Add...) Text and place it on the left side of the widget Dropdown_Hierarchies.

e. Doubleclick the label and type Hierarchies.

f. Change the name of the text widget to Dropdown_Hierarchies_Label. You do this on the Styling panel under
Analytics Designer Properties or on the Layout panel under Canvas Text_1 More Rename .

7. In the Scripting panel underneath the Layout panel via Script Variables add a scripting variable. Click Add Script
Variable .

a. In the window that pops up under Structure change the name to CurrentDimension and select string as the
Type.

b. To make the location appear as default value in the dropdown widget when you run the application insert
Location_4nm2e04531 as Default Value.

c. Click Done to save the changes.

8. In the Canvas, hover over Dropdown_Hierarchiesand click . In the script editor insert this script as onSelect()
function:

 Sample Code

var sel = Dropdown_Hierarchies.getSelectedKey();

// set hierarchy for Table


Table.getDataSource().setHierarchy(CurrentDimension, sel);

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 39/69
8/9/2020

// set hierarchy for Chart


Chart.getDataSource().setHierarchy(CurrentDimension, sel);

To trigger the action of ltering when a choice is selected from the dropdown, you need an onSelect script.

This script gets the selected value of the dropdown list and accordingly sets the hierarchy of the table and the chart while
referencing our script variable, CurrentDimension, so that the hierarchy displays only correctly ltered data.

9. In the Canvas, hover over Dropdown_Dimensionsand click . In the script editor insert this script as onSelect()
function:

 Sample Code

var sel = Dropdown_Dimensions.getSelectedKey();

// Table
Table.removeDimension(CurrentDimension);
Table.addDimensionToRows(sel);

//Chart
Chart.removeDimension(CurrentDimension, Feed.CategoryAxis);
Chart.addDimension(sel, Feed.CategoryAxis);

// write filter information into the browser console


console.log( ['CurrentDimension: ', CurrentDimension ]);
console.log( ['Selection: ', sel ]);

// save the current selection (dimension) into a global variable


CurrentDimension = sel;

// get hierarchies from the current dimension


var hierarchies = Table.getDataSource().getHierarchies(CurrentDimension);
var flag = true;

// remove all current items form the Dropdown_Hierarchies


Dropdown_Hierarchies.removeAllItems();

// loop
for (var i=0;i<hierarchies.length; i++){
if (hierarchies[i].id === '__FLAT__') {

Dropdown_Hierarchies.addItem(hierarchi es[i].id, 'Flat Presentation');


}
else {

Dropdown_Hierarchies.addItem(hierarchi es[i].id, hierarchies[i].description);


if (flag === true) {
var hierarchy = hierarchies[i].id;
flag = false;
}
}
}
// write hierarchy information to browser console
console.log( ['Hierarchy: ', hierarchy ]);

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 40/69
8/9/2020
console.log( ['Current Dimension: ', CurrentDimension ]);

// set Flat Hierarchie als Default


Dropdown_Hierarchies.setSelectedKey('__FLAT__');

// Table
Table.getDataSource().setHierarchy(CurrentDimension, '__FLAT__');

// Chart
Chart.getDataSource().setHierarchy(CurrentDimension, '__FLAT__');

This script gets the selected choice from the dimensions dropdown and saves it in a variable called sel.

You remove all dimensions from table and chart and set the selected dimension as the new dimension.

You remove all hierarchies from table and chart. You get those hierarchies that are available for the selected
dimension from the data and loop them over to the hierarchies dropdown list.

You set Flat Presentation as default hierarchy and lter table and chart with the selected dimension.

10. In the Layout panel hover over Canvas, click and select onInitialization. Insert the function:

 Sample Code
// get hierarchies from the current dimension
var hierarchies = Table.getDataSource().getHierarchies(CurrentDimension);
var flag = true;

// loop
for (var i=0;i<hierarchies.length; i++){
if (hierarchies[i].id === '__FLAT__') {

Dropdown_Hierarchies.addItem(hierarchi es[i].id, 'Flat Presentation');


}
else {

Dropdown_Hierarchies.addItem(hierarchi es[i].id, hierarchies[i].description);


if (flag === true) {
var hierarchy = hierarchies[i].id;
flag = false;
}
}
}
// write hierarchy information to browser console
console.log( ['Hierarchy: ', hierarchy ]);
console.log( ['Current Dimension: ', CurrentDimension ]);

// set Flat Hierarchie als Default


Dropdown_Hierarchies.setSelectedKey('__FL AT__');

//Table
Table.getDataSource().setHierarchy(CurrentDimension, '__FLAT__');

//Chart
Chart.getDataSource().setHierarchy(CurrentDimension, '__FLAT__');

In this use case, you want to make sure that on initialization you load all the available hierarchies of the dimensions and set
Flat Presentation as the default of the hierarchies dropdown list. The script for this is the same as a part of what happens
when a dimension is chosen.

11. Save the application and click Run Analytic Application.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 41/69
8/9/2020

Results
When you run the application, it looks like this:

If you keep the dimension on Location but change the hierarchy to States, the table would change to display the location
according to the states you have.

If you change the dimension to Product and set the hierarchy to Category, you will see the different categories of products
displayed.

Working with the Data Analyzer


The data analyzer is a prede ned ready-to-run service for SAP BW queries. It uses SAP BW live connections created in SAP
Analytics Cloud. All SAP BW queries can be accessed directly in theSelect Data Source dialog and no additional model is created.

The data analyzer contains a table that is displayed in full screen, a lter area, and a builder panel with navigation capabilities to
add and remove dimensions and measures from the table. In addition, you nd a menu bar with a Refresh possibility and an Edit
Prompts dialog (in case your data source is designed for setting prompts).

 Note
Before you can work with the data analyzer, you need to have the corresponding permission. Many standard application roles
already include the permission to work with the data analyzer. For further information, contact your application designer and
see Granting Permissions for the Data Analyzer.

How to Open the Data Analyzer


You can open the data analyzer in one of the following ways:

You can open the data analyzer via the following URL: http://<HOST>:<PORT>/sap/fpa/ui/app.html?
tenant=<TENANT_NAME>#;view_id=dataAnalyzer;. The Select Data Source dialog opens where you can
choose a SAP BW connection and a data source.

You can open the data analyzer directly via URL parameters that specify the SAP BW connection and the query. For
parametrization, please specify the following parameters:

connection

dataSourceName

 Example
http://<HOST>:<PORT>/sap/fpa/ui/app.html?tenant=<TENANT_NAME>#;view_id=dataAnalyzer;

 Note
It is important that you use dataAnalyzer for view_id:: view_id=dataAnalyzer.

You can open the data analyzer by creating an analytic application with the following script in the onInitialization
event handler of your application: NavigationUtils.openDataAnalyzer(undefined, undefined,
undefined, false);
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 42/69
8/9/2020
We also deliver a sample application that launches the data analyzer. To open this sample application, you have rst to
import it:

1. In the main menu of SAP Analytics Cloud, choose Browse Files Content Network Samples .

2. Click the folder SAP Analytic Cloud, Analytic Designer Sample Content to import this content.

3. After the import, go to Browse My Files Public Analytic Designer .

4. Click the folder Analytic Designer - Data Analyzer.

5. Click Analytic Designer - Launch Data Analyzer to open the data analyzer.

 Note
You can work with only a single SAP BW data source in the data analyzer.

Using the Builder Panel


The Builder panel is displayed at the right side of the application. Here you can see the data source of the application and change
it if needed. Under Rows and Columns, you see all measures and dimensions that are displayed in the table.

 Note
In SAP BW, measures are referred to as key gures and dimensions as characteristics.

For the Rows and Columns, you are offered a context menu that you can open by clicking ( More). Here you can use the
following functions:

By clicking Swap Axes, you can exchange rows and columns.

By clicking Arrange Totals/Parent Nodes Below, you can set the display of the totals or parent nodes below or above.

By clicking Compact Display, you can show multiple dimensions in the drill down as hierarchy.

By clicking Suppress Zeros, you can suppress zeros in rows and/or columns.

In the Available Items area that is displayed on the left hand side of the navigation panel by default, you can see all available items
for the query. Here you can select dimensions and measures and assign them directly to the table's rows or columns by clicking
or . To close the available items area, click the button.

You can also drag and drop dimensions from the Available Items panel into the Builder panel.

In the Available Items panel, you can also search for items. Additionally, in the upper right corner of the Available Items area, you
can change the items' display between ID and Description as well as their sort order.

You can resize the width of the left side panel for Available Items. This way you can display long dimension names.

Using the Table's Context Menu

Setting Filters
If you want to set lters, click to display the lter line and click beneath the menu bar to choose one of the items. To
collapse the lter line, click again . Depending on the amount mlters you have set, the number is displayed directly on the
symbol.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 43/69
8/9/2020

Setting Variable Prompts

 Note
In SAP BW, prompts are referred to as prompt variables.

If your data source is designed for setting variable prompts, click Edit Prompts in the menu bar to set the variable prompts. When
you have set variable prompts, they are displayed in the Information menu under Variables.

Getting Information about the Data Source


In the Information popup window you can get some information about the query like Query name, the Info Provider name and the
date of the Last Data Update. Next to Last Data Update you can click the Refresh button to refresh the data. After the refresh the
time stamp changes according to the last data update.

Using Custom Widgets


With custom widgets you can complement the standard palette of widgets in SAP Analytics Cloud, analytics designer according to
your needs.

 Note
Please note that custom widgets work in the Chrome browser only.

Also note that custom widgets can’t be exported and imported across different SAP Analytics Cloud systems.

Using Custom Widgets

Create, Import, and Use Custom Widgets More Information

As a developer, you can build your own widgets in addition to the SAP Analytics Cloud Custom Widget Developer Guide
widgets delivered with SAP Analytics Cloud, analytics designer.

Before you can add your custom widgets to your analytic Adding the Custom Widget to Analytics Designer
applications, you need to import them to the analytics designer.

Adding the Custom Widget to Analytics


Designer
To add the custom widget to analytics designer, follow these steps:

Prerequisites
Please note that you need the appropriate permission to create and upload custom widgets. For more information, please see
Granting Permissions for Custom Widgets. For more information, please see chapter “Granting Permissions for Custom Widgets”
in SAP Analytics Cloud help on SAP Help Portal at http://help.sap.com.

Procedure
1. In analytics designer, navigate toMain Menu Browse Custom Widgets .

2. Click the Create toolbar icon ( ).

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 44/69
8/9/2020
3. In the Upload File dialog, click the Select File button.

4. Select the custom widget JSON le box.json.

5. Create a new analytic application. The custom widget is listed in the widget list of the dropdown menu of the Add menu (
)

Next Steps
You can add multiple major versions of a custom widget to analytics designer.

Every custom widget has a version number in the format majorVersion.minorVersion.patchVersion, for example,
1.0.0. You can add custom widgets with different major versions side-by-side to analytics designer, for example, versions 1.0.0
and 2.0.0 of a custom widget.

When you add a custom widget that differs in the minor version with one present in analytics designer, then the added version
replaces the present version. For example, if a custom widget of version 1.5.0 is present in analytics designer, then adding either
version 1.4.0 or 1.6.0 replaces version 1.5.0.

References between Application and


Custom Widgets
Exported archives of analytic applications, by default, contain all referenced custom widgets.

If you use a custom widget in an application, and the application is transported between different SAP Analytics Cloud systems,
the application archive automatically includes the referenced custom widgets (like it works for models as well). This way only one
archive needs to be imported in the target system to get the application up and running.

Knowing the dependencies between an application and used custom widgets makes it possible to show you which applications are
actively using a custom widget when you try to delete it from an SAP Analytics Cloud system. The Delete Custom Widgets dialog
lists all referencing applications, and displays a warning that deleting the custom widget will break those applications.

 Example
In the following example, the rst custom widget is used by one application named Ticker Test, the second custom widget is
not used, and the third one is used in two applications for which the user has no authorization.

 Note
If you choose to ignore the warning and delete the custom widget despite of active usages, and you later realize that this was a
mistake and re-upload the custom widget, the references between applications and this custom widget will stay lost.

This means that the export and the display of the active usages in the dialog will not work anymore. In this case, a warning will
be displayed when you open an affected application:

Simply saving the application will repair the dependencies and the warning will no longer be displayed.

Analytics Designer API Reference


https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 45/69
8/9/2020
With SAP Analytics Cloud, analytics designer you can create interactive and highly custom-de ned analytic applications.

To enable interactivity, you write scripts that are executed when the user performs an action in the application. For example, you
can place the button widget in the application and assign a script to the button’s onClick event.

Scripts consist of one or more statements written in a JavaScript-based language that follow a speci c syntax. You use the script
editor to write scripts in analytic applications.

All objects, elds, and functions available are listed in the Analytics Designer API reference that you can nd on the SAP Help
Portal at Analytics Designer API Reference.

Widget Reference
You can use various widgets in analytics designer, including table, image, text, dropdown, checkbox group, radio button group, and
button.

All widgets used in the analytics designer and their properties are described here. For widgets that are used both in stories and
analytic applications, only the properties speci c for the analytics designer are given.

Chart

Table

Image

Shape

Symbol

Clock

Text

Button

Dropdown

Checkbox Group

Radio Button Group

Filter Line

Input Field

Slider and Range Slider

RSS Reader

Geo Map

Web Page

R Visualization

Data Action Trigger

BPC Planning Sequence

Panel

Tab Strip
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 46/69
8/9/2020

Chart
Add charts to an application to present data in a graphical way. Charts can emphasize irregularities or trends in data, and help you
focus your business analysis on those areas.

The chart widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of a table. If you do


not enter a name, the system takes the
default name (for example Chart_1).

To make it possible to create a new story for the chart directly from the chart widget, select the option Create Story from Widget
in the section Quick Menus of the chart widget's Styling panel. When you run the analytic application, you'll be able to select the
icon next to the chart and choose Create a New Story.

Smart Grouping
Smart Grouping is available for both the Bubble and Scatterplot chart types when using a Correlation analysis. Use Smart
Grouping to automatically analyze the data points in your chart and group them based on similar properties.

After enabling smart grouping for a chart, you as an application designer can leverage the APIs provided to let end users
customize the number of groups and group labels. The end users can also decide whether to make smart grouping visible or to
include tooltip measures. For example:

 Sample Code
Chart_1.getSmartGrouping().setNumberOfGroups(5);

For more detailed information about the API, refer to Analytics Designer API Reference in the SAP Help Portal.

Table
The table displays data in a grid with analytic functions.

The table widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of a table. If you do


not enter a name, the system takes the
default name (for example Table_1).

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 47/69
8/9/2020

Property Property Value Property Description

(Beta) Disable Initial Load (Beta) Speci es whether the data source is
automatically loaded when the application is
started.

You use this property to reduce the startup


time of the application. To load the data at a
later point in time, call the script
getDataSource().load() inside an
event handler, like the onClick event
handler of the button widget.

To make it possible to create a new story for the table directly from the table widget, select the option Create Story from Widget
in the section Quick Menus of the table widget's Styling panel. When you run the analytic application, you'll be able to select the
icon next to the table and choose Create a New Story.

Image
Using the image widget, you can enhance analytic applications by adding images with hyperlinks.

The image widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of an image. If you


do not enter a name, the system takes the
default name (for example Image_1).

Besides adding a hyperlink to an image in the same way as you do in a story, you can call the hyperlink API in your scripts to
customize more scenarios. If you set different hyperlinks for an image in both ways above, the hyperlink de ned via API has higher
precedence. And noted that different from hyperlinks added in a story, hyperlinks de ned in your scripts only support external
URLs and will always be opened in a new tab.

More detailed information about the API is available in SAP Help Portal at Analytics Designer API Reference.

Shape
Using the shape widget, you can enhance analytic applications by adding shapes with hyperlinks.

The shape widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of a shape. If you


do not enter a name, the system takes the
default name (for example Shape_1).

Besides adding a hyperlink to a shape in the same way as you do in a story, you can call the hyperlink API in your scripts to
customize more scenarios. If you set different hyperlinks for a shape in both ways above, the hyperlink de ned via API has higher
precedence. And noted that different from hyperlinks added in a story, hyperlinks de ned in your scripts only support external
URLs and will always be opened in a new tab.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 48/69
8/9/2020
More detailed information about the API is available in SAP Help Portal at Analytics Designer API Reference.

Symbol
Provide a way for application designer to easily add special characters or symbols into text.

You can insert symbols in different kinds of texts in Analytic Application including but not limited to:

text widget

Chart/Table title

Names of reference line

Other places in Builder Panel

Clock
Using the clock widget, you can enhance analytic applications by displaying the system date.

The clock widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of a clock. If you


do not enter a name, the system takes the
default name (for example Clock_1).

Text
You use the text widget to add user-de ned text to your analytic application. By setting the relevant properties, you can change the
style and size of the text.

The text widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are listed
here.

Property Property Value Property Description

Name String De nes the unique name of a text. If you do


not enter a name, the system takes the
default name (for example Text_1).

De ne Script Variables as a Source of Dynamic Text

As in a story, you can add dynamic text to a text widget to automatically update the text based on the values from the source input
control or lter. In addition, the application designer can also de ne a script variable as the source of dynamic text.

Follow the steps below to de ne script variables for a dynamic text:

1. Select a text widget in your analytic application.

2. From the More Actions menu, select Dynamic Text.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 49/69
8/9/2020
3. In the Insert Dynamic Text dialog, choose Script Variables from the left-side panel and select the checkbox for the
variables you want to use as the source for your dynamic text.

 Note
Only variables of string, number, or integer types can be used. Variables set as array are not supported.

4. After you complete the script and run the analytic application, the global variables will change according to the customized
scripts and their values are automatically updated in the text widget.

Text Area
With a text area widget, analytic application users can enter multiple lines of text or comments and descriptions retrieved from
other widgets.

Analytic application users can use both the text area and the input eld to enter text. The difference between them is that the
input eld displays content only in one line while the text area can automatically wrap lines according to the size of the widget. The
maximum text length of a text area widget is 1000 characters.

The text area widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a text area. If


you do not enter a name, the system takes
the default name (for example TextArea_1).

Display Hint toggle, string If you disable this option, no hint will be
displayed either in the analytic application
design time or at runtime. After enabling
this option and entering a hint, when
application users later start to enter a value
in the text box during the analytic
application runtime, the hint will be
overwritten by the user-entered text
automatically.

Text Area Style Properties

Property Property Value Property Description

Border Color Speci es the border color of the text area.

Background Color Speci es the background color of the text


area.

After adding a text area widget to the canvas or popup, as an application designer you can write scripts to change the text area,
such as set it to editable or not editable.

More detailed information about the API is available in SAP Help Portal at Analytics Designer API Reference.

Input Field
With input elds, analytic application users can enter a random value and trigger what-if scenarios based on the value entered.

The input eld widget has the following speci c properties:


https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 50/69
8/9/2020

Property Property Value Property Description

Name String De nes the unique name of a input eld. If


you do not enter a name, the system takes
the default name (for example InputField_1).

Input Field Style Properties

Property Property Value Property Description

Display Hint toggle, string If you disable this option, no hint will be
displayed either in the analytic application
design time or at runtime. After enabling
this option and entering a hint, when
application users later start to enter a value
in the text box during the analytic
application runtime, the hint will be
overwritten by the user-entered text
automatically.

Border color Speci es the border color of the input eld


box.

Background color Speci es the background color of the input


eld box.

Related Information
Creating and Using the Input Field

Button
Button widgets let the application user interact with the analytic application.

The button widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a button. If you


do not enter a name, the system takes the
default name (for example Button_1).

Text String Speci es the text for the button.

Tooltip String Speci es the tooltip for the button.

Button Styles

We provide some prede ned button styles for you to choose from:

Standard Button

Lite Button

Emphasized Button

Positive (Accept) Button

Negative (Reject) Button

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 51/69
8/9/2020
These styles bring default border and background colors for different states including Default, Mouse Hover and Mouse Down.
Based on the default settings, you can further customize colors of your buttons in different states.

After specifying the colors, you can choose to upload an icon and decide whether to show or hide the icon in the button. The size
of the uploaded icon will be automatically adjusted to adapt to the size of the button.

The icon can be placed either to the left or right of the text in the button. Both the icon and text will be center aligned.

Dropdown
Dropdown widgets let the application user select items, for example to set a lter. To enable user interaction, you need to add a
script to the onSelect event of the dropdown. The script is triggered when the application user selects an item in the dropdown
widget.

The dropdown widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a dropdown. If


you do not enter a name, the system takes
the default name (for example Dropdown_1).

Tooltip String Speci es the tooltip text.

Dropdown Style Properties

Property Property Value Property Description

Border color Speci es the border color of the dropdown.

Background color Speci es the background color of the


dropdown.

Dropdown Menu Style Properties

Property Property Value Property Description

Selected color Speci es the color of the selected options in


the dropdown list.

Hover color Speci es the color of the options in the


dropdown list when mouse hovers.

Down color Speci es the color of the options in the


dropdown list when clicking and choosing it
with the mouse.

Dropdown Properties Located in the Builder Panel

Property Property Value Property Description

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 52/69
8/9/2020

Property Property Value Property Description

Value list of values With the value property, you can add values,
change the order of values, or remove them.
Each value has the following properties:

value

text (optional)

If you enter a text for a value, the


text is displayed. If no text is
entered, the value is displayed.

If you want a speci c value to be displayed


by default, select the relevant value and
mark it as Default. This is shown as the
default entry in the dropdown.

Checkbox Group
The checkbox group widget displays several checkboxes, each for one item.

The checkbox group widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a checkbox


group. If you do not enter a name, the
system takes the default name (for example
CheckboxGroup_1).

Display Option Vertical Option, Horizontal Option Speci es the display options.

Label Text on, off, String If checked, you can enter a label text for the
widget.

Checkbox Style Properties

Property Property Value Property Description

Border color Speci es the border color.

Background color Speci es the background color.

Check Mark color Speci es the check mark color.

Checkbox Group Properties Located in the Builder Panel

Property Property Value Property Description

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 53/69
8/9/2020

Property Property Value Property Description

Value list of values With the value property, you can add values,
change the order of values, or remove them.
Each value has the following properties:

value

text (optional)

If you enter a text for a value, the


text is displayed. If no text is
entered, the value is displayed.

If you want a speci c value to be displayed


by default, select the relevant value and
mark it as Default. This is shown as the
default in the chekkbox group.

Radio Button Group


Radio button groups let the application user select items, for example to set a lter.

The radio button group widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a radio button


group. If you do not enter a name, the
system takes the default name (for example
RadioButtonGroup_1).

Display Option Vertical Option, Horizontal Option Speci es the display options.

Label Text on, off, String If checked, you can enter a label text for the
widget.

Radio Button Group Style Properties

Property Property Value Property Description

Border color Speci es the border color.

Background color Speci es the background color.

Check Mark color Speci es the check mark color.

Radio Button Group Properties Located in the Builder Panel

Property Property Value Property Description

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 54/69
8/9/2020

Property Property Value Property Description

Value list of values With the value property, you can add values,
change the order of values, or remove them.
Each value has the following properties:

value

text (optional)

If you enter a text for a value, the


text is displayed. If no text is
entered, the value is displayed.

If you want a speci c value to be displayed


by default, select the relevant value and
mark it as Default. This is shown as the
default in the radio button group.

Filter Line
The lter line is a widget that lets you lter on data-bound widgets such as tables, charts and R visualization.

The lter line widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of an image. If you


do not enter a name, the system takes the
default name (for example FilterLine_1).

Filter Line Style Properties

Property Property Value Property Description

Border color Speci es the border color of dimensions


added to the lter line.

Background color Speci es the background color of both


dimensions added to the lter line and the
drop-down menu available when you add
lters.

Filter Menu Styling Properties

Property Property Value Property Description

Hover color When adding lters, speci es the color of


the drop-down menu items on mouse hover.

Down color When adding lters, speci es the color of


the drop-down menu item when you click
the mouse and choose it.

Font size, color Speci es the font size and color of the
options in the drop-down menu when
adding lters.

Filter Line Properties Located in the Builder Panel

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 55/69
8/9/2020

Property Property Value Property Description

Source Widget source widget Speci es the source widget that provides
the data for ltering.

Dimension Selection dimensions Speci es the dimensions for ltering


depending on the source widget.

Related Information
Using the Filter Line

Slider and Range Slider


With a slider or range slider, analytic application users can input and change values dynamically and trigger what-if scenarios
based on the value.

The difference between a slider and range slider is that a slider de nes a single value while a range slider de nes a speci c range
of data. They have the following speci c properties:

Common Property

Property Property Value Property Description

Name String De nes the unique name of a slider. If you


do not enter a name, the system takes the
default name (for example Slider_1 and
RangeSlider_1).

Slider Style Properties

Property Property Value Property Description

Progress Bar color Speci es the color of the progress bar.

Background Bar color Speci es the color of the background bar


(the remaining part other than the progress
bar).

Number Format – Scale unit Specify the scale and scale format of all
numbers in the slider.

Number Format – Decimal Places number Specify the decimal places of all numbers in
the slider.

Slider Properties Located in the Builder Panel

Property Property Value Property Description

Slider Values number Enter a number for the Min Value and Max Value.

For a slider, enter a default Current Value between the


min and max value.

For a range slider, enter a number for the Start Value and
End Value. Both values should be between min and max
value.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 56/69
8/9/2020

Property Property Value Property Description

Options for the Slider Values checkbox


To display the min and max values in the slider,
choose the option Display Min & Max Value
Labels.

To display the current value in a slider or the start


and end values in a range slider, choose the option
Display Current Value Labels.

To allow end users to directly enter the default


value or the start and end value instead of sliding
the bar when running the analytic application,
choose the option Enable Value Input.

To increase or decrease the default value or the


start and end value by a xed number each step,
choose the option Enable Step Selection and
enter a positive value for the Step Size.

 Note
The difference between current value/max value/end
value/start value and min value should be divisible by
the step value.

After adding the slider or range slider widget to the canvas or popup, as an application designer you can write scripts to receive
the number input by the end user for further processing using the following APIs:

 Code Syntax
// Get/set the value of a slider
getValue(): number
setValue(value: number): void

// Get/set the range of a range slider


getRange(): Range
setRange(range: Range): void

// Get/set the minimum value of a slider/range slider


getMinValue(): number
setMinValue(value: number): void

// Get/set the maximum value of a slider/range slider


getMaxValue(): number
setMaxValue(value: number): void

// Get/set the visibility of a slider/range slider


setVisible(value: boolean): void
isVisible(): boolean

// Event - It's triggered when an end user finishes the interaction and releases the handler of the
onChange()

//Allow end users to trigger the creation of a range slider with a predefined start and end value.
Range.create(start: number, end: number): Range

RSS Reader
Add an RSS Reader to your analytic application to present relevant articles from an RSS feed alongside your data and
visualizations.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 57/69
8/9/2020
The RSS reader widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are
listed here.

Property Property Value Property Description

Name String De nes the unique name of a RSS reader. If


you do not enter a name, the system takes
the default name (for example
RssReader_1).

You can leverage the open APIs to dynamically update the list of RSS feeds according to your actions—for example, to show blogs
relevant to your area of interest. For detailed information about all available open APIs, refer to Analytics Designer API Reference.

Geo Map
Using the geo map widget, you can overlay multiple layers of business data on geo map with detailed geographic information to
perform analyzes on your geographic data.

The geo map widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are
listed here.

Property Property Value Property Description

Name String De nes the unique name of a geo map. If


you do not enter a name, the system takes
the default name (for example GeoMap_1).

Quick Menus Properties


The toggle Visible in Runtime controls in general whether all the quick menu items are visible or not when you run an analytic application. After
enabling this option, you can use the checkbox to define whether each of the properties below is visible or not.

Property Property Value Property Description

Drill Checkbox Enabled by default. Allows application users


to lter selected data points.

Full Screen Checkbox Enabled by default. Allows application users


to display a widget in full screen.

Create Story from Widget Checkbox Not enabled by default. If you enable the
option as an application designer, the option
will be available when application users click
the icon next to the widget, which allows
them to create a new story from the geo
map.

Filter/Exclude Checkbox Enabled by default. Allows application users


to exclude selected data from lters.

After adding a geo map widget to the canvas or popup, as an application designer you can write scripts to trigger changes to
different layers of the geo map. For example:

 Sample Code
//click the button to set the bottom layer of the geo map to invisible
GeoMap_1.getLayer(0).setVisible(false);

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 58/69
8/9/2020
For more detailed information about the geo map APIs, refer to Analytics Designer API Reference in the SAP Help Portal.

Web Page
Using the web page widget, you can embed a web page into your story to combine your analytics with additional live, hosted
content.

The web page widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer are
listed here.

Property Property Value Property Description

Name String De nes the unique name of a web page. If


you do not enter a name, the system takes
the default name (for example Webpage_1).

R Visualization
You use the R visualization widget to create and edit visualizations based on R scripts. By setting the relevant properties, you can
change the size and style of the widget.

The R visualization widget is used in both stories and analytic applications. Only the properties speci c for the analytics designer
are listed here.

Property Property Value Property Description

Name String De nes the unique name of an R


visualization. If you do not enter a name, the
system takes the default name (for example
RVisualization_1).

Quick Menus Properties


The toggle Visible in Runtime controls in general whether all the quick menu items are visible or not when you run an analytic application. After
enabling this option, you can use the checkbox to define whether each of the properties below is visible or not.

Property Property Value Property Description

Full Screen Checkbox Enabled by default. Allows application users


to display a widget in full screen.

Create Story from Widget Checkbox Not enabled by default. If you enable the
option as an application designer, the option
will be available when application users click
the icon next to the widget, which allows
them to create a new story from the R
visualization.

 Note
R visualization widget of HTML content is not supported in Safari on Mac when third party cookie is not allowed in Safari.

After adding an R script and displaying the running result as visualization on the main canvas, you can write scripts, for example,
to customize the local data source, set input parameters as numbers or strings, get input parameter as numbers or strings and
check if there's any error when executing R scripts. More detailed information about the API is available in SAP Help Portal at
Analytics Designer API Reference.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 59/69
8/9/2020

Data Action Trigger


You can use the data action trigger from the Insert section of the toolbar to automate planning functions for locale planning
connections.

The data action trigger is used in both stories and analytic applications. Only the properties speci c for analytics designer are
listed here.

 Note
The Data Action Trigger is deactivated at design time.

Property Property Value Property Description

Name String De nes the unique name of a data action


trigger. If you do not enter a name, the
system takes the default name (for example
DataActionTrigger_1).

BPC Planning Sequence


You can use the BPC Planning Sequence widget to run planning sequences for BPC live data connection models.

The BPC Planning Sequence is used in both stories and analytic applications. Only the properties speci c for analytics designer
are listed here.

 Note
The BPC Planning Sequence is deactivated at design time.

Property Property Value Property Description

Name String De nes the unique name of a BPC planning


sequence. If you do not enter a name, the
system takes the default name (for example
BPCplanningSequence_1).

Panel
As an application designer, you can use a panel as a container to group any type of widgets together, so that when a panel is
moved, copied, deleted, shown, or hidden, all the widgets in the panel will follow it. In addition, you can nest a panel inside another
panel.

The panel widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a panel. If you


do not enter a name, the system takes the
default name (for example Panel_1).

Panel Style

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 60/69
8/9/2020

Property Property Value Property Description

Horizontal Scroll Dropdown Controls whether the horizontal scroll bar


will automatically appear or not when the
contents in the panel exceed the width of
the panel.

Vertical Scroll Dropdown Controls whether the vertical scroll bar will
automatically appear or not when the
contents in the panel exceed the height of
the panel.

You can add widgets to a panel by dragging and dropping them to the panel in the Canvas or under the panel in the Outline.

To allow application users to show or hide a panel, you can leverage the script APIs isVisible() and setVisible(). For
detailed information, refer to Analytics Designer API Reference.

Tab Strip
A tab strip widget is a container made up of multiple tabs that enables you to group widgets tab by tab.

A tab strip has two tabs by default. As an application designer, you can add more tabs to a tab strip and insert any widgets into
different tabs according to your needs. When you move, copy, delete, show, or hide a tab strip, all the tabs and widgets in the tab
strip will change accordingly.

The tab strip widget has the following speci c properties:

Property Property Value Property Description

Name String De nes the unique name of a tab strip. If


you do not enter a name, the system takes
the default name (for example TabStrip_1).

Tab Strip Style Properties

Property Property Value Property Description

Selected Color Speci es the color of the selected tab text in


the tab strip.

Header Background Color Speci es the color of the header


background.

After adding a tab strip widget to the canvas or popup, as an application designer you can write scripts to set the tab's text or
acquire the tab's key or text. For example:

 Sample Code
// Returns the key of the selected tab and adds it to Dropdown_1.
var selectedTabKey = TabStrip_1.getSelectedKey();
Dropdown_1.addItem(selectedTabKey);
// Returns the key of the specified tab Tab_1 and adds it to Dropdown_1.
var tabKey = TabStrip_1.getTab(“Tab_1”).getKey();
Dropdown_1.addItem(tabKey);

// Change the text of the specified tab Tab_1 to "New Text".


TabStrip_1.getTab(“Tab_1”).setText("New Text");

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 61/69
8/9/2020
For more information about the tab strip APIs, refer to Analytics Designer API Reference.

Permissions and Roles


Provides details about the permissions and roles for working with analytic applications.

Related Information
Granting Permissions for Analytic Applications
Granting Permissions for Analytic Applications in Roles
Granting Permissions for the Data Analyzer

Granting Permissions for Analytic


Applications
As the owner of the analytic applications you created, you can share individual analytic applications with other users and grant
permissions for these applications.

Context

 Note
Note that the users with whom you want to share the analytic applications need to have roles with corresponding permissions
assigned to them.

 Example
If you grant update access for an individual analytic application to a user whose assigned role does not have update access to
analytic applications in general, the user will not be able to change the analytic application you shared.

Procedure
1. From the Main Menu, select Browse Files .

2. Select the analytic application you want to share and select Manage Sharing Settings... .

3. Select permissions for All Users, or for individual users or user groups under User/Team.

Option Description

Full Access Users can view, change, and delete the shared analytic
applications.

Read Access Users can view the shared analytic applications and navigate
the data.

Update Access Users can change the shared analytic applications.

Delete Access Users can delete the shared analytic applications.

4. (Optional) Select Add Users and Teams, and choose individual teams or users from the list, then assign permissions to
teams or users.

5. Select Save.
https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 62/69
8/9/2020

Related Information
Granting Permissions for Analytic Applications in Roles

Granting Permissions for Analytic


Applications in Roles
You can grant permissions for working with analytic applications in your users' roles.

Prerequisites
Make sure you have the rights to edit roles in SAP Analytics Cloud.

Context
The following standard application roles delivered with SAP Analytics Cloud include tasks related to the analytics designer:

Role Description

System Owner Includes all authorizations that are required to create, view, update
or delete analytic applications.
Admin

BI Admin

Application Creator

BI Content Creator Includes all authorizations that are required to view analytic
applications.
BI Content Viewer

Viewer

Modeler

Planner Reporter

 Note
Application designers are usually assigned to the Application Creator role. If they need to create planning models for their
planning applications, they need the Modeler role in addition to the Application Creator role.

In addition, you can enhance other roles with permissions for working with analytic applications.

Procedure
1. From the Main Menu, select Security Roles .

2. Select the role you want to enhance with the analytics designer capability, or create a new role by clicking (Add Role).

3. Under Permissions, go to the Analytic Applications row and select the required permissions for this role.

Option Description

Create Users assigned to this role can create analytic applications.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 63/69
8/9/2020

Option Description

Read Users assigned to this role can view analytic applications and
navigate the data.

Update Users assigned to this role can change analytic applications.

Delete Users assigned to this role can delete analytic applications.

Note that when you remove the Read permission you also remove the Update and Delete permissions.

4. Select (Save).

Results
Depending on the permissions you have granted them regarding the analytics designer, users assigned to the role do or do not
have access to certain features of the analytics designer.

 Example
Role without When opening an analytic application, the analytic application is displayed in view mode. The system does not
update display the menu bar and the outline view that make it possible to change the analytic application.
permission

Role without Under Main Menu Create , the option Analytic Application is not available.
create
permission Under Main Menu Browse Files Create , the option Analytic Application is not available.

Related Information
Creating Custom Roles
Assigning Roles to Users and Teams
Standard Application Roles

Bookmarks Roles and Permissions


To create and manage a bookmark, you must have the appropriate permissions for this analytic application item. Many standard
application roles already include the permissions to work with bookmarks.

Bookmark related permissions include:

Permission Description

Create To create and save bookmarks.

Read To view bookmarks in the Files repository or directly in your analytic


application by leveraging the API getAll () or
getAppliedBookmark ().

Update To edit bookmarks in the Files repository. At least Read permission


should be granted as well.

Delete To delete bookmarks in the Files repository. At least Read


permission should be granted as well.

Share To share personal bookmarks to others in the Files repository. At


least Read permission should be granted as well.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 64/69
8/9/2020
In general, all standard application roles delivered with SAP Analytics Cloud by default have the Read permission enabled.

In addition to that, the following standard application roles by default contain full permission to read, create, update, delete and
share a bookmark:

Application Creator

BI Admin

BI Content Creator

Admin

To view or edit analytic bookmarks permissions for a role, follow the steps below:

1. From the Main Menu, select Security Roles .

2. Select the role whose bookmark permission you want to modify, or create a new role by clicking (Add Role).

3. Go to the Application Bookmark row and select any permissions you want to add or remove.

4. Select (Save).

Related Information
Creating Custom Roles
Assigning Roles to Users and Teams
Standard Application Roles

Granting Permissions for the Data


Analyzer
Before your users can work with the data analyzer, you need to grant them the corresponding permission. Many standard
application roles already include the permission to work with the data analyzer.

Prerequisites
Make sure you have the rights to edit roles in SAP Analytics Cloud.

Context
The following standard application roles delivered with SAP Analytics Cloud include the permission to work with the data analyzer:

Admin

BI Admin

Application Creator

BI Content Creator

BI Content Viewer

Viewer

Modeler

Planner Reporter

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 65/69
8/9/2020
In addition, you can enhance other roles with the permission for working with the data analyzer.

Procedure
1. From the Main Menu, select Security Roles .

2. Select the role you want to enhance with the data analyzer permission, or create a new role by clicking (Add Role).

3. Under Permissions, go to the Data Analyzer row and select Execute.

4. Select (Save).

Related Information
Creating Custom Roles
Assigning Roles to Users and Teams
Standard Application Roles

Granting Permissions for Custom Widgets


You can grant permissions for working with custom widgets in your users' roles.

Prerequisites
Make sure you have the rights to edit roles in SAP Analytics Cloud.

Context
The following standard application roles delivered with SAP Analytics Cloud include tasks related to custom widgets:

Role Description

System Owner Includes all authorizations that are required to create, view, update
or delete custom widgets.
Administrator

BI Administrator Includes all authorizations that are required to view custom widgets.

BI Content Creator

BI Content Viewer

Application Creator

Viewer

Modeler

Planner Reporter

In addition, you can enhance other roles with permissions for working with custom widgets.

Procedure
1. From the Main Menu, select Security Roles .

2. Select the role you want to enhance with the analytics designer capability or create a new role by clicking (Add Role).

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 66/69
8/9/2020
3. Under Permissions, go to the Custom Widget row and select the required permissions for this role.

Option Description

Create Users assigned to this role can create (upload) custom widgets.

Read Users assigned to this role can use custom widgets in the
analytic application.

Update Users assigned to this role can replace uploaded custom


widgets.

Delete Users assigned to this role can delete custom widgets.

 Note
Note that when you remove the Read permission you also remove the Update and Delete permissions.

4. Select (Save).

Results
This task sets the permissions for all custom widgets. It is also possible to set the Read, Update, and Delete permission for each
custom widget individually by expanding the Custom Widget row.

 Caution
Be careful to whom you assign the Upload permission, because uploading custom widgets is functionally equivalent to a
software update (of custom widgets).

Known Limitations to Analytics Designer


Certain limitations apply when you create analytic applications.

No value help when creating popups


There is no value help for script methods within popups that refer to data-bound widgets outside the popup.

Popups larger than the main canvas are not supported


A popup whose size is larger than the main canvas will not display correctly. Therefore, we recommend you not to place that big a
popup on the canvas.

Need to add at least two widgets to a popup to run the popup as designed
We recommend you add at least two widgets to a popup as widgets are the visualization of the popup. If no widgets are added, you
won't see the popup displayed when you trigger it while running the analytic application. If only one widget is added, the height
and width you set for the popup won't take effect.

When a table or chart in the canvas acts as the source widget of a lter line widget
in a popup, source widget cannot nd the lter line as its reference after reloading
the analytic application

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 67/69
8/9/2020
In the case when a table or chart in the canvas acts as the source widget of a lter line widget in a popup and you reopen or refresh
the analytic application, you will nd the lter line is not listed in the reference list of the table or chart widget after you choose
Find Reference. This is because currently we don't initiate the lter line widget in the popup when you reloading an analytic
application.

To solve this, for now we recommend you activate the popups by clicking on each of them. Then the reference list will display all
relevant results.

DataSource function setVariableValue not supported for Hierarchy Node


variables to Live Data Connections to SAP BW
The DataSource function setVariableValue is not supported for hierarchy node variables to live data connections to SAP BW.

DataSource function setVariableValue is not validating variable values


The DataSource function setVariableValue is not validating the values speci ed (neither at runtime nor at design time). All
values and value combinations which are accepted in the prompt dialog will be supported. All other combinations might lead to
errors or to an inconsistent state.

Styling panel cannot control whether the quick menu options of a chart widget is
visible or not in Explorer
In the Styling panel of a chart widget, the section Quick Menus controls whether the options in the chart's quick menu bar is
visible or not when running the analytic application. However currently if you set the options such as Filter/Exclude, Drill, Smart
Insight to invisible and run the analytic application, in Explorer of the chart you can still access these option.

Calling Version Management APIs is not supported for BPC writeback enabled
versions.
Calling the Version Management APIs is not supported for BPC writeback enabled versions. Please use the Version Management
panel and/or the Publish Data toolbar entry instead.

Calling the setTheme API in a popup does not affect the theme settings in the
popup
Now calling the setTheme API in a popup does not affect the theme settings in the popup. To solve this problem, you can add a
panel to a popup and include all widgets in it. Then when you trigger the set theme API in a popup, all widgets added to the panel
will apply the new theme settings.

Applying a new theme to an application without clicking the popups in the app will
result in the theme settings not applied to the popups
Sometimes when designing an application, if you apply a new theme to the application and directly run the application without
clicking to preview the popups, the new theme settings won't apply to the popups during the application run time.

To solve this, for now we recommend you activate the theme settings for the popups by clicking on each of them when designing
the application. Then the theme will be correctly applied to the popups.

Some theme settings of a table widget won't take effect once you have customized
styling options

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 68/69
8/9/2020
After you have modi ed styling options of a table widget or any contents in a table widget, the settings below won't take effect:

In the styling panel, choose Restore to Theme Preference and the table won't be restored to theme preference.

Set the theme of the table back to default theme and default theme won't be applied.

Custom widgets can’t be exported and imported across different SAP Analytics
Cloud systems
You can't export and import custom widgets across different SAP Analytics Cloud systems.

R visualizations of HTML content not supported in Safari on Mac when third party
cookie is not allowed
R visualization widgets of HTML content are not supported in Safari on Mac when third party cookie is not allowed in Safari.

Setting dimension lters to null not supported for SAP HANA data sources
Currently it is not possible to set a dimension lter to null for SAP HANA data sources.

https://help.sap.com/http.svc/dynamicpdfcontentpreview?deliverable_id=20087850&topics=5f78d999c9da4f75b903271683f… 69/69

You might also like