title: JavaScript Noise Function Problems
body: <p>I've been trying to learn about generating noise and find that I understand most of it but I'm having a bit of trouble with a script.</p>
  
  <p>I used <a href="http://freespace.virgin.net/hugo.elias/models/m_perlin.htm" rel="nofollow">this page</a> as a guide to write <a href="http://jsfiddle.net/L2VsP/2/" rel="nofollow">this script in JavaScript</a> with the ultimate purpose of creating some noise on canvas.</p>
  
  <p>It's definitely creating something but it's tucked all the way over on the left. Also, refreshing the page seems to create the same pattern over and over again.</p>
  
  <ol>
  <li>What have I done wrong that the "noisy" part of the image is smushed on the left? How can I make it look more like the cloudy perlin noise?</li>
  <li>I don't really understand why it doesn't produce a new pattern each time. What would I need to change in order to receive a random pattern each time the script is run?</li>
  </ol>
  
  <p>Thank you for your help!</p>
  
  <pre><code>/* NOISE—Tie it all together
  */
  function perlin2d(x,y){
      var total = 0;
  
      var p = persistence;
      var n = octaves - 1;
  
      for(var i = 0; i &lt;= n; i++) {
          var frequency = Math.pow(2, i);
          var amplitude = Math.pow(p, i);
  
          total = total + interpolatenoise(x * frequency, y * frequency) * amplitude;
      }
      return total;
  }
  </code></pre>