Javascript 在谷歌图表上显示文本

我正在使用谷歌图表-。我想让权重显示在每个流上，而不需要鼠标悬停

对于官方样本，如下所示（）：

可能是这样的：

我找到了解决办法，但这不是我想要的

我想要的是在流程上直接显示作为标签的重量。您不需要将鼠标移到任何流上就可以看到它的重量

---

提前感谢

谷歌图表并没有那么强大的定制能力

若你们决定使用谷歌图表，那个么你们链接到的解决方案似乎是一个很好的折衷方案。如果你更愿意使用谷歌图表来获取标签，我建议你研究一下，这可以让你尽可能多的定制

使用d3.js和我通过添加线条创建了您想要的图形：

/* add links */
var link = svg.append("g").selectAll(".link")
    .data(graph.links)
    .enter()
  .append("path")
    .attr("class", "link")
    .attr("id",function(d,i) { return "linkLabel" + i; })
    .attr("d", path)
    .style("stroke-width", function (d) {
       return Math.max(1, d.dy);
    })
    .sort(function (a, b) {
       return b.dy - a.dy;
    })
...

var labelText = svg.selectAll(".labelText")
    .data(graph.links)
    .enter()
  .append("text")
    .attr("class","labelText")
    .attr("dx",130)
    .attr("dy",0)
  .append("textPath")
    .attr("xlink:href",function(d,i) { return "#linkLabel" + i;})
    .text(function(d,i) {                                 
        return d.source.name + " → " + d.target.name + " : " + d.value;});

---

谢谢你，克莱顿！这就是我需要的。我要上d3.js了，哇！这是一个非常有用的好例子。节点甚至可以通过拖放手动排序。谢谢你的盛情款待！

/* add links */
var link = svg.append("g").selectAll(".link")
    .data(graph.links)
    .enter()
  .append("path")
    .attr("class", "link")
    .attr("id",function(d,i) { return "linkLabel" + i; })
    .attr("d", path)
    .style("stroke-width", function (d) {
       return Math.max(1, d.dy);
    })
    .sort(function (a, b) {
       return b.dy - a.dy;
    })
...

var labelText = svg.selectAll(".labelText")
    .data(graph.links)
    .enter()
  .append("text")
    .attr("class","labelText")
    .attr("dx",130)
    .attr("dy",0)
  .append("textPath")
    .attr("xlink:href",function(d,i) { return "#linkLabel" + i;})
    .text(function(d,i) {                                 
        return d.source.name + " → " + d.target.name + " : " + d.value;});