d3.js 如何使用reverse将d3.nest更改为group

o2g1uqev  于 2022-11-12  发布在  其他
关注(0)|答案(1)|浏览(143)

我正在尝试更新D3 v5的一些旧代码,以使用更新的组命令。我不熟悉排序,Map的方法,但我已经重写了它的一部分,但我不知道如何复制反向功能。
以下是原文:

const years = d3.nest().key(d => d.date.getUTCFullYear()).entries(dateValues).reverse();

对于D3 v7,我已经做到了这一点:

const years = d3.group(dateValues, d => d.date.getUTCFullYear());

但是,我仍然需要修改数组结构,以重复使用.reverse()时发生的情况。
group函数将其保留为:

Map(10) { 2010 → (276) […], 2011 → (365) […], 2012 → (366) […], 2013 →
(365) […], 2014 → (365) […], 2015 → (365) […], 2016 → (366) […], 2017 → (365) […], 2018 → (365) […], 2019 → (103) […] }

而原来的next和reverse将其作为键和值的数组

Array(10) [ {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…} ]

0: Object { key: "2019", values: (103) […] } ​ 

1: Object { key: "2018",values: (365) […] } ​ 

2: Object { key: "2017", values: (365) […] } ​

3: Object { key: "2016", values: (366) […] } ​ 

4: Object { key: "2015", values: (365) […] }

5: Object { key: "2014", values: (365)[…] } ​ 

6: Object { key: "2013", values: (365) […] } ​ 

7: Object { key: "2012", values: (366) […] }

8: Object { key: "2011", values:(365) […] }

9: Object { key: "2010", values: (276) […] }

如果我没有使用正确的术语,请提前向我道歉,但我不经常使用JS或D3。谢谢。
编辑:数据为json格式,示例:

[{
    "Date": "2017-08-30",
    "AnswerCount": "9510"
},
{
    "Date": "2010-05-23",
    "AnswerCount": "2096"
},
{
    "Date": "2014-01-10",
    "AnswerCount": "11451"
},
{
    "Date": "2019-03-23",
    "AnswerCount": "4393"
},
{
    "Date": "2013-03-07",
    "AnswerCount": "11811"
}
]

编辑:这样做可以使它更接近原始结构:

var year_map = d3.group(dateValues, d => d.date.getUTCFullYear());
            var years=Array.from(year_map);
            years.reverse();

然而,它不是在关键:价值观的结构

Array(10) [ (2) […], (2) […], (2) […], (2) […], (2) […], (2) […], (2) […], (2) […], (2) […], (2) […] ]
​
0: Array [ 2019, (103) […] ]
​
1: Array [ 2018, (365) […] ]
​
2: Array [ 2017, (365) […] ]
​
3: Array [ 2016, (366) […] ]
​
4: Array [ 2015, (365) […] ]
​
5: Array [ 2014, (365) […] ]
​
6: Array [ 2013, (365) […] ]
​
7: Array [ 2012, (366) […] ]
​
8: Array [ 2011, (365) […] ]
​
9: Array [ 2010, (276) […] ]

其中,对象是一个对象数组,结构如下:

我如何在JS中使用Key和Values将其创建为对象数组?

gudnpqoy

gudnpqoy1#

将Map对象转换为数组(例如使用Array.from)后,只需反转并将其Map到所需的对象结构:

const years = Array.from(year_map).reverse().map(d => ({key: d[0], values: d[1]}));

您也可以使用reduce只循环数组一次,但这可能不是必要的。
以下是演示:
第一个

相关问题