Estoy tratando de modificar este ejemplo para mis propósitos: https://observablehq.com/@d3/grouped-bar-chart

Pude hacerlo en Observable y Javascript simple. Sin embargo, estoy usando React y TypeScript en mi proyecto personal y no sé cómo funciona el parámetro de la función de doble flecha.

Es decir, ¿Qué significa:

 GroupedBarChart(stateages, { x: d => d.state, ....

y entonces:

 x = (d, i) => i, const X = d3.map(data, x);

aquí hacer exactamente?

En el primero, selecciono el atributo de estado de cada punto de datos

pero luego, de cada punto de datos (?) Selecciono el índice numérico.

¿Cómo escribiría esto de manera concisa sin usarlo como parámetro en la llamada a la función?

d3.map(data.state, (d, i) => i) sin suerte.

¡Muchas gracias por los consejos y sugerencias que puedas dar!