检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
指标 指标是一种文本组件,用于在可视化页面中显示指标数据。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“指标”组件至画布空白区域,如图1。 图1 指标 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。
左边距:图表到组件边框左侧的距离。 配置 在配置中,可对文本的内容进行设置,如输入具体内容、设置内容字体、大小和颜色等。 图4 配置 文本设置 文本内容:设置文本内容。 字体:设置输入文本内容的字体、大小和颜色等。 文字间距:设置文字之间的距离。 对齐方式:设置文本内容对齐方式,支持左对齐、居中和右对齐。
文本 词云 时间轴 通用表格 基础表格 趋势 搜索框 下拉选择框 日历组件 翻牌器 时间展示 时间翻牌器 里程碑 排行榜 天气 文本编辑 复选框 日期选择器 指标 标题 树状下拉框 多趋势 树状表格 高级表格 父主题: 组件介绍
词云 词云是文本组件的一种,通过对词频的统计及对应词语字体大小样式,来展现词语出现次数。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“词云”组件至画布空白区域,如图1。 图1 词云 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡
里程碑 里程碑组件可以区分过去(选中)、现在(高亮、点击)和未来(默认)三种状态,来改变不同时间态的样式。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“里程碑”组件至画布空白区域,如图1。 图1 里程碑 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由
基础表格 基础表格是文本组件的一种,通过表格的方式,将数据信息以表格的形式清晰的展示在可视化应用上。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“基础表格”组件至画布空白区域。 图1 基础表格 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中
高级表格 高级表格是文本组件的一种,通过表格的方式,将数据信息以表格的形式清晰的展示在可视化应用上。 在大屏设计页面,从“全部组件 > 文本”中,拖拽“高级表格”组件至画布空白区域,如图1。 图1 高级表格 图2 边距样式说明 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件
行配置 奇行背景颜色:设置奇数行数据的背景颜色。 偶行背景颜色:设置偶数行数据的背景颜色。 溢出文本:设置表格中超长文本的显示样式,如显示为省略号、换行显示和滚动显示。 图5 溢出文本 序列号:表格中序列号设置。 是否展示:表格中是否显示序列号。 序列号:设置序列号的名称。 列宽占比:设置序列号在表格中的列宽占比。
模型的取值,如组件名称、时延和成功率。 类型:选择数据的类型,如单行文本、多行文本、数字、趋势、图片、迷你柱状图、迷你折线图和迷你进度条。不同的类型,展示的参数所有不同,请以界面实际显示的为准。本章节以单行文本为例,进行介绍。选择迷你柱状图和迷你折线图时,支持放大图表显示。 图14
在编辑页面状态下,选中组件,单击右键,选择“重命名”。 图1 重命名 您也可以在“图层”中,将鼠标悬浮在组件上,单击“重命名”。 图2 在图层中重命名组件 在输入框中,输入组件的新名称。 父主题: 组件管理
来判定是否显示,返回true显示function定义。 showInput Boolean 否 showInput: true 是否展示输入框。 事件 表2 事件 事件名称 调用配置项中的方法 说明 回调参数 change change 值改变时触发 (value, data, field)
100 设置计数器允许的最大值,默认值为Infinity。 showInput Boolean 否 showInput: true 是否展示输入框,默认为true。 append String 否 append: "%" 添加的字符串。 事件 表2 事件 事件名称 调用配置项中的方法
在Echarts组件设置中,可以设置ECharts组件的初始化代码块、实例化代码块、自定义事件和自定义动作。 图4 代码设置 初始化代码块:初始化代码块输入框是一个javascript的执行环境,该执行环境的目的是调用echarts的init方法创建实例,此处可配置初始化相关的操作,包括echarts的主题等。
背景框 背景框是装饰组件的一种,包括大标题背景、小标题背景、页面背景和内容背景。可根据不同的设计需求,选择不同的背景框,以增加视觉效果。 以自定义背景框为例,在大屏设计页面,从“全部组件 > 装饰”中,拖拽“自定义背景框”组件至画布空白区域,如图1。 图1 自定义背景框 卡片 卡
应用:选择调用自定义接口所属的应用。 API接口:选择待调用的API接口,下拉框中的选项取值为接口的标签,如果接口标签取值为中文,则这里“API接口”显示为中文标签。如果接口标签未定义,则显示接口的操作名称。 请求类型:API接口的请求类型,系统会自动填入。 参数:接口入参,当有入参时,系统会自动展示,本示例不涉及。
图4 设置数据集 应用:选择调用自定义接口所属的应用,本示例选择AstroZero中安装的“告警服务Mock应用”。 此处的“告警服务Mock应用”仅为示例,在实际使用时,选择AstroZero中已安装的一个应用即可。 API接口:API接口的URL,本示例选择“getWarnDetailByStatus”接口。
从全部组件中,分别拖拽文本编辑、水平基本柱图、基本柱图、和区域图到画布区域,布局如图6所示。 图5 拖拽文本编辑组件到画布 图6 组件布局 在页面右上角,根据需要选择所需的主题(本示例设置为经典原始,即单击“取消当前主题卡片装饰”)。 配置文本编辑组件。 选中上方文本编辑组件,单击上方
应用:选择调用自定义接口所属的应用。 API接口:选择待调用的API接口,下拉框中的选项取值为接口的标签,如果接口标签取值为中文,则这里“API接口”显示为中文标签。如果接口标签未定义,则显示接口的操作名称。 请求类型:API接口的请求类型,系统会自动填入。 参数:接口入参,当有入参时,系统会自动展示。
可从下方左侧面板选择字段名、函数或者直接输入函数,如图3。 图3 表达式设置 测试API接口:用于测试该接口,单击“测试API接口”,“样例报文”中会显示输出结果。 样例报文:对应API接口的响应样例报文数据格式,数据集的元数据结构由该样例报文经转换器处理后的数据结构确定。 单击
ROMA连接器配置示例 API接口:API请求路径。 请求类型:请求的类型,如GET、POST。 参数:输入参数,请根据实际请求进行配置。 测试API接口:用于测试该接口,单击“测试API接口”,“样例报文”中会显示输出结果。 样例报文:对应API接口的响应样例报文数据格式,数据集