文档首页/ 智能数据洞察 DataArts Insight/ 最佳实践/ 通过跳转实现不同大屏之间的交互
更新时间：2025-01-09 GMT+08:00
查看PDF
分享

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

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

步骤1：新建数据大屏

  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

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

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

  2. 配置大屏B全局参数：
    1. 在“图表>关联字段”选择“product_type”，在“图表>生效控件”勾选“线状图”、“文本”。
    2. 在左侧将全局参数命名为“screenB_GlobalParameter”。

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

步骤3：配置跳转参数

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

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

      图4 配置大屏A跳转参数

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

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

步骤4：实现大屏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

相关文档