How to connect two rectangle svgs containing json nodes

I am having a input json as :

{
  "test1":"test1",
  "test2":"test2",
  "test3":"test3"
}

And the output json:

{
  "test4":"test4",
  "test5":"test5",
  "test6":"test6"
}

So I am trying to do the following using D3.js and I am new to D3.js,

The user will import input JSON and output JSON.

Based on the input and output JSON mapping which is done by linking the corresponding nodes it'll get mapped.

So, the output will be:

{
  "test4":"test2",
  "test5":"test3",
  "test6":"test1"
}

I found the one example(https://stackoverflow.com/questions/39685298/draw-a-line-between-2-divs-once-2-consequence-div-clicked-using-angularjs) but using only javascript not with D3.