历史版本22 :试管型仪表盘 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

 1. 概述编辑

1.1 应用场景

试管型仪表盘像一个试管,有刻度和进度线,其中刻度表示度量,进度线表示完成的进度情况。

利用试管型仪表盘,可以直观地表现出某个指标的进度或实际情况,效果如下图所示:

Snag_a4d9c07.png

1.2 图表特点

优点:直观的表现出多个指标的进度或实际情况,主要用于进度或占比的展现。

缺点:不能根据时间类别分析数据,单个图表无法进行对比分析。

2. 属性介绍编辑

2.1 类型

以单元格元素或悬浮元素插入仪表盘后,可在右边属性面板的类型设置项下,选择试管型仪表盘,如下图所示:

2020-04-11_20-28-25.png

2.2 数据

试管型仪表盘数据绑定的详细介绍可以参见文档:图表数据

试管型仪表盘部分数据绑定形式有所不同,单独介绍:

  • 数据来源:可选择数据集数据和单元格数据两种。

  • 数据集:此处可选择数据查询、内置数据集、文件数据集等数据集。

  • 分类名称:此处可选择想要展示的关键指标。

  • 指针对应值:此处选择关键指标的数值。

2020-04-19_22-30-08.png

2.3 样式

试管型仪表盘样式设计的详细介绍可以参见文档:图表样式

1)试管型仪表盘的样式>系列有特殊设置,单独介绍:

  • 配色:可以切换试管型仪表盘的色彩搭配,目前有 8 种。

  • 排列方向:可以控制试管型仪表盘的方向,分为纵向和横向,默认为纵向

  • 指针:此处控制指针的颜色,默认为透明。

  • 刻度槽:此处控制试管的刻度槽背景颜色,默认为浅灰。

  • 长度设置:控制试管型仪表盘的长度,分为自动和固定两种类型。

  • 滑槽宽度:控制内部滑槽的宽度。

  • 刻度和配色:控制试管型仪表盘的刻度颜色。

Snag_257cea8c.png

2)试管型仪表盘的样式>标签有特殊设置,单独介绍:

标签的位置现在分为上下位置左右位置,默认标签在下方,且跟随指针显示。

Snag_258aace2.png

2)试管型仪表盘的样式>坐标轴有特殊设置,单独介绍:

  • 轴标签:可控制轴标签是否显示或隐藏。

  • 字符:可选择字体、字符、颜色、斜体、加粗等属性。

  • 自定义最小值:可定义坐标轴的最小值。

  • 自定义最大值:可定义坐标轴的最大值。

  • 自定义主刻度单位:可定义主刻度单位,可采用公式输入。

  • 自定义次刻度单位:可定义次刻度单位,可采用公式输入。

  • 主要刻度线:可配置主要刻度线颜色,默认为浅灰色。

  • 次要刻度线:可配置次要刻度线颜色,默认为浅灰色。

  • 轴标签格式:分为通用、自定义两种,默认为通用。

2020-04-20_19-33-59.png

2.4 特效

试管型仪表盘特效设置的详细介绍可以参见文档:图表特效

注:试管型仪表盘的特效设置项下没有条件显示。

3. 示例编辑

3.1 报表设计

3.1.1 数据准备

新建数据集 ds1,数据库查询语句如下:

select 类别名称,sum(库存量) as kc from 产品,类别

where 产品.类别ID=类别.类别ID and 类别名称!="日用品"

group by 类别名称

2020-04-11_20-41-50.png

3.1.2 组件设计

将试管型仪表盘拖拽到 body 组件中,调整图表位置,如下图所示:

Snag_a4fa38f.png

3.1.3 数据绑定

试管型仪表盘的数据绑定方法如下图所示:

2020-04-11_20-37-42.png

3.1.4 样式设计

试管型仪表盘的基本样式只需要改个标题,其余默认设置即可。

试管型仪表盘的样式-坐标轴需单独介绍:

1)选择自定义最小值、自定义最大值时,设置最小值为 0,最大值为 800,如下图所示:

2020-04-20_21-53-37.png

注:一定要配置自定义最小值、自定义最大值,如不配置,系统默认根据指针对应值最接近的整数来配置。

注:为使移动端效果更佳,建议将试管型仪表盘的样式>系列>方向,改为纵向。

3.2 效果预览

1)PC 端

保存报表,点击表单预览,效果如下图所示:

Snag_a4d9c07.png

2)移动端

1587892659231615.jpg

4. 模板下载编辑

已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\BasicChart\试管型仪表盘.frm

点击下载模板:试管型仪表盘.frm