# from d3.group to a map with merged keys

**URL:** <https://talk.observablehq.com/t/from-d3-group-to-a-map-with-merged-keys/2938>\
**Category:** Feedback\
**Created:** [March 13, 2020, 10:06pm UTC](https://talk.observablehq.com/t/from-d3-group-to-a-map-with-merged-keys/2938 "2020-03-13T22:06:50Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![maliky](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/maliky/32/706_2.png) [@maliky](https://talk.observablehq.com/u/maliky)\
**Post date:** [March 13, 2020, 10:06pm UTC](https://talk.observablehq.com/t/from-d3-group-to-a-map-with-merged-keys/2938/1 "2020-03-13T22:06:50Z")

</div>

Is there a way to get a map with merged keys from a map of map, or from a map of map of map.

I’ve been playing with `d3.group(iterable, d=> d.key1, d=>key2)`, (merci @Fil for [this d3-group notebook](https://observablehq.com/@d3/d3-group) )  
my above `d3.group(...` produce a map like

```auto
{
    "foo" => {"Mon" => [obj1, obj2],
	      "Wed" => [obj3]},
    "baz" => {"Tue" => [obj4, obj5, obj6],
	      "Wed" => [obj7, obj8]},
 ...
}

```

Nice!  
But then how do I flatten it so I get this

```auto
{
    "foo-Mon" => [obj1, obj2],
    "foo-Wed" => [obj3],
    "baz-Tue" => [obj4, obj5, obj6],
    "baz-Wed" => [obj7, obj8]
    ...
}

```

I made this function to do the job

```auto
function upliftkey(res, [k, arr]) {
  return arr.reduce((acc, [nk, nv]) => Object.assign(res, ({[`${k}-${nk}`]: nv})), {})
}

```

That I use in a `reduce` like so `d3-array.groups(data, d=>d.key1, d=>d.key2).reduce(upliftkey, {})` . It’s ok, but my recursive attempt to flatten an aribtray number of nested group has fail.

So my question. Is it already in d3 ? and if not do you think it could be included ?

---

<div class="post-metadata">

**Author:** ![mbostock](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/mbostock/32/9_2.png) [@mbostock](https://talk.observablehq.com/u/mbostock)\
**Post date:** [March 13, 2020, 11:06pm UTC](https://talk.observablehq.com/t/from-d3-group-to-a-map-with-merged-keys/2938/2 "2020-03-13T23:06:03Z")

</div>

[_array_.flat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat) and [_array_.flatMap](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flatMap), two recent additions to JavaScript, are very useful for this sort of thing. (And they can be combined with [Array.from](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from) to flatten iterables such as maps.)

But the simplest thing in this case would be to change the key for d3.group,

```auto
d3.group(iterable, d => `${d.key1}-${d.key2}`)

```

which would generate the desired structure directly.

---

<div class="post-metadata">

**Author:** ![maliky](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.observablehq.com/maliky/32/706_2.png) [@maliky](https://talk.observablehq.com/u/maliky)\
**Post date:** [March 13, 2020, 11:07pm UTC](https://talk.observablehq.com/t/from-d3-group-to-a-map-with-merged-keys/2938/3 "2020-03-13T23:07:46Z")

</div>

> [@mbostock](#):
>
> `${d.key1}-${d.key2}`

Excellent. Thank you. I love it when something I think hard becomes easy. :o)