File tree Expand file tree Collapse file tree 1 file changed +23
-12
lines changed
site/docs/manual/core/data Expand file tree Collapse file tree 1 file changed +23
-12
lines changed Original file line number Diff line number Diff line change @@ -3,25 +3,34 @@ title: sort
33order : 2
44---
55
6- 对数据按照指定的 callback 进行排序。类似于 [ Array.prototypo.sort ] ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort ) 。
6+ ## 概述
77
8- ## 开始使用
8+ 对数据按照指定的 callback 进行排序。类似于 [ Array.prototypo.sort] ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort ) ,G2 实现 ` sort ` 的时候有两个改动点:
9+
10+ 1 . JavaScript 中的 sort 函数是会修改原始数组的,在 G2 中改成了 immutable 的写法,防止修改原数组。
11+ 2 . 如果传入的数据不是数组,那么不会对数据进行任何处理,比如在绘制一些关系图的时候,` data ` 一般是 ` object ` 类型,这个时候,sort 功能失效,返回原数据。
12+
13+ ## 使用方式
14+
15+ ` sort ` 用于对数据排序,例如在饼图、排行榜条形图中,需要按照数据从大到小排列,便于更好的看清楚 TOP N 的数据项。
916
1017``` ts
1118const data = [
1219 { a: 1 , b: 2 , c: 3 },
1320 { a: 4 , b: 5 , c: 6 },
1421];
1522
16- chart .data ({
17- type: ' inline' ,
18- value: data ,
19- transform: [
20- {
21- type: ' sort' ,
22- callback : (a , b ) => b .a - a .a ,
23- },
24- ],
23+ chart .options ({
24+ data: {
25+ type: ' inline' ,
26+ value: data ,
27+ transform: [
28+ {
29+ type: ' sort' ,
30+ callback : (a , b ) => b .a - a .a ,
31+ },
32+ ],
33+ }
2534});
2635```
2736
@@ -34,7 +43,9 @@ chart.data({
3443];
3544```
3645
37- ## 选项
46+ 注意:` sort ` 数据变换是在 ` data.transform ` 中的,在 data 配置简写的情况下是无法配置 transform 的。
47+
48+ ## 配置项
3849
3950| 属性 | 描述 | 类型 | 默认值 |
4051| -------- | -------------------------------------------------- | ---------------------------- | ------------- |
You can’t perform that action at this time.
0 commit comments