Eu tenho uma matriz de estruturas JSON aninhadas onde eles têm profundidade variável e não o mesmo conjunto de chaves em todos os lugares:

[
    {
        "name":"bob",
        "salary":10000,
        "friends":[
            {
                "name": "sarah",
                "salary":10000
            },
            {
                "name": "bill",
                "salary":5000
            }
        ]
    },
    {
        "name":"marge",
        "salary":10000,
        "friends":[
            {
                "name": "rhonda",
                "salary":10000
            },
            {
                "name": "mike",
                "salary":5000,
                "hobbies":[
                    {
                        "name":"surfing",
                        "frequency":10
                    },
                    {
                        "name":"surfing",
                        "frequency":15
                    }
                ]
            }
        ]
    },
    {
        "name":"joe",
        "salary":10000,
        "friends":[
            {
                "name": "harry",
                "salary":10000
            },
            {
                "name": "sally",
                "salary":5000
            }
        ]
    }
]

Eu queria usar o D3 para renderizar isso como tabelas html aninhadas. Por exemplo, a coluna de amigos terá tabelas mostrando o nome e o salário dos amigos do indivíduo mencionado na linha. Às vezes, uma dessas tabelas terá outro nível de sub-tabela.

Eu imagino que a maneira de fazer isso é criando tabelas recursivamente. Eu escrevi um programa python que usa uma estrutura JSON como essa, e renderiza tabelas dentro de tabelas, e a maneira mais fácil de fazer isso foi recursivamente. Eu vejo na documentação do d3.js há um.each() coisa que você pode chamar, o que eu tenho certeza é o que eu preciso, eu só preciso de um pequeno impulso para chegar lá (https://github.com/mbostock/d3/wiki/Selections#wiki-each).

Então, há uma maneira legal de fazer isso no D3? Eu encontrei este ótimo exemplo para renderizar uma matriz 2D de dados como uma tabelaCriando uma tabela vinculada a um arquivo csv. Com esse tutorial, consegui obter o nível mais externo dessa estrutura de dados renderizada como uma tabela, mas estou preso a como entrar em níveis recursivamente conforme necessário, a partir de agora eles apenas aparecem como "Objeto" na tabela desde que eu não estou tratando-os de forma diferente das cordas e números normais.

Também encontrei esta outra pergunta / resposta que é semelhante à minha pergunta, mas eu realmente não entendo bem o javascript para ver onde / como a recursão está acontecendo e readapt a solução para atender às minhas necessidades:Como faço para processar dados aninhados em vários níveis no D3?. Qualquer conselho ou ponteiros para tutoriais no processamento recursivo ou iterativo de uma árvore aninhada como estruturas de dados JSON no D3 seria muito apreciado!