Use Strict getBBOX Error

Rotation of label errors when "use strict"; is active.

by Tim Williams

JavaScript

// USE strict cases error in label rotation's use of 
// getBBox().

// "use strict";  // Uncomment to cause  error

var  nodesData = [
  {n:0,  label: 'One', x:250, y:60, fixed:true },
  {n:1,  label: 'Two', x:440, y:60, fixed:true}
  ],
  edgesData = [
    {source: nodesData[0], target: nodesData[1], label: 'label'}
  ];

var w = 480,
    h = 280,
    nodeRadius = 40;

// SVG graphs goes to Main div
var svg = d3.select("body").append("svg")
  .attr("width", w)
  .attr("height", h);

// Initialize D3 force layout
var force = d3.layout.force()
  .nodes(nodesData)
  .links(edgesData)
  .size([w, h])
  .start();

var edges = svg.selectAll("line")
  .data(edgesData)
  .enter()
  .append("line")
    .attr("id", function(d,i){return 'edge'+i})
    .style("stroke", "#ccc");

var nodes = svg.selectAll("circle")
  .data(nodesData)
  .enter()
  .append("circle")
    .attr({"r":35})
    .style("fill", "white")
    .style("stroke", "black")
    .call(force.drag);

var nodelabels = svg.selectAll(".nodelabel")
     .data(nodesData)
     .enter()
     .append("text")
     .attr({"x":function(d){return d.x;},
       "y":function(d){return d.y;},
       "stroke":"black"})
     .text(function(d){return d.label;});

var edgepaths = svg.selectAll(".edgepath")
  .data(edgesData)
  .enter()
  .append('path')
  .attr({'d': function(d) {return 'M '+d.source.x+' '+d.source.y+' L '+ d.target.x +' '+d.target.y},
         'class':'edgepath',
         'fill-opacity':0,
         'stroke-opacity':0,
         'id':function(d,i) {return 'edgepath'+i}});

var edgelabels = svg.selectAll(".edgelabel")
  .data(edgesData)
  .enter()
  .append('text')
    .style("pointer-events", "none")
    .attr({'class':'edgelabel',
      'id':function(d,i){return 'edgelabel'+i},
      'dx':80,
      'dy':0  // change to 5 to put inline with link
    });

edgelabels.append('textPath')
  .attr('xlink:href',function(d,i) {return '#edgepath'+i})
  .text(function(d,i){return d.label});

force.on("tick", function() {
 ...