Question

我正在尝试学习如何在D3.js中使用force.layout功能，并且一直在构建“Force Directed Radial Graph”。

我已经能够成功地从节点追加和渲染文本（例如节点名称），但我似乎无法从行中呈现文本（或其他人可能称之为链接或边缘）（例如，关系名称））。

有谁知道我在哪里可以找到教会如何操作的好例子或者有能够纠正我所做过的代码片段？

感谢您提供的任何帮助。非常感谢。

我最好，

谢

Answer 1

示例已经显示了如何向边缘添加文本。以下是相关的代码：

      // Append text to Link edges
  var linkText = svgCanvas.selectAll(".gLink")
      .data(force.links())
    .append("text")
  .attr("font-family", "Arial, Helvetica, sans-serif")
  .attr("x", function(d) {
      if (d.target.x > d.source.x) { return (d.source.x + (d.target.x - d.source.x)/2); }
      else { return (d.target.x + (d.source.x - d.target.x)/2); }
  })
      .attr("y", function(d) {
      if (d.target.y > d.source.y) { return (d.source.y + (d.target.y - d.source.y)/2); }
      else { return (d.target.y + (d.source.y - d.target.y)/2); }
  })
  .attr("fill", "Maroon")
      .style("font", "normal 12px Arial")
      .attr("dy", ".35em")
      .text(function(d) { return d.linkName; });

如何在D3.js中的力导向图中的行中附加文本并渲染该文本？

1 个答案: