SAP 分析云提供了强大且丰富的图表样式和交互方式来满足用户对于数据可视化以及企业计划的需求。在实际应用中,我们的用户对图表的交互有时会有更定制化的需求,比如希望创建隐藏和显示图标的按钮。因此,SAP 分析云提供了脚本功能来进一步提高图表和交互的定制程度。
本系列文章将继续分享在 SAP 分析云中通过简单的脚本代码实现增强故事功能的实践经验,旨在帮助没有深厚编程背景的用户学习SAP分析云故事中的脚本编写。如果您对之前的文章感兴趣,请查看文章末尾的合集。
一、前言
本文通过 SAP分析云 的最新功能(如优化设计体验和脚本支持),从现有的故事入手,逐步添加小代码段来提升用户体验。 之前的文章中,我们分享了如何通过按钮在图表和表格之间切换显示,以及如何让用户在运行时动态添加或修改表格的维度和度量。现在,我们将讲解几个简单的脚本元素,帮助你提高故事的美观程度。
二、页面之间的导航、帮助页面等
我们可以利用 SAC 屏幕顶部的页面间导航功能,实现在不同页面间进行便捷跳转。为了进一步提升用户体验,我们可以考虑添加一个按钮,允许用户在访问特定页面后轻松返回原页面。
假设我们现在有一个包含四个页面的故事,其中前三页提供具体内容,而第四个页面则包含“关于”和“帮助”信息。我们的目标是在前三个页面上各设置一个按钮,用户可以通过点击这些按钮直接跳转到第四页,并在获取所需信息后,一键返回到他们之前所在的页面。这一功能的实现并不复杂。
具体来说,如果您当前位于第二页,并点击跳转到第四页,系统将记录您的起始页面,并在您完成帮助页面的浏览后,自动引导您返回第二页。同样,如果您从第一页跳转至帮助页面,点击返回按钮后,您将被带回第一页。这种方法适用于任何页面数量的故事。
接下来,我将介绍如何实现这一功能的代码。
首先,我们需要在大纲中定义一个脚本变量。我们将创建一个名为 What_Page 的字符串类型的脚本变量,并在大纲中为其默认值——即第一页的名称,“Page_1”。
现在我们已经拥有了一个用于记录当前所在页面的变量了,接下来我们编写代码以导航至帮助页面,并利用这个变量存储的位置返回到用户之前所在的页面。
接下来,我们需要在四个页面上各创建一个按钮。其中三个按钮将用于导航至帮助页面,而帮助页面上的按钮则将用户返回至他们之前访问的页面。
我们先从导航按钮开始。 将按钮添加到第一页,并附上以下脚本:
// 设置您当前所在的页面,然后跳转至帮助页面
What_Page = ‘Page_1’;
Application.setActivePage(‘Page_4’);
第二行代码将脚本变量 What_Page 设置为 ‘Page_1’,即我们当前所在的页面。第三行代码则指示 SAC 导航至 Page_4。Application.setActivePage() 函数用于将 SAC 跳转到括号中指定的页面。因此,我们首先将变量设置为当前位置,然后导航至帮助页面。
同理,在第二和第三个页面上重复上述步骤,记得将 What_Page 相应地设置为 ‘Page_2’ 和 ‘Page_3’。
最后,我们要为帮助页面的按钮添加以下脚本:
// 返回到之前的页面(存储在 What_Page 变量中)
Application.setActivePage(What_Page);
确实,这个过程非常简单——只需一行代码即可返回到 What_Page 变量中存储的页面。因此,如果您从 Page_2 来,您将被返回到 Page_2,以此类推。
最后一步是给按钮添加文本、工具提示等。
以上视频展示了我的开发流程。这仅是一个示范性的故事案例,旨在演示如何展示“帮助”/“关于”页面,并在使用后将用户引导回他们原先访问的页面。实际使用的过程,有待大家去探索和创新,以适应各自的具体需求和创意。以下动图展示了一个投入使用的 SAC 故事的示例:
三、使用下拉列表在页面之间进行导航
接下来,本文将介绍如何通过下拉列表实现页面间的便捷导航。通过在故事中集成下拉菜单,用户可以隐藏工具栏,从而去除许多不必要的选项。
这是一个示例故事,在故事的顶部,您可以看到故事标题、元数据、用户信息、时间、日期等,而当前页面则以橙色突出显示,作为导航至故事中其他页面的快捷方式。点击“下拉列表”,即可展开显示所有其他故事页面的列表:
在故事的顶部,我们可以看到故事标题、一些元数据、用户、时间、日期等,然后以橙色显示的当前页面,作为故事中所有其他页面的导航加倍。单击“下拉列表”,将显示所有其他故事页面的列表:
正如您所见,当您从下拉列表中选择其他某个页面时,显示值会自动更新,变回为当前的页面,紧接着您将被导航至选中的页面。
实现这一功能仅需编写三行简洁的脚本。我们将在故事的每个页面上重复执行类似的步骤:添加下拉菜单、配置选项、添加脚本。
首先,在第一页添加一个下拉菜单,然后在“生成器”面板中设置选项,使其与故事的每个页面相对应。以我们的示例为例,总共有四页,因此您需要在下拉列表中添加四个项目。您需要将标识符设置为每个页面的ID,并把文本描述配置为您希望显示的页面标题,具体如下所示:
如上所示,“故事大纲”中有 4 个页面,分别是:
Page_1:销售 Page_2:产品 Page_3:职员 Page_4:帮助
在下拉列表中,我们需要为每一页添加一个值行,并将下拉列表的默认值设置为当前页面。以本例中的Page_1为例,它被设置为默认值。但是,当复制到其他页面时,需要将默认值调整为Page_2、Page_3或Page_4。
在添加控件之后,我们需要为其编写脚本,以便用户能够导航到他们选择的页面。以下是实现此功能的代码:
// 获取用户选择的页面
// 重置过滤器显示(为下一次显示做准备)
// 最后导航到所选页面
What_Page = Dropdown_1.getSelectedKey();
Dropdown_1.setSelectedKey(‘Page_1’);
Application.setActivePage(What_Page);
可以看到,我们使用相同的脚本变量What_Page来保存用户通过下拉列表选择的值。在这个例子中,下拉列表被称为Dropdown_1,但您需要根据SAC为该对象分配的实际名称进行更改。
代码的第二行将下拉列表重置为其初始值Page_1,这样如果我们返回到这一页,下拉列表将正确显示我们当前所在的页面,而不是上次使用下拉列表时选择的页面。例如,当将此下拉菜单添加到Page_3时,代码如下:
What_Page = Dropdown_3.getSelectedKey();
Dropdown_3.setSelectedKey(‘Page_3’);
Application.setActivePage(What_Page);
代码的最后一行负责将故事导航到用户在下拉菜单中选择的项目。通过设置变量指向用户想去的页面,并重置下拉菜单,为下一次的导航做好准备。
对于第二页“Page_2”(以及所有其他页面),我们可以将下拉菜单从 Page_1 复制到 Page_2,并仅对下拉菜单进行一次更改——我们需要将默认值设置为 Page_2 而不是 Page_1:
唯一的不同是,每一页的下拉列表在 SAC 大纲中具有不同的名称,在本例中为 Dropdown_2 而不是 Dropdown_1。所以唯一的区别是,我们需要按如下方式修改此新对象中的脚本:
What_Page = Dropdown_2.getSelectedKey();
Dropdown_2.setSelectedKey(‘Page_2’);
Application.setActivePage(What_Page);
我们更改脚本第一行中下拉菜单的名称,以反映我们正在交互的对象(Dropdown_2),并且我们需要将这个新的下拉菜单重置为当前页面的默认值——在这个例子中是“Page_2”,而不是“Page_1″。
除了这两点,我们为每页编写的脚本都是一致的。现在,每个页面都配备了一个下拉列表,其默认值显示当前所在的页面,并允许用户导航至其他拥有相同控件的页面。
四、总结
本文主要介绍了在 SAC 故事中,通过编写脚本实现的两种页面间导航功能:跳转按钮和下拉列表。希望这些内容能在您创建交互式故事或教程时提供实用的指导。
祝编码愉快!
原作者:Daniel_Davis
原文链接:Start Your scripting Journey The Easy Way With SAP Analytics Cloud | Part Two
SAP 分析云提供了强大且丰富的图表样式和交互方式来满足用户对于数据可视化以及企业计划的需求。在实际应用中,我们的用户对图表的交互有时会有更定制化的需求,比如希望创建隐藏和显示图标的按钮。因此,SAP 分析云提供了脚本功能来进一步提高图表和交互的定制程度。 本系列文章将继续分享在 SAP 分析云中通过简单的脚本代码实现增强故事功能的实践经验,旨在帮助没有深厚编程背景的用户学习SAP分析云故事中的脚本编写。如果您对之前的文章感兴趣,请查看文章末尾的合集。 一、前言 本文通过 SAP分析云 的最新功能(如优化设计体验和脚本支持),从现有的故事入手,逐步添加小代码段来提升用户体验。 之前的文章中,我们分享了如何通过按钮在图表和表格之间切换显示,以及如何让用户在运行时动态添加或修改表格的维度和度量。现在,我们将讲解几个简单的脚本元素,帮助你提高故事的美观程度。 二、页面之间的导航、帮助页面等 我们可以利用 SAC 屏幕顶部的页面间导航功能,实现在不同页面间进行便捷跳转。为了进一步提升用户体验,我们可以考虑添加一个按钮,允许用户在访问特定页面后轻松返回原页面。 假设我们现在有一个包含四个页面的故事,其中前三页提供具体内容,而第四个页面则包含“关于”和“帮助”信息。我们的目标是在前三个页面上各设置一个按钮,用户可以通过点击这些按钮直接跳转到第四页,并在获取所需信息后,一键返回到他们之前所在的页面。这一功能的实现并不复杂。 具体来说,如果您当前位于第二页,并点击跳转到第四页,系统将记录您的起始页面,并在您完成帮助页面的浏览后,自动引导您返回第二页。同样,如果您从第一页跳转至帮助页面,点击返回按钮后,您将被带回第一页。这种方法适用于任何页面数量的故事。 接下来,我将介绍如何实现这一功能的代码。 首先,我们需要在大纲中定义一个脚本变量。我们将创建一个名为 What_Page 的字符串类型的脚本变量,并在大纲中为其默认值——即第一页的名称,“Page_1”。 现在我们已经拥有了一个用于记录当前所在页面的变量了,接下来我们编写代码以导航至帮助页面,并利用这个变量存储的位置返回到用户之前所在的页面。 接下来,我们需要在四个页面上各创建一个按钮。其中三个按钮将用于导航至帮助页面,而帮助页面上的按钮则将用户返回至他们之前访问的页面。 我们先从导航按钮开始。 将按钮添加到第一页,并附上以下脚本: // 设置您当前所在的页面,然后跳转至帮助页面
What_Page = ‘Page_1’;
Application.setActivePage(‘Page_4’); 第二行代码将脚本变量 What_Page 设置为 ‘Page_1’,即我们当前所在的页面。第三行代码则指示 SAC 导航至 Page_4。Application.setActivePage() 函数用于将 SAC 跳转到括号中指定的页面。因此,我们首先将变量设置为当前位置,然后导航至帮助页面。 同理,在第二和第三个页面上重复上述步骤,记得将 What_Page 相应地设置为 ‘Page_2’ 和 ‘Page_3’。 最后,我们要为帮助页面的按钮添加以下脚本: // 返回到之前的页面(存储在 What_Page 变量中)
Application.setActivePage(What_Page); 确实,这个过程非常简单——只需一行代码即可返回到 What_Page 变量中存储的页面。因此,如果您从 Page_2 来,您将被返回到 Page_2,以此类推。 最后一步是给按钮添加文本、工具提示等。以上视频展示了我的开发流程。这仅是一个示范性的故事案例,旨在演示如何展示“帮助”/“关于”页面,并在使用后将用户引导回他们原先访问的页面。实际使用的过程,有待大家去探索和创新,以适应各自的具体需求和创意。以下动图展示了一个投入使用的 SAC 故事的示例: 三、使用下拉列表在页面之间进行导航 接下来,本文将介绍如何通过下拉列表实现页面间的便捷导航。通过在故事中集成下拉菜单,用户可以隐藏工具栏,从而去除许多不必要的选项。 这是一个示例故事,在故事的顶部,您可以看到故事标题、元数据、用户信息、时间、日期等,而当前页面则以橙色突出显示,作为导航至故事中其他页面的快捷方式。点击“下拉列表”,即可展开显示所有其他故事页面的列表: 在故事的顶部,我们可以看到故事标题、一些元数据、用户、时间、日期等,然后以橙色显示的当前页面,作为故事中所有其他页面的导航加倍。单击“下拉列表”,将显示所有其他故事页面的列表: 正如您所见,当您从下拉列表中选择其他某个页面时,显示值会自动更新,变回为当前的页面,紧接着您将被导航至选中的页面。 实现这一功能仅需编写三行简洁的脚本。我们将在故事的每个页面上重复执行类似的步骤:添加下拉菜单、配置选项、添加脚本。 首先,在第一页添加一个下拉菜单,然后在“生成器”面板中设置选项,使其与故事的每个页面相对应。以我们的示例为例,总共有四页,因此您需要在下拉列表中添加四个项目。您需要将标识符设置为每个页面的ID,并把文本描述配置为您希望显示的页面标题,具体如下所示: 如上所示,“故事大纲”中有 4 个页面,分别是: Page_1:销售 Page_2:产品 Page_3:职员 Page_4:帮助 在下拉列表中,我们需要为每一页添加一个值行,并将下拉列表的默认值设置为当前页面。以本例中的Page_1为例,它被设置为默认值。但是,当复制到其他页面时,需要将默认值调整为Page_2、Page_3或Page_4。 在添加控件之后,我们需要为其编写脚本,以便用户能够导航到他们选择的页面。以下是实现此功能的代码: // 获取用户选择的页面
// 重置过滤器显示(为下一次显示做准备)
// 最后导航到所选页面
What_Page = Dropdown_1.getSelectedKey();
Dropdown_1.setSelectedKey(‘Page_1’);
Application.setActivePage(What_Page); 可以看到,我们使用相同的脚本变量What_Page来保存用户通过下拉列表选择的值。在这个例子中,下拉列表被称为Dropdown_1,但您需要根据SAC为该对象分配的实际名称进行更改。 代码的第二行将下拉列表重置为其初始值Page_1,这样如果我们返回到这一页,下拉列表将正确显示我们当前所在的页面,而不是上次使用下拉列表时选择的页面。例如,当将此下拉菜单添加到Page_3时,代码如下: What_Page = Dropdown_3.getSelectedKey();
Dropdown_3.setSelectedKey(‘Page_3’);
Application.setActivePage(What_Page); 代码的最后一行负责将故事导航到用户在下拉菜单中选择的项目。通过设置变量指向用户想去的页面,并重置下拉菜单,为下一次的导航做好准备。 对于第二页“Page_2”(以及所有其他页面),我们可以将下拉菜单从 Page_1 复制到 Page_2,并仅对下拉菜单进行一次更改——我们需要将默认值设置为 Page_2 而不是 Page_1: 唯一的不同是,每一页的下拉列表在 SAC 大纲中具有不同的名称,在本例中为 Dropdown_2 而不是 Dropdown_1。所以唯一的区别是,我们需要按如下方式修改此新对象中的脚本: What_Page = Dropdown_2.getSelectedKey();
Dropdown_2.setSelectedKey(‘Page_2’);
Application.setActivePage(What_Page); 我们更改脚本第一行中下拉菜单的名称,以反映我们正在交互的对象(Dropdown_2),并且我们需要将这个新的下拉菜单重置为当前页面的默认值——在这个例子中是”Page_2″,而不是”Page_1″。 除了这两点,我们为每页编写的脚本都是一致的。现在,每个页面都配备了一个下拉列表,其默认值显示当前所在的页面,并允许用户导航至其他拥有相同控件的页面。 四、总结 本文主要介绍了在 SAC 故事中,通过编写脚本实现的两种页面间导航功能:跳转按钮和下拉列表。希望这些内容能在您创建交互式故事或教程时提供实用的指导。 祝编码愉快! 原作者:Daniel_Davis原文链接:Start Your scripting Journey The Easy Way With SAP Analytics Cloud | Part Two Read More Technology Blogs by SAP articles
#SAP
#SAPTechnologyblog