检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
交互功能可以实现图表联动,通过组件之间参数的传递来实现,单击某一个图表,另外一个图表的数据可以进行相应的变化。
样式 图表尺寸:设置图表的宽和高。单位为px。 图表位置:设置图表在画布中的位置。单位为px。 自动播放:勾选时,视频会自动播放。 循环播放:勾选时,视频会循环播放。 控制条:勾选时,视频播放时会显示控制条。 静音:勾选时,视频会静音播放。
图1 选择模板 单击“创建大屏”。大屏创建成功后,自动跳转至大屏开发页面。 进入大屏开发页面后,在左侧的组件列表中,将鼠标移至某一个组件类别,单击其中某个组件的图形按钮,即可将该组件添加到大屏中。 例如,单击下图所示的“常用图表 > 气泡图”图形按钮,可将气泡图添加到大屏中。
DLV的架构 DLV的产品架构如图1所示: 图1 DLV产品架构
预览大屏的入口有如下两个: 在大屏开发页面右上方,单击预览图标。 图1 预览大屏(入口一) 在“我的大屏”页面,找到需要预览的大屏,将鼠标移动至该大屏图标之上,界面上将显示大屏的管理按钮,单击预览按钮。 图2 预览大屏(入口二) 父主题: 开发大屏
图4 定义并启用交互变量 在左侧组件中心,选择“常用图表 > 柱状图”。 图5 选择柱状图组件 在“样式”面板,配置柱状图组件的样式,本示例使用默认样式。 图6 配置柱状图样式 切换到“数据”面板,配置柱状图数据。 选择数据源,并配置字段映射。如图7所示,组件关联到动态数据。
其中,数据字段及格式请参照“静态数据”中的样例,如图1所示。 图1 查看数据格式(示例)
图1 大屏开发页面 表1 功能区说明 序号 功能区 描述 1 组件区 在组件区,DLV提供了丰富的组件,用户可以选择所需要的组件添加到画布中。关于组件的详细介绍,请参见组件概述。 2 图层区 图层区可以显示大屏中的各个图层的名称及缩略图,这样可以方便查找图层。
使用流程 开发大屏前,您需要先了解DLV的使用流程,如图1所示。流程中所有操作都可以在DLV控制台完成。 图1 使用流程 建数据连接:连接数据大屏所需的数据源,如果您使用的是静态数据,请跳过该步骤。 建数据大屏:使用模板来创建数据大屏。
WebGL是一种在web页面上的三维绘图技术。当您同时打开多个WebGL页面、异常操作浏览器或浏览器兼容等出现问题时,WebGL可能导致浏览器崩溃,此时浏览器的顶部会自动提示WebGL崩溃。当出现此问题时,您需要刷新或重启浏览器。
在配置数据源的时候,保留CSV的首行作为表头,并且每一个列的列名需要和相应图表中要求的数据结构的字段名保持一致。
图3 数据映射-线状图 数据字段设置 单击需要修改字段前的“”,在下拉列中对字段进行设置。 图4 字段设置--饼状图 系列名:设置所属系列的名称。 颜色:设置对应字段在图表上的颜色显示。 数据系列 s字段为数据系列字段,数据将根据s字段的值进行分组。
图6 定义并启用交互变量 在左侧组件中心,选择“常用图表 > 柱状图”。 图7 选择柱状图组件 在“样式”面板,配置柱状图组件的样式,本示例使用默认样式。 图8 配置柱状图样式 切换到“数据”面板,配置柱状图数据。 选择数据源,并配置字段映射。如图9所示,组件关联到动态数据。
图1 编辑数据连接 大屏编辑页面 登录DLV控制台,单击“我的大屏”。 在“我的大屏”页面,找到需要编辑的大屏,将鼠标移至该大屏图标上,然后单击编辑按钮进入大屏开发页面。 图2 编辑大屏 在画布中,选中其中一个组件,单击“数据”面板,在打开的数据面板中修改数据配置。
图2 能源化工管理看板
常规图表组件: 线状图、柱状图、饼状图、单值百分比、雷达图、散点图、气泡图、区域排行、折线柱图、水平柱状图、双轴线状图、双轴折线柱图、环形柱图、水平胶囊柱状图、扫描雷达、图片、视频、轮播图、标题、文本、词云、时间器、表格轮播、数字翻牌器、跑马灯、轮播列表柱状图、键值表格、关系网络图
组件指南 线状图类 柱状图类 折线柱图类 饼图类 散点图类 其他常用图表 地图 媒体 文本 关系网络 素材 交互 其他
线状图:新增交互功能。 柱状图:新增交互功能,在“数据”中新增堆叠配置。 柱图类型组件,在“数据”中新增堆叠配置: 水平柱状图 WT柱图 WT水平柱图 折线柱图 双轴折线柱图 WT折线柱图 WT双轴折线柱图 气泡图:新增交互功能。