How to create a pulsating particle system that is being built?

edited September 2014 in How To...

Hello all,

I'm trying to put together a few ideas but I'm not sure how to execute them in code. I have some basic code down with the system that I want to pulse but I have no idea how get the circles to pulse (i.e. the radius of the circle slightly expands and contracts as a function of distance away from the center). I'm not sure what the best approach would be. Maybe an array which I can store each circles data and then I can call upon/edit that circles radius? Anyways, I'm not sure how to tackle this and if anyone can point me in the right direction that would be great!

int n = 1;
int c = 15;


void setup() {
  size(640,360);  
  background(255);
  noStroke();
}

void draw() {

  n++;
  float r = c*pow(n,.55);
  float radius = 10;
  float theta = n*PI*(3-sqrt(5));

  fill(62,map(r,1,width,0,255),138,200);

    pushMatrix();
      translate(width/2,height/2);
      ellipse(r*cos(theta)/4,r*sin(theta)/4,radius,radius);
      rotate(theta);
    popMatrix();

}

Answers

  • int n = 1;
    int c = 15;
    
    
    void setup() {
      size(640,360);  
      background(255);
      noStroke();
    }
       float radius = 10;
    void draw() {
    
      n++;
      float r = c*pow(n,0.55f);
    
      float theta = n*PI*(3-sqrt(5));
    
      fill(62,map(r,1,width,0,255),138,200);
        pushMatrix();
          translate(width/2,height/2);
          ellipse(r*cos(theta)/4,r*sin(theta)/4,radius-=0.05,radius-=0.05);
          rotate(theta);
        popMatrix();
    
    }
    
  • That's pretty cool! But I was thinking of something more like this. But in the flower pattern where the wave propagates outward radially.

    float t=0;
    
    void setup() {
      size(400,400);
      background(255);
      smooth();
      stroke(1);
      fill(0,50);
      strokeWeight(2);
    }
    
    void draw() {
      background(255);
    
      t = t + .05;
    
    
      for (int i=0; i<8; i++) {
        for (int j=0; j<8; j++) {
          float pulse = pow(sin(t*PI/3-i*PI/8),2);
          ellipse(width/4 + i*30, height/4 + j*30, 40*pulse, 40*pulse);
        }
      }
    }
    
  • I suppose something like this. However I hadn't anticipated how the pulse pattern would propagate.

    int c = 16;
    float t = 1;
    int nprime = 1;
    
    void setup() {
      size(500,500);  
      background(255);
      noStroke();
    
    }
    
    void draw() {
      t = pow(t,1.00001) + .1;
      nprime++;
      background(255);
      translate(width/2,height/2);
      circles();
    }
    
    void circles() {
    
      for (int n = 1; n < nprime*3; n++) {;
        float r = c*sqrt(n);
        float radius = 3;
        float theta = n*PI*(3-sqrt(5));
        fill(62,map(r/2,1,width,0,255),138,100);
        float pulse = pow(sin(t*PI/3-n*PI/8),1);
        ellipse(r*cos(theta)/4,r*sin(theta)/4,pulse*radius+6,pulse*radius+6);
    
      }
    }
    
  • oh! Sorry my bad ! :/ But yeah you got some cool effect though :) best of luck

  • edited September 2014 Answer ✓

    Nice pulsating spiral flower effect! I've publish it online: =:)
    http://studio.processingtogether.com/sp/pad/export/ro.90WsCogc75rxf/latest

    Made a CoffeeScript version of it too: :bz

    ###
    * Pulsating Spiral Flower (v3.01.1)
    * by  Kevin (2014/Apr)
    * mod GoToLoop
    *
    * forum.processing.org/two/discussion/4266/
    * how-to-create-a-pulsating-particle-system-that-is-being-built
    *
    * studio.processingtogether.com/sp/pad/export/ro.90WsCogc75rxf/latest
    ###
    
    
    GAP = `020`; RAD = 3; EIGHTH_PI = Processing::QUARTER_PI/2.0
    ang = 0
    
    setup: ->
    
        size 500, 500, JAVA2D; frameRate 60; smooth 4
        do noStroke; ellipseMode CENTER
        
        ang = PI * (3 - sqrt 5)
    
    
    draw: ->
    
        background -1; translate width>>1, height>>1
        do circles
    
    
    circles = ->
    
        t = .1*THIRD_PI*frameCount; n = 3*frameCount
    
        while --n
    
            r = .25*GAP*sqrt n
            theta = n*ang
            pulse = 6 + RAD*sin t - n*EIGHTH_PI
    
            fill `0100`, map(r*2.0, 0, width, 0, `0400`), `0220`, `0200`
            ellipse r*cos(theta), r*sin(theta), pulse, pulse
    
    
        return
    
  • edited April 2014

    Ooh! Nice! I have been tweaking the code a bit more. This is what I came up with. There is a slight blur effect while the canvas spins. Also If you mess with the phase shift slightly the pulsing effect is a bit more pronounced (I'm talking about line 27 from the code above).

    float pulse = pow(sin(t*PI/3-n*PI/8),1);

    If you mess with the phase offset (i.e. n*PI/8) you can get the clusters of pulses to change more. I find values between 3 and 50 work best. You can also mess with the degree of the exponential in that function as well to get some interesting results. I combined a few of these techniques below with a modulo and raised the function to 1.5 power. It's pretty crazy!

    //Kevin Gutowski
    //Friday April 11 2014
    //A study of the golden ratio
    
    int c = 16;
    float t = 1;
    int nprime = 1;
    
    void setup() {
      size(500,500);  
      background(255);
      noStroke();
    
    }
    
    void draw() {
      t = pow(t,1.00001) + .1;
      nprime++;
      translate(width/2,height/2);
      rotate(PI*sin(t/50));
      fill(255,255,255,30);
      rect(-width/2,-height/2,width,height);
    
      circles();
    }
    
    void circles() {
    
    
      for (int n = 1; n < nprime*3; n++) {;
        float r = c*sqrt(n);
        float radius = 3;
        float theta = n*PI*(3-sqrt(5));
        fill(62,map(r/2,1,width,0,200),138,100);
        float pulse = pow(sin(t*PI/3-n*PI/(t%100)),1.5);
        pushMatrix();
        ellipse(r*cos(theta)/4,r*sin(theta)/4,pulse*radius+6,pulse*radius+6);
        popMatrix();
      }
    }
    
  • Hey GoToLoop! I appreciate the mod a ton! I was just wondering if you could put a url to my website when you credit me? I need to start putting it in the code that I put online (still pretty new at Processing). I'm over at http://www.ocf.berkeley.edu/~keving/

    Thanks!

Sign In or Register to comment.