Javascript 如何使用D3在两个圆的周长之间绘制路径？

我对d3.js和SVG有问题。我想在两个圆之间画一条线，实际上这条线在每个圆的中心之间，但我想它在两个圆的周长之间

这是我的D3.js代码：

变量cx1='0px'；
变量cy1='50px'；
风险值r1='3%'；
变量cx2='-200px'；
变量cy2='150px'；
var r2='10.25px'；
var urlImage=http://files.softicons.com/download/application-icons/circle-icons-add-on-2-by-martz90/png/128x128/playstation.png'
var svg=d3.选择（“svg”）
.attr（'width'，'100%”）
.attr（'height'，'100%”）
var g=svg.append（'g'）；
var pattern=svg.append（'defs'）
.append（'模式'）
.attr（'id'，'image'）
.attr（'x'，'0%”）
.attr（'y'，'0%'））
.attr（'height'，'100%”）
.attr（'width'，'100%”）
.attr（'viewBox'，'0 0 128'）
var image=pattern.append（'image'）
.attr（'x'，'0%”）
.attr（'y'，'0%'））
.attr（'height'，128）
.attr（'width'，128）
.attr（'xlink:href'，urimage）；
var circle1=g.append（'g'）
.attr（'id'，'PUESTO0'））
.append（'圆'）
.attr（'cx'，cx1）
.attr（'cy'，cy1）
.attr（'r'，'3%'））
.style（'笔划宽度'，1）
.style（'stroke'，'green'）
.style（'fill'，'url（#image'）；
var circle2=g.append（'g'）
.attr（'id'，'PUESTO1'）
.append（'圆'）
.attr（'cx'，cx2）
.attr（'cy'，cy2）
.attr（'r'，r2）
.样式（“笔划宽度”，6）
.style（'stroke'，'rgb（0,0,255'））
.style（'填充'，'白色'）
var line=g.append（'line'）
.attr（'x1'，cx1）
.attr（'y1'，cy1）
.attr（'x2'，cx2）
.attr（'y2'，cy2）
.style（“笔划宽度”，4）
.风格（“笔划”、“钢蓝”）
g、 attr（'transform'、'translate（'+567.5+'、'+0+'）比例（'+1+'））

问题出在图像的透明部分（.png），我通过使用外部程序删除透明部分来修复它

如果您请求D3方面的帮助，您应该发布D3代码，而不是呈现的SVG元素。您包括SVG标记，但不包括用于生成它的代码。你试图做什么？确定要在它们之间画线的点应该是一个非常简单的三角问题。