> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 基础指标卡

> 该页面介绍了指标卡组件的不同版本功能对比，包括免费版、轻享版、专业版和专属版。同时详细说明了如何使用指标卡组件展示关键业务数据，如销售数量、销售金额等，并提供了配置数据集、选择图表展示字段（指标及辅助指标）、样式设置的具体步骤。还提到了一些扩展阅读材料以供进一步学习。

| **能力** | **免费版** | **轻享版** | **专业版** | **专属版** |
| ------ | ------- | ------- | ------- | ------- |
| 指标卡组件  | 支持      | 支持      | 支持      | 支持      |

## 1. 简介

### 1.1 功能简介

您可以通过【指标】和【图标】的设置，显示关心的指标值与图标展示并支持图标点击下钻，

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1625926629249-ca2ef31a-eb38-4a9a-8659-fad4b2dfc6f7.png)
</Frame>

亮点：可以自行控制组件的大小，但无法移动指标卡的位置（靠左、居中、靠右）

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640139205228-6e47fbb5-bf50-4107-8609-e89784eee1bd.png)
</Frame>

### 1.2 使用场景

比如展示销售数量量、销售金额等指标数值

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1625926629249-ca2ef31a-eb38-4a9a-8659-fad4b2dfc6f7.png)
</Frame>

### 1.3 基本要求

| **指标**     | **辅助指标**   | **指标字段类型**                 |
| ---------- | ---------- | -------------------------- |
| 必填，最多30个字段 | 选填，最多30个字段 | 必须是聚合字段<br />公式内字段也需要为聚合字段 |

## 2. 操作步骤

### 2.1 选择组件，配置数据集

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640152132005-172655d8-e6ad-457f-a25c-fae46a8ca715.png)
</Frame>

添加数据集

### 2.2 选择图表展示字段（指标及辅助指标）

**指标**：数据的总值，支持聚合

**辅助指标**：选填，支持聚合

**可以直接选择数据集下的字段，也可以通过公式生成，如何使用公式请查看**[**报表公式**](/zh/yida/form/yrofmw)

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640152229041-bb7e36d2-24c1-4470-b8b7-9e780a0813c5.png)
</Frame>

选择数据

#### 2.2.1 辅助指标

辅助指标和 [**2.0报表指标卡**](https://docs.aliwork.com/docs/yida_support/yida_qalist/yxgxg6/izt5u6) 同比字段效果一致，用来显示关心的某一个指标值的变化趋势，例如：需要展示今天提交的数量和昨天提交的进行比较，可参考如下步骤配置：

* 指标字段配置数量，辅助指标选择表单中的日期字段

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640570601775-6f50ffd3-03ca-4c4a-9789-597d3e8f7b1e.png)
</Frame>

* 设置条件过滤，只展示今天的数据

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640154356916-35586928-8fdf-4b2d-a73d-e4872eb1c841.png)
</Frame>

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640571877918-24bf6fa0-4c3e-4918-80ea-b3632314e6b0.png)
</Frame>

* 配置时间偏移，偏移量可根据自己场景需求选择对应的时间段

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640571936067-2de671cb-f289-4608-bd87-8e832b611b10.png)
</Frame>

* 指标配置，字段选择辅助指标的日期字段，显示值可选择相差百分比、原始值、相差绝对值。

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640571974620-5d3c379d-9a07-45cb-8d37-7c1888502d24.png)
</Frame>

* 最终效果对比

### ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572020692-4e0f6a81-d532-4739-bc3d-f8a7e666fd04.png)

注：指标字段和辅助字段只能其中一个设置时间偏移，不能同时进行设置，若同时配置会报错，如下图所示：

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572051366-22a4c494-9180-482d-a3ca-93c80cec3265.png)
</Frame>

### 2.3 样式设置

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1635316023270-0f1444ff-cc67-4672-836c-0e61af7074be.png)
</Frame>

样式设置

* 侧边条 ：支持开启
* 边条颜色 ：支持设置

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572184786-8948db46-0356-4bcf-9ff9-c6a67806f296.png)
</Frame>

设置侧边条

* 尺寸 ：大指标卡与小指标卡两个选项，自动变更指标卡的大小
* 指标字号 ：正常与大，自动变更指标卡内字体的大小

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572222863-c15f2b55-f997-418e-ab62-4c9813aa04e5.png)
</Frame>

指标卡的尺寸及字体大小

* 每行列数 ：指的是一行内容展示几个字段，默认为 4，支持调整

举例：我在数据页面的指标选择了三个字段进行数据展示，在样式设置这里限制了每行列数为 2 ，所以一行就有两个字段，那么多出来的一个字段就会在第二行展示，如图：

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572278368-fe52bae3-3ac3-4fc8-bc1a-ab870471fd5b.png)
</Frame>

每行列数效果

* 最大高度 ：调整指标卡整体的高度
* 气泡位置 ：需要先配置字段的指标配置才会有该气泡出现，如图：

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572535131-0ccea8bd-1d24-4776-b431-cedcc42bb6d7.png)
</Frame>

指标配置

最后效果图：

<Frame>
  ![](https://yida-support.oss-cn-shanghai.aliyuncs.com/static/png/1640572557722-00db1de4-a75f-43e0-b57f-9c2b495dadca.png)
</Frame>

## 3. 更多信息

[其他设置](/zh/yida/report/qpdzl5)

## 4. 扩展阅读

[人事行政实践案例 — 员工管理系统集成工作台](https://docs.aliwork.com/docs/yida_support/yida_qalist/_1/_1/wzobdp)

[如何在报表的一个组件中展示两张表的数据？](https://www.yuque.com/yida/subject/xn3uby#SXM9W)
