用 d3.js 做力导向图，如何连线上的文字始终居中

Question

想要实现的效果（文字长度不固定，初始位置居中；节点拖动连线，文字随连线变化居中）：                                                【图 1】现在实现的效果（文字初始位置未居中，不会随着连线的变化而变化）：                                                【图 1】请问如何修改代码来实现【图 1】 效果：a. 文字初始位置居中； b.连线伸缩时，文字会自适应居中？

Answer 1

我也想请问下，文字是怎么显示在连线上的

Answer 2

请问您文字在连线中间是怎么做到的？

Answer 3

问题已自行解决：

lineText.attr({
  'dx': d => getLineTextDx(d)
});

function getLineTextDx(d) {
    const sr = d.radius;
    const sx = d.source.x;
    const sy = d.source.y;
    const tx = d.target.x;
    const ty = d.target.y;
    const distance = Math.sqrt(Math.pow(tx - sx, 2) + Math.pow(ty - sy, 2));
    
    const textLength = d.alllabel.length;
    const deviation = 8; // 调整误差
    const dx = (distance - sr - textLength * lineTextFontSize) / 2 + deviation;
    
    return dx;
}