Help with Function (easing)

Processing Coding Questions
1

Hi there!
I am beginer to programming and i try to make a function for eg: easing:

float x;
float y;
float easing = 0.005;

void setup() {
  size(640, 360);
}

void easFunc(float a, float b, float c) {
  b = b+(a - b) * c;
}

void draw() { 
  background(51);


  easFunc(mouseX, x, easing);  
  easFunc(mouseY, y, easing); 

  ellipse(x, y, 66, 66);
}

but I think I’m on the wrong way…can anyone help me with this?

so far i am at about this level:
some of my things:

// my first dla...:)

FloatList tx, ty;
int db=200;
float[] x = new float[db]; 
float[] y = new float[db];
float dst ;

void setup() {
  size(1000, 1000);
  colorMode(HSB, 100);
  background(0, 0, 84);


  tx = new FloatList(-1000, 500);
  ty = new FloatList(-1000, 500);

  for (int i = 0; i < x.length; i++) { 
    x[i]=random(1000);
    y[i]=random(1000);
  }
}

void draw() {


  for (int i = 0; i < x.length-1; i++) {

    float angleToMouse = atan2(500-y[i], 500-x[i]);

    x[i] += cos(angleToMouse);
    y[i] += sin(angleToMouse);

    if (dist(500, 500, x[i], y[i])<1) {
      x[i]=random(1000);
      y[i]=random(1000);
    }


    for (int tt=0; tt<tx.size(); tt++) {
      for (int rr=0; rr<x.length; rr++) {
        dst=dist(x[rr], y[rr], tx.get(tt), ty.get(tt));
        if (dst<6) {

          tx.append(x[rr]);
          ty.append(y[rr]);
          line(x[rr], y[rr], tx.get(tt), ty.get(tt));
          //circle(x[rr],y[rr],6);
          x[rr]=random(1000);
          y[rr]=random(1000);
        }
      }
    }

    if (tx.size()>200) {
      tx.remove(0);
      ty.remove(0);
    }
  }
}

and

//find nearest

int d=12, db=1000, h=0, e; 

int[] core = new int[db];
int[] corel = new int[db];

float[] x = new float[db]; 
float[] y = new float[db]; 
float[] dst =new float[db];

FloatList xx = new FloatList(); 
FloatList yy= new FloatList(); 



void setup() {
  size(640, 660);
  colorMode(HSB, 100);
  for (int i = 0; i < x.length; i++) {
    xx.append(random(640));
    yy.append(random(660));
    x[i]=xx.get(i);
    y[i]=yy.get(i);
  }
}



void draw() {
  background(0,0,88);
  e++;
  for (int i = 0; i < xx.size(); i++) {

    dst[i]=dist(xx.get(h), yy.get(h), xx.get(i), yy.get(i));

    if (dst[i] ==0) {
      dst[i]=9000;
    }
  }

  for (int i = 0; i < xx.size(); i++) { 
    if (dst[i]<dst[d]) { 
      d=i;
    }
  }

  xx.set(h, -300);
  yy.set(h, -300);
  core[e]=d;
  corel[e]=core[e];
  h=d;


  corel[e-1] = corel[e];




  for (int i = 0; i < x.length-1; i++) {
    strokeWeight(1);
    stroke(0, 0, 0);
    point(x[i], y[i]);


    stroke(0);
    line(x[corel[i]], y[corel[i]], x[core[i]], y[core[i]]);
    rect(x[core[i]], y[core[i]], 2, 2);
  }
}

more…

void setup() {
  size(1000, 1000);
  colorMode(HSB, 100);
}

float q=0, w=1, n, nn, m, mm, l, k=100;
int c=0, t;


void draw() {
  background(23);
  q=0;
  nn=1;
  mm=1;
  for (int y=0; y<k; y++) {
    t=22;
    q=q+mm;
    mm=mm+nn;
    if (mm==t) {
      nn=-1;
    }
    if (mm==1) {
      nn=1;
    }


    w=0;
    n=1;
    m=0;
    l=0;
    for (int x=0; x<k; x++) {
      if (y%2==l) {
        l=1;
      }
      w=w+m;
      m=m+n;
      l++;
      c=9;
      if (l%2==0) {
        c=100;
      }


      if (m==t) {
        n=-1;
      }
      if (m==1) {
        n=1;
      }



      fill(30, 0, c);

      noStroke(); 
      rect(w, q, m, mm);
    }
  }
}

Thanks!

2

The function didn’t return the new value

try this

float x;
float y;
float easing = 0.005;

void setup() {
  size(640, 360);
}

float easFunc(float a, float b, float c) {
  b = b+(a - b) * c;
  return b;
}

void draw() { 
  background(51);

  x =  easFunc(mouseX, x, easing);  
  y =  easFunc(mouseY, y, easing); 

  ellipse(x, y, 
    66, 66);
}
1 Like
3

better naming



float x;
float y;
float easing = 0.005;

void setup() {
  size(640, 360);
}

float easFunc(float target, float oldPos, float easing) {
  float newPos = oldPos + (target - oldPos) * easing;
  return newPos;
}

void draw() { 
  background(51);

  x=  easFunc(mouseX, x, easing);  
  y=  easFunc(mouseY, y, easing); 

  ellipse(x, y, 66, 66);
}
2 Likes
4

thank you very much! You helped a lot! it works :star_struck:

1 Like