title: Adding new node to forcedSimulation cause transform-translate only to new node
body: <p>I'm trying to  construct dynamic forced graph with d3 using forceSimulation.
  When I build a graph with hard coded nodes and links all the items built as expected.
  But when I add new node, all the old nodes won't translate their location and when i drag the old nodes only the new node moves (when i move the new node, it move as expected). </p>
  
  <p>I tried to change the way of tick of the simulation but didnt succeed to solve this.</p>
  
  <pre><code>var nodes = [{ "id": 0, "name": "Ego Node", "level": 0 },
               { "id": 1, "name": "first", "level": 1 },
               { "id": 2, "name": "Ego Node", "level": 2 }],
      links = [{ source: 0, target: 1 },
               { source: 1, target: 2 }]
  
  var simulation = d3.forceSimulation(nodes)
      .force('charge', d3.forceManyBody().strength(-100))
      .force('center', d3.forceCenter(width / 2, height / 2))
      .force('link', d3.forceLink().links(links));
  
  function update() {
      var link = d3.select('.links')
          .selectAll('line.link')
          .data(links).enter().insert("line")
          .attr("class", "link")
          .attr("x1", function (d) { return d.source.x; })
          .attr("y1", function (d) { return d.source.y; })
          .attr("x2", function (d) { return d.target.x; })
          .attr("y2", function (d) { return d.target.y; });
  
      link.exit().remove();
  
      node = d3.select('.nodes')
          .selectAll('g.node')
          .data(nodes).enter().append("g")
          .attr("class", "node");
  
      node.append("circle")
          .style("fill", function (d) {return "#0099ff"})
          .attr("r", 5);
  
      node.append("text")
          .attr("class", "nodetext")
          .attr("x", "0em")
          .attr("y", 15)
          .text(function (d) { return d.name });
  
  
      node.exit().remove();
  
      simulation.on("tick", function () {
          link.attr("x1", function (d) { return d.source.x; })
              .attr("y1", function (d) { return d.source.y; })
              .attr("x2", function (d) { return d.target.x; })
              .attr("y2", function (d) { return d.target.y; });
  
          node.attr("transform", function (d) { return "translate(" + d.x + "," + d.y + ")"; });
      });
  
      simulation.nodes(nodes);
      simulation.force('link', d3.forceLink().links(links));
      simulation.alpha(1).restart();
  }
  
  function addNode() {
      nodes.push({ "Id": 3, "name": "AAA", "level": 2 });
      links.push({ source: 1, target: 3 });
      update();
  }
  </code></pre>
  
  <p>When I execute the function addNode() I can drag only the new node added.
  All the other node are stuck and when I drag them, it changes only the new node's location.
  Any help will be great! Thanks.</p>