title: D3 JS - Force Graph - Animate nodes individually
body: <p>Apologies for the question - I know similar questions have been asked - but I cannot find a solution for my particular problem.<br/>
  <br/></p>
  
  <p>JS Fiddle : <a href="http://jsfiddle.net/TheDarkne55/tmkbLk4b/2/" rel="nofollow">http://jsfiddle.net/TheDarkne55/tmkbLk4b/2/</a>
  <br/>That's the basic FD graph example, slightly modified and with my code added :<br/> </p>
  
  <pre><code>    /* --- MY CODE START --- */     
  var intervalID = setInterval(animationTick, 1000);
  
  function animationTick() {
  
      var randomInt = Number(getRandomInt(0, 5));
      var currentRadius = Number(node.attr("r"));
      var newRadius = Number(currentRadius + randomInt);
  
      node.attr("r", function (d) {return currentRadius + randomInt;});   
  }
  /* --- MY CODE END --- */
  </code></pre>
  
  <p><strong>What I've got:</strong><br/>
  My real example is a lot more complex, which is not important for this question.<br/>
  This is just a simple graph.
  I've added an animationTick() function so that I can control how often its called.</p>
  
  <p><strong>What I want:</strong><br/>
  I want the circles to be animated as I require (Grow-and-Shrink) forever.
  (in this Fiddle I've just added the "grow" part)
  The simple algorithm in this example just tries to add a random int to the <strong>current</strong> radius.
  So, with each Node/circle starting off with different radii, I expect them to remain different-sized when they're being incremented by the same amount. But instead they become the same size.</p>
  
  <p>The Problem:<br/>
  1. I'm new to D3 JS and don't understand very well how iteration of d3 elements works, in different ways
  2. In this example, as you'll see on the first trigger, instead of all <em>increasing</em> their <strong>current</strong> radius by a relative amount, they all become the <strong>same</strong> size, and then continue in that way</p>
  
  <p>I'm sure its just a matter of properly iterating through the nodes or node-data, and I've tried manipulating those directly as well, but I've been stumped for a while now.</p>
  
  <p>Any pointers in the right direction will be greatly appreciated.</p>