title: Javascript D3 Tree Visualization Wrapped in HTML Page
body: <p>Getting the following error message: <strong>Error: Problem parsing d="M,CNaN, NaN, ,"</strong></p>
  
  <p>I'm building a D3 tree based on the Flare example (located <a href="http://mbostock.github.io/d3/talk/20111018/tree.html" rel="nofollow">http://mbostock.github.io/d3/talk/20111018/tree.html</a>).</p>
  
  <p>My primary goal is to change how data is provided to the Tree rendering code.  In the original example, data is provided via a JSON file.  In my example (located at: <a href="http://bl.ocks.org/Guerino1/raw/ed80661daf8e5fa89b85/" rel="nofollow">http://bl.ocks.org/Guerino1/raw/ed80661daf8e5fa89b85</a>), I'm trying to provide the data in a manner that conforms more with an RDF/OWL look and feel (i.e. directly supplying a set of Nodes and a separate set of Links/Relationships).</p>
  
  <p>I've changed the input data, located toward the top of the index.html, file to look as follows:</p>
  
  <pre><code>  var nodeSet = [
      {name: "N0", type: "Type 1", hlink: "http://www.if4it.com"},
      {name: "N1", type: "Type 2", hlink: "http://www.if4it.com/glossary.html"},
      {name: "N2", type: "Type 2", hlink: "http://www.if4it.com/resources.html"},
      {name: "N3", type: "Type 3", hlink: "http://www.if4it.com/taxonomy.html"},
      {name: "N4", type: "Type 4", hlink: "http://www.if4it.com/disciplines.html"},
      {name: "N5", type: "Type 1", hlink: "http://www.if4it.com"},
      {name: "N6", type: "Type 2", hlink: "http://www.if4it.com/glossary.html"},
      {name: "N7", type: "Type 1", hlink: "http://www.if4it.com"},
      {name: "N8", type: "Type 2", hlink: "http://www.if4it.com/disciplines.html"}
    ];
  
    var linkSet = [
      {source: "N0", target: "N1"},
      {source: "N1", target: "N2"},
      {source: "N2", target: "N3"},
      {source: "N0", target: "N4"},
      {source: "N4", target: "N5"},
      {source: "N0", target: "N6"},
      {source: "N6", target: "N7"},
      {source: "N6", target: "N8"}
    ];
  </code></pre>
  
  <p>At about line 113, I parse the links to identify and assign Children to each Node in the nodeSet using the following code:</p>
  
  <pre><code>    linkSet.forEach(function(link) {
        var parent = link.source = nodeByName(link.source),
        child = link.target = nodeByName(link.target);
        if (parent.children) parent.children.push(child);
        else parent.children = [child];
      });
  
      function nodeByName(name) {
        return nodeSet[name] || (nodeSet[name] = {name: name});
      }
  </code></pre>
  
  <p>While everything appears to functionally work, my Javascript console is still seeing a set of "8" errors every time I refresh or select nodes.  The error manifests itself somewhere at about line 210, which is the following code block:</p>
  
  <pre><code>      // Update the linksÃ¢â‚¬Â¦
        var link = vis.selectAll("path.link")
            .data(tree.links(nodes), function(d) { return d.target.id; });
  
        // Enter any new links at the parent's previous position.
        link.enter().insert("svg:path", "g")
            .style("fill", "none")
            .style("stroke", "#000")
            .attr("class", "link")
            .attr("d", function(d) {
              var o = {x: source.x0, y: source.y0};
              return diagonal({source: o, target: o});
            })
            .transition()
              .duration(duration)
              .attr("d", diagonal);
  </code></pre>
  
  <p>Any thoughts on what the problem might be and how to fix it?</p>
  
  <p>Thanks for any help you can offer.</p>