Hierarchical Edge Bundling d3 v4 - simplest 2 node example

Question

I would like to do the simplest Hierarchical Edge Bundling example I can, with two nodes. Once I fully understand how to make that work properly I should (hopefully) be able to dynamically construct the full visualization.

I saw Mike Bostock's D3 V4 example: https://bl.ocks.org/mbostock/7607999 and would like to use the same pattern. However, going through the JSON data it is a bit overwhelming. I was hoping with two nodes I could see how the visualization is constructed.

How would the JSON file look with just two nodes? I am trying to make the absolute easiest I can to try and learn how it works. Any help is appreciated.

I can't paste the JSON in here because it exceeds the maximum number of characters. For reference please check out: https://bl.ocks.org/mbostock/7607999#flare.json

Answer 1

Here is the data using 3 nodes (visualization would not have been much useful with 2 nodes):

var data = [{
  "name": "iit.mumbai.pub1",
  "imports": ["iit.chennai.pub3"]
}, {
  "name": "iit.delhi.pub2",
  "imports": ["iit.mumbai.pub1"]
}, {
  "name": "iit.chennai.pub3",
  "imports": ["iit.delhi.pub2"]
}];

Here is how it would look: https://bl.ocks.org/ckothari/raw/473320621a15a7ee1ed684bf3feb4255/.

I have taken example of academic publications in the above example. The dots in the names represent the hierarchal relationships, so in this example iit (Institute) has 3 children (locations) mumbai, delhi and chennai, and these have children (publications) pub1, pub2 and pub3 respectively.

imports in the json represents relation between the leaf nodes. Publication pub1 has citation for publication pub3, pub2 cites pub1 and pub3 cites pub2.