Skip to content

Instantly share code, notes, and snippets.

@jochasinga
Created December 8, 2015 20:09
Show Gist options
  • Save jochasinga/7e8ce032e9e656e6b203 to your computer and use it in GitHub Desktop.
Save jochasinga/7e8ce032e9e656e6b203 to your computer and use it in GitHub Desktop.
Basic easing in Processing
float x;
float y;
// This is the easing factor, the more the faster the (x, y) reach the target
float easing = 0.05;
void setup() {
size(640, 360);
noStroke();
}
void draw() {
background(51);
// the eventual targeted x-coordinate for the circle (the mouse's position)
float targetX = mouseX;
// delta of x: as the frame loops, dx becomes less and less
float dx = targetX - x;
// Progress the circle's x coordinate by delta x times easing factor per frame
// as it approaches the targetX, dx keeps decreasing and so is x
x += dx * easing;
// Same goes with Y
float targetY = mouseY;
float dy = targetY - y;
y += dy * easing;
ellipse(x, y, 66, 66);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment