图形排序的使用操作、排序设置和逻辑，基本和表格组件一样，表格组件排序功能说明详见：数据排序逻辑。

由于每种图形的展示效果和业务含义都不一样，所以本文主要是介绍，相对于表格组件，图形的排序功能有哪些区别和使用注意事项。

图形排序逻辑

图形排序示例

先用一个简单的图形排序示例展示排序功能，方便理解下文的排序逻辑。详细的排序操作说明详见：数据排序逻辑。

比如要按合同金额降序查看各行业的合同签约情况，此时在 合同金额 字段上设置 排序>组内降序，即可得到所需效果，设置方式如下图所示：

行区&列区的划分

对于上面的排序示例，我们可以看到在合同金额上设置的排序，是直接影响柱图X轴刻度标签的顺序，那如果在X轴、颜色等区域的字段上设置排序，这些排序设置又是影响哪里的顺序？

比如基于上述的排序示例增加新的要求：要按合同金额降序查看各行业的合同签约情况，且每个行业内的收入类型需按照 “服务、销售、维护” 顺序显示，两部分的排序顺序相互不影响，如下图所示：

所以在不同位置的字段上设置排序，就产生了排序影响区域的问题。

和表格的逻辑一样，当排序设置影响的是同一个区域时，会产生排序优先级；当排序设置影响的不是同一个区域，则两个排序设置互相不影响。那如何去定义图形的排序影响区域？

考虑到实现数据排序逻辑是在底层数据层处理，而组件类型（如图形、表格等）是应用层的概念，为了保证排序逻辑统一、简化排序相关概念，数据层排序走统一一套排序逻辑，所以统一使用 行区 和 列区 作为所有组件的排序影响区域的命名划分。

对于表格，有明确的行列区划分，且数据顺序相互不影响，排序影响区域用行区和列区作为区分，比较好理解；但对于图形，在界面上并没有明确区域映射关系。

所以对于图形组件的不同位置所属的区域和排序优先级，有以下的通用原则：

• 如果是 维度字段，且图形需要划分成两个独立区域设置排序的，则默认分类轴属于行区、标记区属于列区，具体图形的区域映射说明详见下面的表格。
• 不管是哪个区域，只要是在 度量字段 上设的排序，都默认影响 行区(分类轴) 的顺序。
• 不改变图形外观的设置，不支持设置排序，如“提示”等。不改变图形外观指的是比如是否细分数据、改变图形颜色等。
• 同一个区域有多个字段设置了排序时，则和表格一样，通常以在组件数据面板界面上位置更靠前的字段优先级更高。

针对上面第一点放 维度字段 的场景，下表详细说明每种图形类型的行列区映射关系。

特殊图形排序说明

1、旭日图受限于第三方组件的渲染逻辑，显示顺序只和类别名称有关，在旭日图上设置的排序，实际看不出排序变化。

2、漏斗图本身已隐含排序效果，在 大小 上设置的排序，实际看不出排序变化。

3、桑基图，当数据较多时，在字段上设置的排序，可能会看不出数据顺序变化，如下图所示：

原因是从数据层按排序设置取回数据后，前端渲染时ECharts会自动计算这些节点的最佳位置，使得整个图表既美观又能清晰地显示数据流的方向和量级。ECharts自动优化布局大概有以下方向：

• 节点间的连接关系：桑基图通过节点间的链接数量来确定各个节点的相对位置。
• 链接权重的影响：每个链接都有一个权重值（通常代表流量或容量），这个值会影响链接线的粗细以及布局优化时的考量。较大的权重可能会使得相关联的节点更靠近中心，以减少高流量路径上的交叉，从而提高图表的可读性。
• 最小化交叉：自动布局算法尝试最小化节点间链接的交叉，以保持图表清晰易读。这意味着具有更多连接或者更强连接（即更高的权重）的节点可能会被放置在更有利的位置上，以减少不必要的连线交叉。

如ECharts判断不需要优化，则按照字段数据排序顺序直接展示。

4、指标拆解树，当前版本在字段上并未开放排序入口，指标拆解树的排序本身是各个维度按指标值进行排序，需等未来 按其他字段值排序 的功能上线后，再开放排序入口。

图形排序场景示例

场景示例一：

要按合同金额降序整体查看各行业的合同签约情况，此时在 合同金额 字段上设置 排序>组内降序，即可得到所需效果，设置方式如下图所示：

X轴上的行业名称的顺序是按合同金额的值进行排序，不受颜色标记上的字段影响。

场景示例二：

业务人员按时间查看销售数据时，有特定的时间排序要求，比如先按年份升序，每年内再按季度降序看的销售额情况。要实现此排序效果，需要执行2步排序设置，操作说明如下：

1、此时先在在 年份 字段上设置 排序>组内升序，如下图所示：

2、再在 年季 字段上设置 排序>组内降序，即可得到所需效果，设置如下图所示：

此时X轴上先排年份，然后每年作为一个分组，组内每个季度按照季度降序排序。

场景示例三：

要按合同金额降序整体查看各行业的合同签约情况，且每个行业内的收入类型需按照 “维护、销售、服务” 顺序显示。要实现此排序效果，需要执行2步排序设置，操作说明如下：

1、先在 合同金额 字段上设置 排序>组内降序，如下图所示：

2、再在 收入类型 字段上设置 排序>高级排序，在 高级排序 弹窗中，按要求调整排序项的顺序，如下图所示：

3、点击 确定 ，即可得到所需效果，设置如下图所示：

此时X轴刻度标签的顺序和颜色块的顺序，是两个相互独立的区域，排序不相互影响。

新旧版本图形排序升级影响

2025年06月01日以前的版本（下文简称旧版本）和 2025年06月01日以后的V11版本（下文简称新版本）排序升级对比。

1、在度量上设置的排序影响范围变更：旧版本是影响所有维度的全局排序，新版本是仅影响行区的组内排序。下面通过详细的示例进行说明：

• X轴上有多个维度字段时，新旧版本效果对比如下：

• 行区和列区上各放一个维度时，新旧版本效果对比如下：

行区和列区的区域映射关系详见：行区&列区的划分。

2、划分行列区域后，行区和列区的排序相互不影响，新旧版本效果对比如下：

行区和列区的区域映射关系详见：行区&列区的划分。

3、新版本上针对不改变图形外观的设置上禁用了排序入口，比如 提示 等，旧版本升级后此位置的排序将失效，具体图形的禁用入口详见：图形排序区域划分。

4、受排序逻辑变更影响，输出行数截断结果会有变化。如果旧版本图形上设置了排序，且在组件属性设置中设置了 输出行数 ，若图形总的行数超过设置的输出行数时，升级到新版本后图形输出行数范围内的数据会发生变化。

原因是：旧版本是先按输出行数截断数据，再按排序设置对数据进行排序；新版本是在数据层先做好排序，再根据输出行数截断数据，所以会导致新旧版本最终呈现的数据有差异。