Uncaught TypeError in D3 Sankey Drag Function

Question

I have created a d3 Sankey graph. The issue that I'm facing is that I am unable to drag the nodes. This is how the node is created:

 var node = svg.append("g").selectAll(".node")
      .data(graph.nodes)
    .enter().append("g")
      .attr("class", "node")
      .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; })
      .on("click",highlight_node_links)
    .call(d3.behavior.drag()
      .origin(function(d) { return d; })
      .on("dragstart", function() { this.parentNode.appendChild(this); })
      .on("drag", dragmove));

And the dragmove function is as follows:

 function dragmove(d) {

    d3.select(this).attr("transform", 
        "translate(" + (
               d.x = Math.max(0, Math.min(width - d.dx, d3.event.x))
            ) + "," + (
                   d.y = Math.max(0, Math.min(height - d.dy, d3.event.y))
            ) + ")");
    sankey.relayout();
    link.attr("d", path);
  }

But everytime I run my code, it throws this error: Uncaught TypeError: Cannot read property 'target' of null

What am I doing wrong?

Answer 1

The error was being thrown because of the placement of the script in the program. While integrating the graph into a page with a lot of other content, I placed the script in the head section which seemed to cause the issue. Now that, I placed it near the end, everything works fine. I'm sorry to have posted this, I was being silly.

  <html>
   <style><!-- Style for the Sankey graph -->
   </style>
   <body>
      <div id="sankey-graph">
      </div>
      <script><!-- Script for the Sankey graph -->
      </script>
   </body>
 </html>

This is the correct way I guess. I had initially put my script before the div that contained sankey graph.

Uncaught TypeError in D3 Sankey Drag Function

Question

1 answers

solution1
2 ACCPTED 2016-06-24 11:30:44

Uncaught TypeError in D3 Sankey Drag Function

Question

1 answers

solution1 2 ACCPTED 2016-06-24 11:30:44

solution1
2 ACCPTED 2016-06-24 11:30:44