第三章：洞察数据脉搏—— 搭建可视化仪表盘

很多时候，对于一位部门或者公司高层来说，他们每天关心的不是具体的数据，而是更宏观的问题：

• “我们研发部的人力资源负荷是不是太高了？他们的请假总时长是多少？”
• “今年上半年新员工的入职趋势如何？是否有波动？”
• “所有已批准的请假中，哪种类型（年假、事假、病假）占的比例最高？”
• “各个部门的员工数量是否合理？”

如果回答这些问题还需要您手动从数据表中导出 Excel，再进行计算和绘图，那么您的应用依然不够智能。

织信的仪表盘模块，就是为您的应用配备的“智能驾驶舱”和“业务雷达”。它的核心使命是将您的数据表中存储的海量信息，通过各种卡片组件（如折线图、饼图、统计数字）转化为实时、直观、可交互的视觉信号。管理者只需打开看板，就能一目了然地掌握全局运营状况，从而实现数据驱动的决策。

在本章中，我们将实践如何将【员工表】中的数据，转化为一个专业的 “人力资源看板”。

3.1 核心概念：仪表盘的“拼图”艺术与数据智慧

仪表盘本身不存储数据，它只是数据的展示工具。它从数据源中提取、计算并展示结果。

一个仪表盘由许多不同类型的卡片组成，这些卡片就是您用来展示数据的“积木”和“展品”。

1. 卡片种类繁多： 织信提供了多达 25 种类型的卡片，涵盖了几乎所有业务场景的需求：
   • 图表类（Chart）： 折线图、柱状图、饼图、雷达图、漏斗图等 11 种类型，用于趋势分析、比例展示和多维比较。
   • 数据型（Data）： 统计数字、数据表、透视表，用于突出关键指标和展示详细数据。
   • 控件型（Control）： 富文本（用于展示说明或标题）、倒计时、按钮等，用于页面布局和增强交互。
   • 容器型（Container）： 标签页、折叠面板等，用于组织复杂的卡片组。
2. 网格布局（Layout）： 仪表盘的布局采用了灵活的 24 列网格布局。您可以像玩拼图游戏一样，拖拽和调整卡片的大小和位置，精确控制它们在页面上占据的宽度（最多 24 列）和高度，实现专业、美观的排版。

3.2 仪表盘的核心能力来源：聚合查询

1. 为什么需要聚合查询？—— 从回答“有多少”到“是多少”

在仪表盘设计中，我们最基础的需求是了解数据的数量。例如，我们通过图表来回答：

• “每个部门有多少人？”
• “每个销售签了多少单？”

而在深入的业务管理中，管理者往往更关心数据背后的价值。他们会提出更深刻的问题：

• 销售总监想问：“这个月，每个销售团队的销售额总和分别是多少？”
• HR 总监想问：“公司各个部门的平均薪资水平是怎样的？”
• 项目总监想问： “在所有已完成的项目中，哪个项目的花费最高？”

这些问题，它们需要在具体数据上进行求和、求平均、找最大/最小值等复杂的数学计算。

聚合查询，正是为了同时满足从“计数”到“计算”这一系列分析需求而设计的强大功能。它让你的仪表盘，能够从多个维度、多个层次去分析和洞察业务。

2. 什么是聚合查询？

聚合查询 是一种数据处理方式。它的核心思想分为两步：

1. 分组 首先，系统会根据你指定的维度，将数据“分门-别类”。这个维度就是我们之前在图表中设置的“维度”字段，例如，按“部门”分组、按“销售人员”分组。
2. 聚合 : 接着，系统会对每一个分组内的数据，进行一次“汇总”计算。

“汇总”计算的常见类型包括：

聚合类型	名称	说明	场景举例
数量	Count	最基础的聚合，计算每个分组中有多少条数据记录。	计算每个部门的“员工人数”。
求和	Sum	将分组内所有记录的某个数值字段的值相加。	计算每个部门所有员工的“薪资”总额。
平均值	Average	计算分组内所有记录的某个数值字段的平均数。	计算每个部门的员工平均“年龄”。
最大值	Max	找到分组内所有记录的某个数值字段中的最大值。	找出每个销售区域中，金额最高的一笔订单是多少。
最小值	Min	找到分组内所有记录的某个数值字段中的最小值。	找出每个供应商提供的物料中，最低的报价是多少。

总结来说：聚合查询就是 “先分组，再汇总”。它让你能够根据业务需求，选择最合适的汇总方式（从计数到复杂的计算），从而获得更具洞察力的分析结果。

3. 具体的企业管理例子

让我们看几个在公司管理中，不同聚合查询如何协同发挥作用的场景：

• 场景一：销售业绩分析
  • 数据表：【订单表】，包含字段：销售人员, 订单金额, 签约日期。
  • 基础分析 (计数)：按销售人员分组，聚合方式选择 数量，可以得到“每个销售的订单数量排行榜”。
  • 进阶分析 (求和/平均值)：
    • 按销售人员分组，聚合方式选择 求和 订单金额字段，可以得到“个人业绩总额排行榜”。
    • 按销售人员分组，聚合方式选择 平均值 订单金额字段，可以分析“个人平均客单价”。
• 场景二：人力资源分析
  • 数据表：【员工表】，包含字段：所属部门, 薪资。
  • 基础分析 (计数)：按所属部门分组，聚合方式选择 计数 ，可以得到“各部门人数分布图”。
  • 进阶分析 (求和/平均值)：
    • 按所属部门分组，聚合方式选择 平均值 薪資字段，用于分析和调整“各部门的平均薪酬水平”。
    • 按所属部门分组，聚合方式选择 求和 薪資字段，可以得到“各部门的人力成本预算”。

通过以上介绍，相信您已经理解，聚合查询是一个包含了从“计数”到“求和”、“平均值”等多种计算方式的强大工具集。掌握它，您将能够解锁仪表盘的真正潜力，让数据说话，为决策赋能。

3.3 实践：创建「人力资源看板」模块

现在，让我们开始动手，为“员工信息管理系统”创建一个名为 【人力资源看板】 的仪表盘模块。

1. 创建模块： 在应用设计器中，点击左侧菜单栏 “模块设置” 旁的 + 号，选择创建 【仪表盘】 模块。

2. 命名： 命名为 【人力资源看板】。

   

现在，您进入了一个空白的仪表盘设计画布。

我们将添加三种不同类型、但都对 HR 管理至关重要的卡片。

3.3.1 卡片一：员工总数（统计数字卡片）

目的： 用醒目的数字展示最关键的指标——公司总人数。

1. 选择卡片类型： 点击 “创建卡片”，选择 【统计数字】 类型。

   

2. 数据配置（查询与计数）：

   • 数据表： 选择 【员工表】。
   • 开启聚合查询： 必须开启，因为我们需要对记录进行计算。
   • 聚合列： 因为我们是统计记录的数量，所以并不需要对数据进行分组，因此可以任选一个字段，选择聚合函数为 “数量” 即可。

   

3. 样式优化：

   • 在 【设置项】 中，输入 “名称”，例如“在职员工总数”。
   • 设置 “单位”，例如输入 “人”。
   • 选择一个亮眼的 “颜色”，让这个关键数字在看板中脱颖而出。

3.4.2 卡片二：部门人数分布（饼图）

目的： 直观展示不同部门在公司总人数中的占比。

1. 选择卡片类型： 点击 “新增卡片”，选择 【图表】 类型。

2. 数据配置：

   点击新增数据源，为图表添加一个数据源。

   • 数据表： 选择 【员工表】。
   • 开启聚合查询：
     • 分组字段： 选择 “所属部门” 字段（这是我们的分类维度）。
     • 聚合列： 选择 姓名字段的 “数量”（统计每个部门的人数）。

3. 图表配置：在 【图表】 标签页中新增图表，类型选择饼图，我们就会看到数据源自动被使用，点击保存即可。

   

3.4.3 卡片三：员工年龄分布（柱状图）

目的： 帮助 HR 观察公司员工的年龄分布是否合理。

1. 选择卡片类型： 选择 【图表】 类型。

2. 数据配置（日期分组）：

   • 数据表： 选择 【员工表】。
   • 开启聚合查询：
     • 分组字段： 选择 “出生日期” 字段。
     • 分组粒度： 重点！您可以选择按“年”、“季”、“月”或“日”进行分组，以控制趋势的精细度。由于我们关注的是年龄，因此我们选择按 “年” 分组。
     • 聚合列： 选择 姓名的 “数量” 聚合方式。

3. 图表配置：在 【图表】 标签页中新增图表，类型选择柱状图，我们就会看到数据源自动被使用，点击保存即可

   

3.4.4 卡片排版

在您向“仪表盘”添加了多个卡片后，系统会将它们按照顺序摆放，导致页面布局混乱，不便于查看。

为了解决这个问题，织信的仪表盘编辑器提供了非常直观、灵活的拖拽功能，让您可以像整理桌面一样，轻松调整每一个组件的大小和位置。

1. 调整组件位置

您可以将任何一个组件移动到画布上的任意位置。

• 操作方法：
  1. 将鼠标指针移动到您想要移动的组件上。
  2. 当鼠标指针变为 十字箭头图标时 ，按住鼠标左键不放。
  3. 拖动鼠标，您会看到该组件会跟随您的鼠标移动。
  4. 将其拖拽到您期望的目标位置后，松开鼠标左键即可。
• 对齐提示：在拖动过程中，您会注意到画布上有背景网格。组件会自动吸附到网格线上，并且当组件的边缘与其他组件对齐时，通常会出现辅助线。善用这些功能，可以帮助您快速实现组件的整齐排列。

2. 调整组件尺寸

您可以自由地放大或缩小每个组件，以适应其内容展示的需要。例如，指标卡通常较小，而趋势图或数据列表则需要更大的空间。

• 操作方法：
  1. 将鼠标指针移动到组件的边框右下角。
  2. 当鼠标指针变为双向斜箭头图标时，按住鼠标左键不放。
  3. 向外拖动可放大组件，向内拖动可缩小组件。
  4. 调整到满意的尺寸后，松开鼠标左键即可。

最后，请务必记得：完成所有布局调整后，点击页面上方的保存布局按钮，为HR 专员角色添加查看本仪表盘的权限，然后发布您的应用，这样角色为HR 专员的用户才能看到您精心设计的仪表盘新面貌。

3.5 高级功能实践：让仪表盘实现智能交互

静态的图表只是信息板，而可交互的仪表盘才是真正的“驾驶舱”。织信支持复杂的卡片交互和数据联动。

3.5.1 实现数据联动：全局过滤参数

我们希望在看板顶部设置一个筛选器，用户选择后，看板中的所有图表都能同步刷新数据。

1. 创建过滤参数（Filter Parameter）：
   • 进入仪表盘设计界面的 【过滤添加】 页签。
   • 创建过滤条件，命名为 “筛选部门” 。
   • 将参数类型设置为 “关联记录”，并关联到 【部门表】。

1. 将参数应用到卡片：

   • 来到 “员工出生人数” 的数据源设置界面。
   • 找到 “过滤器”（过滤器）设置项。
   • 添加查询条件：所属部门 等于 ，然后点击输入框右侧箭头进入表达式编辑器，在表达式编辑器里面选择刚才新建的查询条件。
   • 因为我们希望没有选择过滤器时，默认显示所有数据，所以请在过滤器条件后面勾选忽略空值，如下图。

   

   • 保存卡片，并对其他卡片重复此操作。

效果： 这样，仪表盘顶部的“筛选部门”下拉框就具备了全局控制力。用户在其中选择“市场部”后，卡片一（员工总数）、卡片二（部门人数）、卡片三（出生年龄）都将只显示市场部相关的数据，实现了高效的数据联动。

3.5.2 数据钻取：从图表到数据记录

数据钻取（Data Drilling） 是指用户点击图表的一个元素（例如饼图的一个扇区、柱状图的一个柱条）后，系统能够跳转并展示该元素背后的详细数据记录（请注意，此功能需要您先掌握自动化 | 织信低代码平台开发文档的使用，自动化属于织信相对高阶的功能用法，您可以在未来了解自动化的知识后再回来来进行本操作）。

1. 配置卡片事件：
   • 双击 “部门人数饼图” 卡片，进入配置界面，找到 【事件】 标签页。
   • 选择事件： 织信支持 单击后调用自动化（点击后调⽤⾃动化） 和 双击后调用自动化（双击后调⽤⾃动化）。
2. 设计自动化逻辑：
   • 新建一个自动化程序，该程序将执行 “打开数据表记录列表” 步骤。
   • 关键：传递参数。 在自动化步骤中，您需要配置它接收用户点击时传递过来的 部门名称 变量。
   • 筛选列表： 在 “打开数据表记录列表” 步骤的参数配置中，设置过滤条件：所属部门 等于 [点击事件传入的部门名称]。

效果： 经理点击饼图中“研发部”的扇区时，系统不会跳到新的页面，而是在当前页面弹出一个窗口，展示所有属于研发部的员工的详细列表数据。这种体验极大地提升了用户分析数据的效率。

3.5.3 样式美化与主题风格

仪表盘的样式直接影响用户体验。您可以在 【卡片设置】 中统一调整所有卡片的 标题、边框、背景 等方方面面的具体样式。