华为云用户手册

  • 配置 在配置中,设置组件的基本配置和进度条配置。 图4 配置 基本配置 数字显示:是否显示数字。 数字位置:设置数字的显示位置,如左、居中或右。 数字字体:设置数字的字体、大小和颜色等。 前缀:输入数字的前缀。 字体大小:设置前缀的字体大小。 后缀:设置后缀,如“%”。 字体大小:设置后缀的字体大小。 目标数据显示:是否显示目标数据。 目标数据标题:设置目标数据的标题,如当前目标。 字体:设置目标数据标题的字体、大小和颜色等。 完成数据显示:是否显示完成数据。 完成数据标题:设置完成数据的标题,如已完成。 字体:设置完成数据标题的字体、大小和颜色等。 进度条配置 进度条样式:设置进度条的样式,如圆角矩形、矩形。 进度条宽度:设置进度条的宽度。 进度条颜色:设置进度条当前进度的颜色。 进度条背景色:设置进度条的背景颜色。 图标进度条:是否显示进度条图标。 图标样式:自定义图标样式。建议选择JPG、JPEG、PNG或GIF格式的图片,且每张图片的大小不能超过50MB。 图标宽:设置图标的宽度。 图标高:设置图标的高度。 图标位置:设置图标的显示位置,如进度条上方、进度条下方。
  • 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。 图3 卡片 背景 背景色:设置组件卡片的背景颜色。 边框:组件卡片边框设置,支持无边框、全边框和角边框三种样式。设置为全边框和角边框时,支持设置组件外圈边框的线型、圆角等。 样式:选择图片时,图片显示的样式,支持普通、居中、拉伸和平铺四种样式。 选择图片:使用本地的图片作为组件背景,支持新增目录和子目录,便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片,且每张图片不能超过50MB。 特效:组件是否高亮显示,支持默认展示和跳转到页面时展示。 边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。
  • 配置 在配置中,设置组件的页签样式、导航页签和默认路由。 图4 配置 页签样式统一配置 页签方向:设置页签的显示方向,如水平方向、垂直方向。 位置:设置页签的位置,支持默认和自定义两种方式。 快捷设置:设置页签的显示位置,如居左、居右或居中。“位置”设置为“默认”时,才显示该配置。 上间距(%):设置页签距离组件上边界的距离。“位置”设置为“自定义”时,才显示该配置。 左间距(%):设置页签距离组件左边界的距离。“位置”设置为“自定义”时,才显示该配置。 导航页签:在导航页签,可删除或新增路由,也可对路由进行如下设置。 页签内容:设置当前路由页签的显示内容。 页签路由:选择当前路由页签关联的页面,只能选择已发布的页面。 默认文字:设置路由页签默认文字的字体、颜色和大小等。 默认样式:设置路由的默认样式,支持设置为颜色和自定义。 悬浮文字:设置鼠标悬浮在路由上时,页签内容的字体、大小和颜色等。 悬浮样式:鼠标悬浮在路由上时,路由显示的样式,支持设置为颜色和自定义。 点击文字:设置单击路由时,页签内容的字体、大小和颜色等。 点击样式:设置单击路由时的样式,支持设置为颜色和自定义。 默认路由:进入路由导航时,默认显示的页面。
  • 指标 指标是指可视化组件中,对除可视化图形之外的具体补充,即主要以文字和数字的表现形式,为可视化组件提供具体数值的参考。 图11 指标 显示指标:是否显示组件的指标。设置为显示时,可自定义指标的内容和样式等。 标题内容:自定义指标的显示内容。 标题字体:设置指标标题的字体、大小和颜色等。 自动求和:指标是否自动求和。 数值内容:“自动求和”设置为“否”时,需要输入数据指标数值。 数值字体:设置数值的字体、大小和颜色等。
  • 图例 图例是指在多维度可视化图形表达中,用以区分不同维度可视化图形的提示标识。 图8 图例 统一配置 图例:是否显示图例,如工程管理、环境管理。图例文字内容来源于数据模型下“s”的取值。 水平对齐方式:设置图例的水平对齐方式,支持左对齐、居中、右对齐和按照百分比设置。 垂直对齐方式:设置图例的垂直对齐方式,支持左对齐、居中、右对齐和按照百分比设置。 排列方向:设置图例的排列方向,支持水平和垂直两种方式。 类型:存在很多图例,导致图表中无法全部显示,此时可设置图例类型,即通过滚动翻页还是普通换行来查看图例。设置为“滚动翻页”时,支持设置翻页箭头的宽高、图标默认颜色、图标选中颜色和页码字体。 图例总宽高:设置图例项的宽度和高度,单位为“%”。 图例项宽度:设置图例的宽度,支持自动和自定义。 图例间隔:设置图例项之间的间隔。 图例标记 图例标记:设置图例前图标的形状。 标记宽高:设置图例前图标的宽度和高度。 图例系列名 字体:设置图例的字体、颜色和大小。 图例字符:设置图例显示的字符数,支持全显和省略。设置为“省略”时,支持设置图例显示的文字数量。 数据值:图例中是否显示数值。设置为“显示”时,可设置如下参数。 字体:设置图例中数值的字体、大小和颜色等。 数值左间距:设置系列名和数据之间的间距。 前缀:数值前是否显示前缀。 前缀内容:设置前缀的显示内容。 前缀字体:设置前缀的字体、大小和颜色等。 前缀右间距:设置前缀和数值之间的间距。 后缀:数值后是否显示后缀。 后缀内容:设置后缀的显示内容。 后缀字体:设置后缀的字体、大小和颜色等。 后缀左间距:设置后缀和数值之间的间距。 百分比:是否显示百分比。设置为“显示”时,支持设置如下参数。 数字字体:设置百分比中数值的字体、大小和颜色等。 百分号字体:设置百分比中百分号的字体、大小和颜色等。 百分号左间距:设置数值和百分比之间的间距。
  • 图形 图形是指组件中,实现 数据可视化 的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图6 图形 颜色:设置图表中,图形的颜色。 统一配置 数据系列:是否显示该系列数据。如果不选中,会隐藏该组件中对应的系列数据。 南丁格尔图:是否使用南丁格尔图。 内半径:设置饼图内半径的值,单位%。 外半径:设置饼图外半径的值,单位%。 圆心横坐标:设置饼图圆心横坐标的值,单位%。 圆心纵坐标:设置饼图圆心纵坐标的值,单位%。 排布顺序:扇区可按顺时针或逆时针排布。 起始角度:扇区起始角度。 最小角度:扇区最小角度。 鼠标悬停:鼠标放在扇区时,该扇区是否放大显示。 所有标签设置:图表的各个数据系列上,是否显示标签。 所有标签悬浮设置:鼠标悬浮在对应数据系列上时,标签是否显示。 标签位置:标签显示位置,如内部、外部或中间。 标签视觉引导线是否展现:标签前是否显示视觉引导线。 引导线长度:设置视觉引导线的长度。 标签内容:设置标签显示的内容,如系列名、数据值和百分比。 标签文字:设置标签的字体、大小和颜色等。 描边:轮播饼图间系列和整体范围的描边样式。 图7 设置描边效果 设置背景:设置为“是”时,可自定义饼图的背景颜色。 数据系列 系列名称:原始数据中默认的系列名称,可通过设置“显示名称”,进行修改。 显示名称:图表中实际显示的系列名称。 下标:数据系列所在的位置。 初始选中:数据项初始是否被选中。 颜色样式:数据系列的颜色样式,支持以下几种。 单色:可设置正常颜色和高亮下颜色。 渐变色:可设置渐变样式、渐变方向、起始颜色和结束颜色。 纹理:通过上传纹理图片,自定义数据系列的颜色样式。 普通标签:未选中数据系列时,标签的样式。 系列名是否展示:标签中系列名是否显示,如工程管理。 数据值是否展示:标签中数据值是否显示,如工程管理对应的数据值“635”。 百分比是否展示:标签中百分比是否显示,如工程管理对应的百分比“67.2”%。 普通标签字体:设置标签内容的字体、颜色和大小等。 高亮标签:选中数据系列时,标签的样式。 系列名是否展示:标签中系列名是否显示,如工程管理。 数据值是否展示:标签中数据值是否显示,如工程管理对应的数据值635。 百分比是否展示:标签中百分比是否显示,如工程管理对应的百分比67.2%。 高亮标签字体:设置标签内容的字体、颜色和大小等。
  • 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。 图3 卡片 背景 背景色:设置组件卡片的背景颜色。 边框:组件卡片边框设置,支持无边框、全边框和角边框三种样式。设置为全边框和角边框时,支持设置组件外圈边框的线型、圆角等。 样式:选择图片时,图片显示的样式,支持普通、居中、拉伸和平铺四种样式。 选择图片:使用本地的图片作为组件背景,支持新增目录和子目录,便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片,且每张图片不能超过50MB。 特效:组件是否高亮显示,支持默认展示和跳转到页面时展示。 边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。
  • 操作步骤 参考登录AstroCanvas界面中操作,登录AstroCanvas界面。 在主菜单中,选择“数据中心”。 在左侧导航栏中,选择“数据源”。 在数据源管理页面,单击“新建数据源”。 选择“AstroZero”,配置数据源参数。 图1 数据源 数据源名称:新建数据源的名称,用于标识该数据源。长度为1~32个字符,可包括中文、字母、数字及下划线,且不能以下划线开头或结尾。 域名 :AstroZero环境的域名,需要携带“https://”。 客户端ID:调用AstroZero接口前,需要配置“客户端模式”OAuth鉴权的客户端ID,获取方法请参考客户端模式接入认证。 OAuth认证过程中,新建认证密钥时授权类型需选择“客户端模式”,用户建议选择具有管理员权限(System Administrator Profile)的用户。 客户端密码:调用AstroZero的接口前,需要配置“客户端模式”OAuth鉴权的客户端鉴权密钥,获取方法请参考客户端模式接入认证。 描述:新建数据源的描述信息。 单击“连接测试”,显示“连接成功”,表示数据源可以调通。 单击“保存”,完成数据源的创建。
  • 配置 在配置中,设置日历组件当月默认状态、选中状态、日历卡片、头部等。 图4 配置 当月默认状态/选中状态/前月和下月状态/数据系列4...... 对应的状态码,系统默认有如下几个状态,每个状态有对应的状态码来标识。 当月默认状态:状态码为“0”。 选中状态:状态码为“1”。 前月和下月状态:状态码为“2”。 状态4/5/6/7:其他状态,每种状态可对应日历上的待办事项或者重要内容等。 该状态下日期块的背景色:设置当前状态下日期块的背景颜色。 日期字体:设置该状态下日期字体、文字大小、日期文字颜色等。 日期的行高大小:设置该状态下日期的行高大小。 内容字体:设置该状态下日期上备注的内容字体、文字大小、内容文字颜色等。 日历卡片 背景色:设置日历卡片的背景颜色。 边框色:设置日历卡片边框的颜色。 日期块的高度:设置每个日期块的高度。 日期块对齐方式:设置日期块的对齐方式,如左对齐、右对齐、居中。 日历头部 年月字体:设置日历头部年月字体、文字大小、年月文字颜色等。 快捷按钮字体:设置日历头部右侧快捷按钮字体、字体大小和颜色等。 快捷按钮背景色:设置日历头部右侧快捷按钮的背景色。 星期字体:设置日历头部星期的字体、文字大小、文字颜色等。
  • 坐标轴 在坐标轴中,设置图表的x轴和y轴,如是否显示x轴y轴、字体、字体颜色、是否显示刻度等。 图6 坐标轴 x轴 X轴:是否显示X轴。 坐标轴分割段数:设置坐标轴的分割段数,需要注意的是这个分割段数只是个预估值,实际显示的段数会在这个基础上根据分割后坐标轴刻度显示的易读程度作调整。 最小值:设置坐标轴的最小值。 最大值:设置坐标轴的最大值。 刻度标签旋转的角度:控制刻度标签的旋转,在文字过长时可以避免重叠。 轴线显示:控制是否显示轴线。 刻度显示:控制是否显示刻度。 线的颜色:轴线的颜色。 标签显示:是否显示刻度标签。打开后需要设置刻度标签字体、字体颜色、大小、粗细。 刻度标签字体:刻度标签的字体、字体颜色、字体大小设置。 网格线是否显示:是否显示轴网格线、轴网格线的类型和颜色设置。 y轴 Y轴:是否显示Y轴。 最小值:设置坐标轴的最小值。 最大值:设置坐标轴的最大值。 轴线显示:控制是否显示轴线。 刻度显示:控制是否显示刻度。 线的颜色:轴线的颜色。 标签显示:是否显示刻度标签。打开后需要设置刻度标签字体、字体颜色、大小、粗细。 刻度标签字体:刻度标签的字体、字体颜色、字体大小设置。 网格线是否显示:是否显示轴网格线、轴网格线的类型和颜色设置。
  • 同项目不同页面之间的跳转 当项目场景较多,一屏无法完全涵盖所有内容或需要额外查询时,为了性能考虑,通常会采取传递参数在另外的页面进行查询后,在当前页面展现,这时就需要在同项目中不同页面间来回跳转。 例如,新建三个页面(页面一、页面二和页面三),向页面一(默认主页)中拖入玫瑰花饼图和基本饼图,向页面二中拖入多区域折线图并发布,向页面三中拖入基本柱图并发布。 参考创建大屏&PC端项目中操作,新建一个大屏项目,如页面间交互。 参考使用空白画布新建页面中操作,新建一个空白页面,如页面一,并拖入玫瑰花饼图和基本饼图。 图1 页面一 单击,保存页面后单击,发布页面。 参考上述操作,新建页面二和页面三,分别拖入多区域折线图和基本柱图,并发布。 图2 页面二 图3 页面三 在页面一中,选中玫瑰花饼图,单击组件上方的,设置玫瑰花饼图和页面二之间的交互。 图4 与页面二之间的交互 页面类型:选择待跳转页面的类型,支持选择本项目内页面或外部页面。 内部页面:选择待跳转的具体页面。“页面类型”设置为“内部页面”时,才显示该配置。 外部页面地址:选择待跳转的外部页面地址,可以直接输入地址,也可以设置为全局变量。“页面类型”设置为“外部页面”时,才显示该配置。 页面打开方式:设置跳转页面的打开方式,如新窗口、当前窗口或弹窗。设置为弹窗时,可指定弹窗的高度和宽度。本示例设置为弹窗,并设置弹窗的高度和宽度为50%。 设置页面参数:支持设置为“固定参数”和“变量参数”,设置为“变量参数”时,参数值可以设置为全局变量。设置后,跳转页面的地址中会带上此处设置的参数,格式为“跳转页面URL?参数名=参数值”。 图5 设置为固定参数 图6 设置为变量参数 图7 跳转页面地址中会带上设置的参数 在页面一中,选中基本饼图,单击组件上方的,设置基本花饼图和页面三之间的交互。 图8 与页面三之间的交互 单击,保存页面后单击,预览效果。 图9 单击玫瑰花饼图弹出页面二 图10 单击基本饼图弹出页面三
  • 跳转外部页面 外部页面跳转和项目内部页面跳转类似,只是交互动作的选择项不同,同时需要填入外部页面的连接地址。 参考创建大屏&PC端项目中操作,新建一个大屏项目,如页面间交互。 参考使用空白画布新建页面中操作,新建一个空白页面,并拖入玫瑰花饼图。 选中玫瑰花饼图,单击组件上方的,进入交互设置页面。 设置本页面与外部页面之间的跳转。 图11 设置与外部交付的页面 外部页面由于同源策略限制,暂不支持弹窗打开。 在填写外部页面地址时,需要将“http://”或“https://”请求头也一并填入。 单击,保存页面后单击,预览效果。
  • 在组件中使用数据集 返回AstroCanvas项目列表页面。 进入大屏应用开发页面,拖拽所需组件(如水平基本柱图)到画布中。 图4 拖拽水平基本柱图到画布中 选中该组件,单击组件上方的,进入组件数据页面。 在“数据类型”下拉框中,选择“数据集”,选择创建HTTP连接器数据集中创建的数据集。 配置全局变量。 全局变量可以理解为参数变量,用于控制组件之间参数的传递,从而达到交互的目的,例如图表联动、自定义字段等功能。如何使用全局变量,可参考如何基于页面级的全局变量实现组件交互~如何通过全局变量,实现组件数据的动态变化。本示例不做配置。 在组件预览中,选择要展示的表字段,即从左边栏中拖入到右边栏中,单击“保存”。 图5 拖拽字段到坐标轴 表格字段:展示创建HTTP连接器数据集中,获取的数据。 配置:从表格字段中,拖拽所需的字段到X轴数据、Y轴数据和系列中。 刷新周期:每隔多少秒从HTTP连接器中读取一次数据,默认配置为“0”,表示只获取一次。 共享数据:是否共享数据。勾选后,如果多个组件调用了相同的桥接器URL请求,不会各自只调用,而是共享结果数据。 选中水平基本柱图组件,单击组件上方的,设置标题内容为“各功能操作频率统计”。 图6 设置图表标题 单击页面上方的,保存设置页面。 单击,进入预览页面,预览效果。 图7 最终呈现效果
  • 指标 指标是指可视化组件中,对除可视化图形之外的具体补充,即主要以文字和数字的表现形式,为可视化组件提供具体数值的参考。 图10 指标 显示指标:是否显示指标。 指标内容:设置指标内容。 指标字体:设置指标内容的字体、大小、颜色等。 指标类型:设置指标类型,支持总和、平均值和自定义。 数值内容:“指标类型”设置为“自定义”时,支持自定义数值内容。 数值字体:设置数值字体、大小、颜色等。 数值位数:设置数值小数点后的位数。
  • 坐标轴 坐标轴是指对图表组件,进行坐标系相关样式、颜色、位置和行为的设置。 图8 坐标轴 x轴 X轴:是否显示X轴。 轴标题:X轴标题。 字体:设置坐标轴字体、颜色和大小等。 标题偏移:标题相对于轴线的偏移。 标题旋转:标题旋转角度。 轴线:是否显示轴线,支持设置轴线颜色。 刻度:是否显示刻度。 刻度标签:刻度标签样式,包括是否自动调节标签、显示所有标签。 刻度标签字体:刻度标签的字体、字体颜色、字体大小设置。 标签行为:标签字数过多时是否进行处理,包括字数过多是否换行、字数过多是否省略和标签字数过多不做处理。 标签旋转:标签旋转角度。 网格线:是否显示网格线。 反转:是否对轴数据进行反转。 y轴 Y轴:是否显示Y轴。 轴标题:Y轴标题。 字体:设置坐标轴字体、颜色和大小等。 标题偏移:标题相对于轴线的偏移。 标题旋转:标题旋转角度。 轴线:是否显示轴线,支持设置轴线颜色。 刻度:是否显示刻度。 刻度标签字体:刻度标签的字体、字体颜色、字体大小设置。 最小间隔:坐标轴最小间隔大小。 标签旋转:标签旋转角度。 网格线:是否显示网格线。 轴起始值:设置Y轴的起始值。为方便数据展示,输入为接入数据最大值时,图表Y轴起始值为最大值的一半。 左Y轴单位:设置左侧Y轴的单位。 轴最大值:是否设置轴最大值,支持直接输入阈值。 反转:是否对轴数据进行反转。 柱间阴影:柱间是否显示阴影,支持自定义阴影颜色。 标签展示:设置Y轴标签展示样式,如默认或计数单位。
  • 参考线 参考线是指为图表组件添加可视化的参考标准,为图表中数据提供具体的参考依据。 图9 参考线 统一配置:设置参考线两端的样式,如圆形、矩形和三角形等。 Y轴参考线 Y轴参考线:是否显示Y轴参考线。 参考线:设置已有参考线的颜色和线型,单击“新增Y轴参考线”,可新增参考线。单击对应参考线后的,可删除参考线。 X轴参考线 X轴参考线:是否显示X轴参考线。 参考线:设置已有参考线的颜色和线型,单击“新增X轴参考线”,可新增参考线。单击对应参考线后的,可删除参考线。
  • 图例 图例是指在多维度可视化图形表达中,用以区分不同维度可视化图形的提示标识。 图5 图例 显示图例:是否展示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记:设置图例小图标形状。 图例宽高:设置图例的宽度和高度。 图例间隔:设置图例之间的间隔。 字体:设置图例的字体、颜色和大小等。 左间距:图例到柱图组件左侧距离占组件高度的百分比或图例位置的对齐方式设置。 上间距:图例到柱图组件顶部距离占组件高度。 翻页按钮:翻页按钮的颜色。 翻页按钮不激活:翻页按钮不激活时的颜色。 自定义图例显示:是否开启自定义图例显示设置。开启后,可调整图例名称显示字符长度。默认关闭,即显示图例所有字符。
  • 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图4 图形 颜色:设置图表中,图形的颜色。 统一配置 光圈标记:是否开启光圈标记。 数据排序:是否开启数据排序。 阶梯瀑布:是否阶梯瀑布效果显示。 横向柱条:是否横向柱条效果显示。 柱条圆角:设置柱条的圆角。 柱条宽度:设置柱条的宽度。 数据标签:是否显示数据标签。设置为显示时,支持设置标签位置、颜色。 数据标签最小值/最大值:显示标签的最大值和最小值。 数据系列 系列名称:原始数据中默认的系列名称,可通过设置“显示名称”,进行修改。 显示名称:自定义图表中系列的显示名称。 柱条宽度:柱状条相对于X轴单位间隔的宽度。 柱条颜色:设置柱条颜色,如单色或渐变色,支持自定义柱状条的颜色。 定制最大柱条:支持对最大的柱条自定义设置,包括颜色等。 柱条圆角:柱状条边框圆角设置,取值为“0”时为直角,“100”为圆角。 数据标签:是否显示数据标签,即柱状条旁是否显示数值。开启后,支持设置数值显示位置和数值颜色。
  • 操作步骤 开发好某个大屏页面,例如在页面中拖入基本饼图组件,保存后单击发布图标。 图1 开发页面 打开“发布链接”开关,生成发布后的页面链接。 单击“+ 新建版本”,会生成一个页面版本。 图2 新建第一个版本 单击新建版本后的,将该版本设置为当前发布页。 图3 设置发布页 在页面版本的操作列中,您还可以执行如下操作: :预览该版本页面。 :编辑该版本页面。 :删除该版本页面。当前版本页面设置为发布页后,不支持删除。 关闭页面发布设置,返回设计页面,拖入其他组件,如折线图组件,保存页面。 图4 拖入其他组件 单击页面上方的,单击“+新建版本”,会生成第二个版本。 生成的第二个版本会显示在上方,由于发布页设置的是第一个版本的页面,这时用户通过发布后的链接访问页面,页面仍是第一个版本,不会看到第二个版本新建的折线图组件。 图5 新建第二个版本
  • 坐标轴 坐标轴是指对图表组件,进行坐标系相关样式、颜色、位置和行为的设置。 图9 坐标轴 x轴 X轴:是否显示X轴。 X轴坐标轴类型:设置X轴坐标轴类型,支持连续数据、类目轴和时间轴。 坐标轴分割段数:设置X轴坐标轴段数。 最大值:X轴线标签数据的最大值。 最小值:X轴线标签数据的最小值。 坐标轴名称:设置X轴坐标轴显示名称。 坐标轴名称字体:坐标轴字体、颜色、大小设置。 刻度标签旋转的角度:设置刻度标签旋转的角度。 轴线显示:是否显示轴线。 刻度显示:是否显示刻度线。设置为显示时,支持设置线的颜色。 刻度标签字体:设置标签的字体、颜色和大小。 网格线是否显示:是否显示网格线。设置为显示时,支持设置线的类型和颜色。 y轴 Y轴:是否显示Y轴。 Y轴坐标轴类型:设置Y轴坐标轴类型,支持连续数据、类目轴和时间轴。 最大值:Y轴线标签数据的最大值。 最小值:Y轴线标签数据的最小值。 坐标轴名称:设置X轴坐标轴显示名称。 坐标轴名称字体:坐标轴字体、颜色、大小设置。 轴线显示:是否显示轴线。 刻度显示:是否显示刻度线。设置为显示时,支持设置线的颜色。 刻度标签字体:设置标签的字体、颜色和大小。 网格线是否显示:是否显示网格线。设置为显示时,支持设置线的类型和颜色。
  • 图例 图例是指在多维度可视化图形表达中,用以区分不同维度可视化图形的提示标识。 图6 图例 显示图例:是否显示图例。图例文字内容来源于数据模型下“s”的取值。 图例标记:设置图例小图标形状和图例列表布局朝向。 图例宽高:设置图例的宽度和高度。 图例间隔:设置图例之间的间隔。 字体:设置图例的字体、颜色和大小。 文字风格:设置图例文字的风格,支持正常、斜体和倾斜体。 图例位置(左):图例到饼图组件左侧距离占组件高度的百分比或图例位置的对齐方式设置。 左间距:图例到散点图组件左侧距离占组件高度。 上间距:图例到散点图组件顶部距离占组件高度。 图例类型:存在很多图例,导致图表中无法全部显示,此时可设置图例类型,即通过滚动翻页还是普通换行来查看图例。 自定义图例显示:开启后,可调整图例名称显示字符长度。默认关闭,即显示图例所有字符。
  • 参考线 参考线是指为图表组件添加可视化的参考标准,为图表中数据提供具体的参考依据。 图10 参考线 统一配置:设置参考线两端的样式,如圆形、矩形和三角形等。 Y轴参考线 Y轴参考线:是否显示Y轴参考线。 参考线:设置已有参考线的颜色和线型,单击“新增Y轴参考线”,可新增参考线。单击对应参考线后的,可删除参考线。 X轴参考线 X轴参考线:是否显示X轴参考线。 参考线:设置已有参考线的颜色和线型,单击“新增X轴参考线”,可新增参考线。单击对应参考线后的,可删除参考线。
  • 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图5 图形 颜色:设置图表中图形的颜色。 统一配置 标记图形:设置标记的图形,如圆形、矩形、三角形等。 数据标签:是否显示数据标签,支持设置标签颜色。 数据标签最大值/最小值/平均值:设置数据标签的最大值、最小值或平均值。 数据系列 系列名称:原始数据中默认的系列名称,可通过设置“显示名称”,进行修改。 显示名称:自定义图表中系列的显示名称。 标记图形:设置标记的图形样式,如圆形、矩形、三角形等。 标记大小:设置标记的大小。 颜色设置:设置标记颜色样式,支持纯色、线性渐变和径向渐变。 颜色:设置标记的颜色。 边框颜色:设置标记边框颜色。 图形透明度:散点图散点的透明度,取值0~1。 数据标签:显示散点对应的数值标签。 图表标注和标线最大值:显示散点数据的最大值。 图表标注和标线最小值:显示散点数据的最小值。 图表标注和标线平均值:显示散点数据的平均值。
  • 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。 图3 卡片 背景 背景色:设置组件卡片的背景颜色。 边框:组件卡片边框设置,支持无边框、全边框和角边框三种样式。设置为全边框和角边框时,支持设置组件外圈边框的线型、圆角等。 样式:选择图片时,图片显示的样式,支持普通、居中、拉伸和平铺四种样式。 选择图片:使用本地的图片作为组件背景,支持新增目录和子目录,便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片,且每张图片不能超过50MB。 特效:组件是否高亮显示,支持默认展示和跳转到页面时展示。 边距:组件中图表距离整个组件四边(上、下、左、右)的距离(参见图2),默认为0,即铺满整个组件。
  • 图例 图例是指在多维度可视化图形表达中,用以区分不同维度可视化图形的提示标识。 图6 图例 显示图例:是否显示图例,图例文字内容来源于数据模型下“s”的取值。 图例标记:设置图例小图标形状和图例列表布局朝向。 图例宽高:设置图例的宽度和高度。 图例间隔:设置图例之间的间隔。 字体:设置图例的字体、颜色和大小。 文字风格:设置图例文字的风格,支持正常、斜体和倾斜体。 图例位置(左):图例到饼图组件左侧距离占组件高度的百分比或图例位置的对齐方式设置。 上间距:图例到气泡图组件顶部距离占组件高度。 图例类型:存在很多图例,导致图表中无法全部显示,此时可设置图例类型,即通过滚动翻页还是普通换行来查看图例。 自定义图例显示:开启后,可调整图例名称显示字符长度。默认关闭,即显示图例所有字符。
  • 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图5 图形 颜色:设置表单中,图形的颜色。 统一配置 标记图形:设置标记的图形,如圆形、矩形、三角形等。 数据标签:是否显示数据标签,支持设置标签颜色。 数据标签最大值/最小值/平均值:设置数据标签的最大值、最小值或平均值。 数据系列 系列名称:原始数据中默认的系列名称,可通过设置“显示名称”,进行修改。 显示名称:自定义图表中系列的显示名称。 标记图形:设置标记的图形样式,如圆形、矩形、三角形等。 颜色设置:设置标记颜色样式,支持纯色、线性渐变和径向渐变。 颜色:设置标记的颜色。 边框颜色:设置标记边框颜色。 阴影颜色:设置标记阴影颜色。 阴影大小:设置标记阴影大小。 水平方向偏移距离:气泡图中气泡在水平方向上的偏移位置。 垂直方向偏移距离:气泡图中气泡在垂直方向上的偏移位置。 图形透明度:气泡图中气泡的透明度。 数据标签:显示气泡图对应的数值标签。 图表标注和标线最大值:显示对应数据系列数据的最大值。 图表标注和标线最小值:显示对应数据系列数据的最小值。 图表标注和标线平均值:显示对应数据系列数据的平均值。
  • 坐标轴 坐标轴是指对图表组件,进行坐标系相关样式、颜色、位置和行为的设置。 图9 坐标轴 X轴 X轴:是否显示X轴。 X轴坐标轴类型:设置X轴坐标轴类型,支持连续数据、类目轴和时间轴。 坐标轴分割段数:设置X轴坐标轴段数。 最大值:X轴标签能显示的最大值。 最小值:X轴标签能显示的最小值。 坐标轴名称:设置X轴坐标轴显示名称。 坐标轴名称字体:坐标轴字体、颜色、大小等设置。 刻度标签旋转的角度:设置刻度标签旋转的角度。 轴线显示:是否显示轴线。 刻度显示:是否显示刻度线。设置为显示时,支持设置线的颜色。 刻度标签字体:设置标签的字体、颜色和大小等。 网格线是否显示:是否显示网格线。设置为显示时,支持设置线的类型和颜色。 Y轴 Y轴:是否显示Y轴。 Y轴坐标轴类型:设置Y轴坐标轴类型,支持连续数据、类目轴和时间轴。 最大值:Y轴能显示的最大值。 最小值:Y轴能显示的最小值。 坐标轴名称:设置X轴坐标轴显示名称。 坐标轴名称字体:坐标轴字体、颜色、大小设置。 轴线显示:是否显示轴线。 刻度显示:是否显示刻度线。设置为显示时,支持设置线的颜色。 刻度标签字体:设置标签的字体、颜色和大小。 网格线是否显示:是否显示网格线。设置为显示时,支持设置线的类型和颜色。
  • 配置 在配置中,设置组件的全局样式、表头设置、行、序列号等。 图6 配置 全局样式 背景色:设置表格的背景颜色。 表格行数:设置当前表格可视高度展示的数据行数。 边框:设置表格的边框样式。 表头设置 溢出文本:设置表格中超长文本的显示样式,如显示为省略号和换行显示。 表头对齐方式:设置表头的对齐方式,如左对齐、居中或右对齐。所有列的表头对齐方式同步修改。 表头行高占比(%):设置表头行高的占比。 表头背景色:设置表头的背景颜色,所有列的表头背景色同步修改。 表头字体:设置表头字体,所有列的表头字体同步修改。 边框:设置表头的边框样式。 行配置 奇行背景色:设置奇数行数据的背景颜色。 偶行背景色:设置偶数行数据的背景颜色。 单元格 溢出文本:设置表格中超长文本的显示样式,如显示为省略号、换行显示和滚动显示。 内容对齐方式:设置单元格内的内容对齐方式,如左对齐、居中或右对齐,所有列的内容对齐方式同步修改。 内容字体:设置单元格的内容字体,所有列的内容字体同步修改。 边框:设置单元格的边框样式。 序列号:表格中序列号设置。 序列号:设置表格中是否显示序列号,默认为关闭。 序列名:设置序列号的名称。 列宽占比:设置序列号在表格中的列宽占比。 背景色:设置序列号的背景颜色。 半径:设置序列号的半径。 圆角:设置序列号圆角,0为直角。 字体:设置序列号的字体、大小和颜色等。 轮播 轮播:是否开启轮播功能。开启后,支持设置轮播速度。 轮播速度:设置轮播速度。 分页 后台分页:数据接入有行数上限(当前为500行),超出行数后原来的方式无法动态获取所有的数据,此时可以使用后台分页功能,将表格分页显示。后台分页使用示例,请参见如何使用高级表格的后台分页功能。 行高:设置分页的行高,单位px。 单页数量:设置每页显示数据条数,以“,”隔开。 文本位置:设置分页文本显示位置,支持靠左、靠右和居中显示。 背景色:设置分页背景颜色。 字体:设置分页的字体、大小和颜色等。 选中框颜色:设置选中分页时边框的颜色,包括每页/条的边框、选中当前页的填充色边框和前往第几页的边框。 分页框宽度:设置分页框的宽度,单位为px。 下拉框背景颜色:设置下拉框的背景颜色。 下拉框字体颜色:设置下拉框的字体颜色。 下拉框选中态背景颜色:设置下拉框选中态的背景颜色。 下拉框选中态字体颜色:设置下拉框选中态的字体颜色。 下拉框鼠标悬浮时背景颜色:设置下拉框鼠标悬浮时的背景颜色。 下拉框鼠标悬浮时字体颜色:设置下拉框鼠标悬浮时的字体颜色。 新增条件格式:单击“新增条件格式”,可增加条件格式。如图7中所示,该设置表示版本问题数列满足设置的条件(大于2200)时,门禁结果列显示为红色,否则显示为正常颜色。 高级表格的条件格式,只有在关联关系以及响应数据列是单行文本和数字类型时才会生效。 图7 新增条件格式
  • 图形 图形是指组件中,实现数据可视化的具体图形表达元素,例如饼图的扇区、柱状图的柱子、折线图的线条、拐点等。 图8 图形 统一配置 图标选中色:设置选中后台排序、后台筛选时,图标的显示颜色。 图9 选中后图标颜色 列自适应:开启后,表格中的列会根据内容自适应。 固定列:设置首列和尾列的样式。当开启“列自适应”后,不支持设置固定列样式。 后台排序:是否开启后台排序功能。开启后,在预览表格时会显示下图中的图标,用于对表格中的数据进行排序。后台排序的使用示例,请参见如何使用高级表格的后台排序功能。 图10 在后台对数据进行排序 后台筛选:是否开启后台筛选功能。开启后,在预览表格时会显示下图中的图标,用于对表格中的数据进行筛选。后台筛选的使用示例,请参见如何使用高级表格的后台筛选功能。 图11 在后台对数据进行筛选 数据系列:数据系列是一个数组,通常包含多个系列,即通过一个或多个系列配置循环渲染。 图12 数据系列 在数据系列中,拖动某一个系列可以和其他系列组成一个层级,最多支持3层。 图13 新建层级 原数据名:原始数据中默认的系列名称,可通过设置“列名”,进行修改。文字内容来源于数据模型的取值,如名称、门禁结果等。 类型:选择数据的类型,可选单行文本、多行文本、数字、趋势、图片、迷你柱状图、迷你折线图和迷你进度条。不同的类型,展示的参数所有不同,请以界面实际显示的为准。选择迷你柱状图和迷你折线图时,支持放大图表显示。 图14 开启迷你柱状图放大图表功能 图15 预览放大效果 列名:自定义图表中数据系列的显示名称。 数据系列:在图表中,是否显示数据系列。例如,名称系列中,单击开启,图表中将会显示名称这列,如果关闭,将会隐藏掉该列。 合并同类:开启后,对每列内连续且相同内容的单元格进行合并。 后台排序:是否开启后台排序功能。开启后,在预览表格时会显示下图中的图标,用于对表格中的数据进行排序。 图16 开启后台排序 后台筛选:是否开启后台筛选功能。开启后,在预览表格时会显示下图中的图标,用于对表格中的数据进行筛选。 图17 开启后台筛选 列宽占比(%):设置对应系列在图表中的占比。 表头对齐方式:设置表头的对齐方式,如居中、左对齐等。 表头背景色:设置表头的背景颜色。 表头字体:设置表头的字体、颜色和大小等。 内容对齐方式:设置表格内容的对齐方式,如居中、左对齐等。 内容字体:设置表格内容的字体、颜色和大小等。
  • 卡片 卡片是指包裹图表组件的外层架构,可以理解为组件由卡片中基础元素(卡片标题、图表、卡片背景、卡片边框)和图表元素构成。 图3 卡片 卡片装饰:卡片装饰设置,可根据自身的业务需求选择不同的卡片样式。单击“清除样式”,可清除已设置的装饰样式。 背景 背景色:设置组件卡片的背景颜色。 边框:组件卡片边框设置,支持无边框、全边框和角边框三种样式。设置为全边框和角边框时,支持设置组件外圈边框的线型、圆角等。 样式:选择图片时,图片显示的样式,支持普通、居中、拉伸和平铺四种样式。 选择图片:使用本地的图片作为组件背景,支持新增目录和子目录,便于对图片进行分类管理。推荐使用JPG、JPEG、PNG或GIF格式的图片,且每张图片不能超过50MB。 特效:组件是否高亮显示,支持默认展示和跳转到页面时展示。 边距:组件中图表距离整个组件四边(上、下、左、右,如图2)的距离,默认为0,即铺满整个组件。 标题设置 标题:是否显示组件标题。 标题内容:输入标题内容。 标题行高度:设置标题的行高,单位px。 背景色:设置标题背景色。 文本位置:设置标题中文本位置,支持居中、靠左、靠右或自定义。 字体:设置标题的字体、大小和颜色等。 表格操作 列显示/隐藏:在运行态是否可以设置显示/隐藏的列。开启“列显示/隐藏”后,可以设置“悬浮显示”、“图标色”和“图标选中色”。 图4 列显示效果 表格导出:是否开启表格导出功能。开启表格导出后,可以设置“悬浮显示”、“图标色”和“图标选中色”。 图5 导出开启效果 悬浮显示:开启后,鼠标移动到表格组件上时,才会显示对应的按钮。 图标色:设置按钮的图标颜色。 图标选中色:设置选中按钮时,按钮图标的颜色。
共100000条