1

I am trying to move the labels of the right most nodes on my Sankey Diagram to follow the node rather than come before the node. I am using the code shown here.

I was able to get the text to follow the node by keying out the filter function line as shown below

// 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");

However, now this text is cut off by the right margin. It remains cut off even when adjusting the width of the screen. I suspect there is a line in a code that has the right most nodes go to the right margin. I am 1) trying to find this line and 2) trying to make this apply to the text rather than the node.

Dario
  • 3,905
  • 2
  • 13
  • 27
Danny
  • 554
  • 1
  • 6
  • 17
  • Does changing `var margin = {top: 10, right: 10, bottom: 10, left: 10}`by `var margin = {top: 10, right: 10, bottom: 10, left: 30}` fix your problem? – Tim B Jun 20 '16 at 19:40

1 Answers1

1

change the right margin from

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

to this:

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

working code here

Cyril Cherian
  • 32,177
  • 7
  • 46
  • 55
  • 1
    That works. I initially tried modifying the "width" in the code but apparently looked over the margin function. – Danny Jun 21 '16 at 13:08