Grafici a strati in d3.js

Question

Attualmente sto utilizzando Graphviz per visualizzare i grafici del flusso di controllo. Fondamentalmente, un grafico del flusso di controllo (riducibile) è un DAG più alcuni bordi che puntano ai nodi nei livelli precedenti. Gli ultimi bordi non dovrebbero influire sul posizionamento del nodo.

Attualmente, dot disegna i grafici in modo ordinato, ma manca un modo semplice per aggiungere l'interattività (ad esempio piegatura, scorrimento, zoom), che non ha prezzo per l'analisi di grafici molto grandi. Pertanto, ho selezionato d3.js come libreria di grafi più matura e ricca di funzionalità.

Sono abbastanza sicuro che c'è un modo semplice per disegnare layered graphs (come fa dot) in d3.js, ma non mi sembra di riconoscerlo. Come lo faccio? Se questo aiuta, eseguo già l'analisi del dominatore sul mio CFG.

Answer 1

La biblioteca Dagre per il disegno grafo orientato è il rendering-agnostico, ma si integra bene con d3.js: https://github.com/cpettitt/dagre

Ecco una demo reso utilizzando D3: http://cpettitt.github.io/project/dagre-d3/latest/demo/interactive-demo.html