【问题标题】:Add text after last node in D3 Sankey diagram在 D3 Sankey 图中的最后一个节点之后添加文本
【发布时间】:2016-06-20 17:32:21
【问题描述】:

我试图移动我的桑基图上最右边的节点的标签以跟随节点而不是在节点之前。我正在使用here 显示的代码。

我可以通过键入如下所示的过滤功能行来让文本跟随节点

// add in the title for the nodes
  node.append("text")
      .attr("x", -6)
      .attr("y", function(d) { return d.dy / 2; })
      .attr("dy", ".35em")
      .attr("text-anchor", "end")
      .attr("transform", null)
      .text(function(d) { return d.name + " ("+Math.round(d.value).toLocaleString('en') + ")"; })
    //.filter(function(d) { return d.x < width / 2; })
      .attr("x", 6 + sankey.nodeWidth())
      .attr("text-anchor", "start");

但是,现在这个文本被右边距截断了。即使调整屏幕的宽度,它仍然会被切断。我怀疑代码中有一行最右边的节点位于右边距。我是 1) 试图找到这一行和 2) 试图使它应用于文本而不是节点。

【问题讨论】:

  • 更改var margin = {top: 10, right: 10, bottom: 10, left: 10}by var margin = {top: 10, right: 10, bottom: 10, left: 30} 能解决您的问题吗?

标签: javascript d3.js sankey-diagram


【解决方案1】:

改变右边距

var margin = {top: 10, right: 10, bottom: 10, left: 10},

到这里:

var margin = {top: 10, right: 90, bottom: 10, left: 10},

工作代码here

【讨论】:

  • 那行得通。我最初尝试修改代码中的“宽度”,但显然查看了边距功能。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-02-17
  • 2015-12-22
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多