Change a canvas js variable by animating it
<p>Original canvas created by Jack Rugile.</p>

<p>I am trying to change several variables in the canvas js file on hover using a jquery function. Several work but I would like to change the radius of the glowing rotation by animating it rather than having it instantly change. Similar to the way <a href="https://24.media.tumblr.com/58b6e67d546d14360f9e64aec40bc286/tumblr_mygwnsbsvF1sso6sco1_500.gif" rel="nofollow">this</a> expands.</p>

<p>I tried using a $timeout but i don't think that is the proper way to go.
Any suggestions?</p>

<p><a href="https://jsfiddle.net/3u8ukorv/" rel="nofollow">DEMO</a></p>

<p>The jquery hover is at the bottom of the js.</p>

<pre><code>$('.containAnimation').hover(function() {
  circle.speed = 8;
  circle.thickness = 20;
  particleMax = 200;
  $timeout(function() {
    circle.radius = 150;
  }, 3000);
}, function() {
  circle.speed = 1.5;
  circle.thickness = 15;
  particleMax = 100;
  $timeout(function() {
    circle.radius = 100;
  }, 3000);
});
</code></pre>