Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Processing code to demonstrate seamless loop of 1D noise
// Processing 3.0x code to demonstrate seamless loop of 1D noise
// Inspired by, and created in support of:
// "Drawing from noise, and then making animated loopy GIFs from there" by Etienne Jacob (@n_disorder)
// https://necessarydisorder.wordpress.com/2017/11/15/drawing-from-noise-and-then-making-animated-loopy-gifs-from-there/
// Note: this program has no dependencies, and does not require SimplexNoise.
// Demo GIF: https://media.giphy.com/media/xUOxeU2ELSPeTbevle/giphy.gif or http://gph.is/2Ah5kqG
PGraphics offscreenImg;
float myScale = 0.01;
float radius = 100.0;
int nSteps = 150;
float myLoopingNoiseArray[];
void setup() {
size(300, 400);
makeOffscreenImg();
myLoopingNoiseArray = new float[nSteps];
}
void draw() {
background(0);
image(offscreenImg, 0, 0);
int currStep = frameCount%nSteps;
float t = map(currStep, 0, nSteps, 0, TWO_PI);
float px = width/2.0 + radius * cos(t);
float py = width/2.0 + radius * sin(t);
noStroke();
fill(255);
ellipse(px, py, 7, 7);
float noiseAtLoc = height - 100.0*noise(myScale*px, myScale*py);
myLoopingNoiseArray[currStep] = noiseAtLoc;
noFill();
stroke(255);
beginShape();
for (int i=0; i<nSteps; i++) {
float nx = map(i, 0, nSteps-1, 0, width);
float ny = myLoopingNoiseArray[i];
vertex(nx, ny);
}
endShape();
noStroke();
fill(255);
float ex = map(currStep, 0, nSteps-1, 0, width);
ellipse(ex, noiseAtLoc, 7, 7);
// Save frames for the purpose of
// making an animated GIF loop,
// e.g. with http://gifmaker.me/
if ((frameCount >= nSteps) && (frameCount < (nSteps*2))) {
saveFrame( "save/"+ nf(currStep, 3)+ ".jpg");
}
}
// Stash an image of the noise field.
// Doing so is faster than recomputing it every frame.
void makeOffscreenImg() {
offscreenImg = createGraphics(width, width);
offscreenImg.beginDraw();
for (int x = 0; x<width; x++) {
for (int y = 0; y<width; y++) {
offscreenImg.stroke(255.0*noise(myScale*x, myScale*y));
offscreenImg.point(x, y);
}
}
offscreenImg.endDraw();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.