通过跳转实现不同大屏之间的交互

应用场景

基于“跳转”功能实现两个数据大屏之间的跳转，并通过配置“全局参数”实现从大屏B返回至大屏A时，大屏A的查询条件能够保持用户输入的状态，方便用户浏览数据。

操作流程

1. 准备工作：准备本示例中所需的数据集。
2. 步骤一：新建数据大屏：新建大屏，用于后续大屏跳转操作。
3. 步骤二：配置全局参数（可选）：按需配置大屏的全局参数，全局参数不是必选项。
4. 步骤三：配置跳转参数：配置大屏之前跳转的参数，是实现大屏之前相互跳转的重要环节。
5. 步骤四：实现大屏A和大屏B相互跳转：实现大屏A和大屏B相互跳转。

准备工作

执行以下操作之前，请提前准备数据集。可以直接使用通过用户标签完成数据集的权限控制示例中创建的数据集验证本示例。

步骤一：新建数据大屏

1. 登录智能数据洞察控制台。
2. 单击管理控制台左上角的，选择区域，单击右上角的企业项目，选择企业项目。
3. 在控制台上方单击“项目”后，单击项目名称，进入项目页面。
4. 单击“数据管理 > 数据集”，进入数据集页面。
5. 在列表找到对应的数据集，并单击操作列的“新建大屏”。
6. 新建大屏A：本示例以线状图和单选下拉为例。
   1. 线状图：在左侧单击“常用图表 > 线状图”，在右侧选择“product_type”维度和“product_price”度量，完成后单击“更新”。
   2. 单选下拉：在左侧单击“交互 > 单选下拉”，在右侧选择“product_type”维度，完成后单击“更新”。
   3. 设置完成后将大屏命名为“screenA”，单击“保存”。
      图1 新建大屏A
      

7. 新建大屏B：本示例以线状图和文本为例。
   1. 线状图：在左侧单击“常用图表>线状图”，在右侧选择的“product_name”维度和“product_price”度量，完成后单击“更新”。
   2. 文本：在左侧单击“文本”，在右侧输入“<<”。
   3. 设置完成后将大屏命名为“screenB”，单击“保存”。
      图2 新建大屏B
      

步骤二：配置全局参数（可选）

1. 配置大屏A全局参数：
   1. 单击页面右上角，进入全局参数页面。
   2. 在“控件 > 生效控件”勾选“单选下拉”。
   3. 在“图表 > 关联字段”选择“product_type”，在“图表 > 生效图表”勾选“线状图”。
   4. 在左侧将全局参数命名为“screenA_GlobalParameter”。
      图3 大屏A全局参数配置
      

2. 配置大屏B全局参数：
   1. 单击页面右上角，进入全局参数页面。
   2. 在“图表 > 关联字段”选择“product_type”，在“图表 > 生效图表”勾选“线状图”、“文本”。
   3. 在左侧将全局参数命名为“screenB_GlobalParameter”。
      

      全局参数不是必选项，通过配置全局参数将实现从大屏B跳转回到大屏A时，大屏A单选下拉的参数保持不变，只显示筛选后的数据，如图8所示。如果不设置全局参数，从大屏B跳转回到大屏A时，大屏A将显示所有数据。

步骤三：配置跳转参数

1. 配置大屏A跳转参数：
   1. 单击线状图，右侧选择“交互”页签，单击“跳转”后面的，进入图表跳转界面。
   2. “需要绑定的字段”选择“product_type”。
   3. 在“跳转报表/大屏”选择“大屏”、“screenB”。
   4. 在“关联参数”选择“全局参数”，“当前大屏的生效参数”设置为“screenA_GlobalParameter”，“跳转报表/大屏的全局参数”设置为“screenB_GlobalParameter”。
      

      如果不设置全局参数，请忽略步骤d。设置全局参数的作用请参见步骤二：配置全局参数（可选）的说明。

      图4 配置大屏A跳转参数
      

2. 配置大屏B跳转参数：
   1. 单击“文本”，右侧选择“交互”页签，单击“跳转”后面的，进入图表跳转界面。
   2. “需要绑定的组件”选择“文本1”。
   3. 在“跳转报表/大屏”选择“大屏”、“screenA”。
   4. 在“关联参数”选择“全局参数”，“当前大屏的生效参数”设置为“screenB_GlobalParameter”，“跳转报表/大屏的全局参数”设置为“screenA_GlobalParameter”。
      图5 配置大屏B跳转参数
      
      

      如果不设置全局参数，请忽略步骤d。设置全局参数的作用请参见步骤二：配置全局参数（可选）的说明。

步骤四：实现大屏A和大屏B相互跳转

1. 单击大屏编辑页面右上角的“保存并发布”，确保大屏A和大屏B都为发布状态。
2. 单击大屏A编辑页面右上角的“预览”，进入大屏A的预览状态，单击线状图的横坐标跳转至大屏B，如图6所示。
   图6 大屏A跳转至大屏B
   

3. 在大屏A单选下拉中选择任意产品类型，本文以“compute”为例，单击线状图的横坐标跳转至大屏B，此时大屏B只会显示“compute”的信息，如图7所示。
   图7 筛选后跳转至大屏B
   

4. 在大屏B单击“<<”将跳转至大屏A，如图8所示。
   图8 大屏B跳转至大屏A