d3js链接弧填充无用的部分

Question

这是我目前的链接绘制方式。 这是下面的图片代码（来自我真正的推出HTML）

<svg height="1210" width="1400">
<path class="link" id="linkId_2" opacity="0.9468531468531468" style="stroke-width: 5px; marker-end: url(#end-arrow);" d="M652.3404429062306,276.08144057675605A166.53959040529506,166.53959040529506 0 0,1 767.3217566577334,315.4663301140565"></path>
</svg>

但我想这样画。 （应该像链接，而不是圈子的一部分）

这是我真正的代码部分。

function updateLink() {
    this.attr('d', function(d) {
        var deltaX = d.target.x - d.source.x,
            deltaY = d.target.y - d.source.y,
            dist = Math.sqrt(deltaX * deltaX + deltaY * deltaY),
            normX = deltaX / dist,
            normY = deltaY / dist;
        if( !normX) normX = 0;
        if( !normY) normY = 0;

        var sourcePadding = d.left ? circleSize(d.source.inDegree) + 10 : 20,
            targetPadding = d.right ? circleSize(d.target.inDegree) + 5 : 20,

            sourceX = d.source.x + (sourcePadding * normX),
            sourceY = d.source.y + (sourcePadding * normY),
            targetX = d.target.x - (targetPadding * normX),
            targetY = d.target.y - (targetPadding * normY);

        return "M" + sourceX + "," + sourceY + "A" + dist + "," + dist + " 0 0,1 " + targetX + "," + targetY;
    });
}

以下是我使用的示例（http://bl.ocks.org/mbostock/1153292）

Answer 1

如果您希望笔划未填充，则只需将填充设置为无，将笔划设置为颜色，例如

<svg height="1210" width="1400" viewBox="600 230 600 600">
<path class="link" id="linkId_2" opacity="0.9468531468531468" style="fill:none;stroke:black;stroke-width: 5px; marker-end: url(#end-arrow);" d="M652.3404429062306,276.08144057675605A166.53959040529506,166.53959040529506 0 0,1 767.3217566577334,315.4663301140565"></path>
</svg>