添加可视化组件 |
地图大屏 WebApp 提供了丰富的可视化组件库,包括布局、地图、地图子组件、图表、基础、数据、工具等 7 大类,您可以用简单的交互式操作来创建不同类型的组件,打造可视化的大屏应用:
此外,地图大屏还支持用户自行开发全新的组件,并提供了几款自定义组件的示例 demo 以供您试用。有关自定义组件的具体开发方法,请参见:自定义组件指南。
某些可视化组件(如图表组件、数据组件以及文本列表等部分基础组件)需要关联数据进行使用,地图大屏提供了数据面板以便于添加、查看与管理这些组件中涉及到的数据:
地图大屏的组件属性可划分为所有组件通用的属性配置项与各组件的特有属性配置项,以下为所有组件共有的属性设置:
各组件特有的属性配置项,在选中对应组件后,可在右侧边栏中进行设置,具体请参见各组件的说明文档。
地图大屏为组件提供了丰富的交互操作,以实现组件间的联动响应,让您的大屏应用在展示时更加生动。
组件交互的对象为触发组件和目标组件,交互操作的前提是触发组件和目标组件间含有相同的数据或组件间的数据可以通过某一字段进行关联。地图大屏支持的交互组件及交互操作如表1所示。
下面将详细为您介绍如何在地图大屏中进行组件交互设置:
选中触发组件,在右侧的交互设置面板中,为触发组件添加触发器;
添加触发器后,点击“添加操作”,依次选择目标组件、目标操作、目标数据后,点击“新增”按钮,即可完成组件交互设置。
设置完成后,点击触发组件中的元素即可在目标组件中得到相应的业务响应。
表1 地图大屏支持的交互组件及交互操作
组件名 | 作为触发组件 | 支持的触发器 |
作为目标组件 |
支持的目标操作 | |
地图 |
√ |
选择要素后 范围改变后 |
√ |
高亮要素 切换数据 添加至地图 缩放至地图 |
|
图表 |
柱状图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
条形图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
饼图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
散点图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
折线图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
雷达图 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
仪表盘 |
- |
- |
√ |
显示数据 切换数据 |
|
水球 |
- |
- |
√ |
显示数据 切换数据 |
|
进度条 |
- |
- |
√ |
显示数据 切换数据 |
|
进度环 |
- |
- |
√ |
显示数据 切换数据 |
|
基础 | 文本 |
- |
- |
√ |
显示数据 切换数据 切换超链接 |
文本列表 |
√ |
选择记录后 |
√ |
过滤数据 高亮要素 切换数据 |
|
指标 |
- |
- |
√ |
显示数据 切换数据 |
|
图片 |
- |
- |
√ |
显示数据 |
|
视频 |
- |
- |
√ |
显示数据 |
|
视频+ |
- |
- |
- |
- |
|
数据 | 数据切换 |
√ |
切换数据后 |
- |
- |
时间轴(段) |
√ |
切换数据后 |
- |
- |
|
时间轴(点) |
√ |
切换数据后 |
- |
- |
|
时间轴(条) |
√ |
切换数据后 |
- |
- |
添加完所需的可视化组件后,您可以进一步对大屏进行各类设置。