We import Graphviz dot as translated to json. Here we do their one example which hints at possibilities. graphviz 
echo 'digraph { a->b }' | dot -Tdot_json | pbcopy
{
"name": "%3",
"directed": true,
"strict": false,
"_subgraph_cnt": 0,
"objects": [
{
"_gvid": 0,
"name": "a",
"label": "\\N"
},
{
"_gvid": 1,
"name": "b",
"label": "\\N"
}
],
"edges": [
{
"_gvid": 0,
"tail": 0,
"head": 1
}
]
}
http://hsc.fed.wiki/assets/scripts/import-foreign-json.html HEIGHT 240
Add code here to extract nodes and relations from _json_ and add them to _graph_. Remember node ids in _nids_.
json.objects.forEach(n => { const type = n._gvid < json._subgraph_cnt ? 'Cluster' : 'Node' graph.addNode(type,{name:n.name}) })
json.edges.forEach(e => { const type = e.tail < json._subgraph_cnt ? 'Edge' : 'Child' graph.addRel('Edge',e.head,e.tail) }) json.objects.forEach(n => { if(n._gvid < json._subgraph_cnt) { n.nodes.forEach(s => graph.addRel('Child', n._gvid, s)) n.edges.forEach(s => graph.addRel('Child', n._gvid, s)) n.subgraphs?.forEach(e => graph.addRel('Child',n._gvid, e)) } })
digraph { layout = dot; overlap = false; splines=true node [shape=box style=filled fillcolor=gold] rankdir=LR node [fillcolor=palegreen] 0 [label="Node\na" tooltip="name: a"] 1 [label="Node\nb" tooltip="name: b"] 1->0 [label="Edge" labeltooltip=""] }
We extend import to handle Graphviz Clusters
{
"name": "%3",
"directed": false,
"strict": false,
"_subgraph_cnt": 3,
"objects": [
{
"name": "clusterX",
"_gvid": 0,
"subgraphs": [
1
],
"nodes": [
4,5,6,7
],
"edges": [
1,2
]
},
{
"name": "clusterZ",
"_gvid": 1,
"nodes": [
6,7
],
"edges": [
2
]
},
{
"name": "clusterY",
"_gvid": 2,
"nodes": [
8,9
],
"edges": [
4
]
},
{
"_gvid": 3,
"name": "e",
"label": "\\N"
},
{
"_gvid": 4,
"name": "a",
"label": "\\N"
},
{
"_gvid": 5,
"name": "b",
"label": "\\N"
},
{
"_gvid": 6,
"name": "C",
"label": "\\N"
},
{
"_gvid": 7,
"name": "D",
"label": "\\N"
},
{
"_gvid": 8,
"name": "d",
"label": "\\N"
},
{
"_gvid": 9,
"name": "f",
"label": "\\N"
},
{
"_gvid": 10,
"name": "clusterY",
"label": "\\N"
},
{
"_gvid": 11,
"name": "clusterZ",
"label": "\\N"
}
],
"edges": [
{
"_gvid": 1,
"tail": 4,
"head": 5
},
{
"_gvid": 2,
"tail": 6,
"head": 7
},
{
"_gvid": 4,
"tail": 8,
"head": 9
},
{
"_gvid": 3,
"tail": 8,
"head": 7
},
{
"_gvid": 0,
"tail": 3,
"head": 10
},
{
"_gvid": 5,
"tail": 11,
"head": 10
}
]
}