title: Add/update labels to a d3.js graph
body: <p>I'm new to d3.js, and I struggle with the syntax.</p>
  
  <p>I usually know how to add labels to a graph... but not with this code (which I have taken from <a href="https://stackoverflow.com/questions/18752006/d3-js-force-layout-showing-only-part-of-a-graph">D3.js Force Layout - showing only part of a graph</a> )</p>
  
  <p>I have tried the various solutions [ .append("text"), enter().append("text")....] but I have been unsuccessful. </p>
  
  <p>Here is the part of the code where I think that I have to change something (and, below the code, you'll find a gihub repo of the entire thing)</p>
  
  <pre><code>        this.link = this.link.data(this.force.links(), function (d) {
  
              return d.source.id + "-" + d.target.id;
          });
  
          this.link.enter().insert("line", ".node").attr("class", "link")
  
              .style("opacity", 0)
              .transition().duration(1000)
  
              .style("opacity", 1);
  
          this.link.exit()
              .remove();
  
  
  
          this.node = this.node.data(this.force.nodes(), function (d) {
              return d.id;
  
          });
  
          if (this.node.enter().empty()==false ||this.node.exit().empty() == false) {
              transition = true;
          }
  
  
          this.node.enter()
              .append("circle")
              .style("opacity", 1)
              .attr("class", "node")
              .style("fill", function (d) {
                  return d.color;
              })
              .attr("r", 18)
              /*.on('mouseover', this.mouseOver)*/
              .on('mousedown', this.mouseDown)
              .on('mouseout', this.mouseOut)
              .on("dragstart", this.dragStart)
              .on("click", this.click)
              .call(this.nodeDrag)
              .transition().duration(1000)
              .style("opacity", 1)
              .each("end",function(){transition=false;});
  
  
          this.node.each(function(d) {
              if (d.centerNode==false) {
                this.setAttribute('r',12);
              } else if (firstRound) {
                  this.setAttribute('r',30);
                  firstRound  =false;
              }
          });
  
  
  
  
  
          this.node.exit().transition().duration(1000).style("opacity", 0)
              .each("end",function(){transition=false;})
              .remove();
  </code></pre>
  
  <p><a href="https://github.com/coulmont/pornograph" rel="nofollow noreferrer">https://github.com/coulmont/pornograph</a></p>