Particle system (fireflies)

Perlin noise particles. 2015-07-11

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.15/processing.js"></script>
<canvas></canvas>

CSS

body {
    overflow: hidden;
    margin: 0;
    padding: 0;
}
</style> <script type="text/javascript"> window.addEventListener('load', function() {
    var scripts=document.body.getElementsByTagName('script');
    var canvases=document.body.getElementsByTagName('canvas');
    new Processing(canvases[0], scripts[0].text);
}
, false);
 // Here prevent javascript in body from throwing error </script> <style>

JavaScript

float frequency = 0.001;
  float noiseInterval = 1;
  float x = 0;
  float y = 0;


  void setup() {
      size(800, 600);
      smooth(10);
      noStroke();
  }

  void draw() {
      fill(0, 0, 0, 20);
      rect(0, 0, width, height);

      colorMode(HSB, 360, 100, 100, 100);
      for (int i = 0; i < 360; ++i) {
          x = map(noise(i * noiseInterval + frameCount * frequency), 0, 1, 0, width);
          y = map(noise(i * noiseInterval + 1 + frameCount * frequency), 0, 1, 0, height);
          fill(y / 2, 90, 90, 50);
          ellipse(x, y, 4, 4);
      }

  }