d3.jsで矢印を描きたい

Question

###前提・実現したいこと
d3.jsを使って矢印を描く手法、または、
それの理解に役立つサイトを教えていただきたいです。

###発生している問題
2つの円の間に矢印を表示したいのですが方法が分かりません。
2つの円は下記のようにして表示しています。

###該当のソースコード

var svg = d3.select("#result")
 .append("svg")
 .attr("width", 2000)
 .attr("height", 2000);

var object= {"x1":1,"y1":1,"x2":1,"y2":2};

var boxes = svg.selectAll("boxes")
 .data(dicData)
 .enter()
 .append("g");

boxes.append("ellipse")
 .attr("cx", function(d){ return d["x1"]*200; })
 .attr("cy", function(d){ return d["y1"]*150; })
 .attr("rx", 50)
 .attr("ry", 50)

boxes.append("ellipse")
 .attr("cx", function(d){ return d["x2"]*200; })
 .attr("cy", function(d){ return d["y2"]*150; })
 .attr("rx", 50)
 .attr("ry", 50)

###試したこと
いくつかのサイトで調べてみました。主なものを以下に挙げます。
https://github.com/d3/d3/wiki/Gallery
http://www.openspc2.org/reibun/D3.js/
http://dataisfun.org/series/d3-tutorial-elemental
http://qiita.com/daxanya1/items/734e65a7ca58bbe2a98c

Comments

[kei344]

質問文のコード最終行に改行と「```」が足りません。それを足せばコードブロックとして表示されます。

Answer 1

私は、
http://qiita.com/daxanya1/items/734e65a7ca58bbe2a98c
のサイトの通りにして、２点間の矢印を表示できました。
何が問題だったのでしょうか？

Answer 2

それっぽいコードをいくつかのサイトで見つけました。
以下のような感じで良いのでしょうか。
https://github.com/cpettitt/dagre-d3/wiki
http://bl.ocks.org/lgersman/5311202

Comments

[blaubeere]

参考になりそうなサイトを教えていただき、ありがとうございます。
私の今の知識では必要な個所をみつけることができません。
もっと時間をかけて勉強させていただきます。