[Solved]-d3 Grouped Chart 1st level not looping-d3.js

Your transform function should return a string, but the curly braces are confusing the arrow function...

> (d => "Hello, " + d)("World!")  // without braces
'Hello, World!'

> (d => {"Hello, " + d})("World!")  // with braces
undefined

> (function(d) {return "Hello, " + d;})("World!")  // function
'Hello, World!'

I suspect the arrow function is trying to build an object to return, but the syntax is wrong (no key: val pair) -- so it's returning undefined instead. If you remove the curly braces, or use a function, it should work as expected.