# Perlin Noise Loop Array

**URL:** https://discourse.processing.org/t/perlin-noise-loop-array/5265
**Category:** Coding Questions
**Created:** [November 6, 2018, 4:09pm UTC](https://discourse.processing.org/t/perlin-noise-loop-array/5265 "2018-11-06T16:09:41Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![ronantuite](https://avatars.discourse-cdn.com/v4/letter/r/58956e/32.png) [@ronantuite](https://discourse.processing.org/u/ronantuite)
#### Post date: [November 6, 2018, 4:09pm UTC](https://discourse.processing.org/t/perlin-noise-loop-array/5265/1 "2018-11-06T16:09:42Z")

</div>

Ive been stuck on the problem of drawing an array of zig-zag lines that uses Perlin Nosie to create the zig-zag. Im drawing the lines in the draw function which updates the points on the line continuously, making the lines jump around the sketch.

My problem is that I do not want the lines to animate but to use one set of points for each line continuously. The sketch can not use noLoop() as if effects other parts of the project which aren’t included here.

If anyone might be able to help I would be very appreciative.

int numLines = 10;  
int noiseValues = 5;

Lines[] lines = new Lines[numLines];  
float xoff = 0;  
float inc = 0.1;  
float[] yNoise = new float[noiseValues];

Lines l1;  
Lines l2;  
Lines l3;

void setup() {  
size(500, 500);  
frameRate(60);

l1 = new Lines(0, 0, 10);  
l2 = new Lines(0, 0, 20);  
l3 = new Lines(0, 0, 30);

}

void draw() {  
background(0);  
translate(250, 250);  
l1.display();  
l1.update();

//translate(250, 250);  
//rotate(10);  
l2.display();  
l2.update();

//translate(0, 0);  
//rotate(10);  
l3.display();  
l3.update();

}

class Lines {  
float x;  
float y;  
float r;

Lines(float \_x, float \_y, float \_r) {  
x = \_x;  
y = \_y;  
r = \_r;  
}

void update(){  
rotate®;  
noFill();  
strokeWeight(2);  
stroke(255, 0, 100);  
float [] n = nValues(yNoise);  
println(n);

}

float[] nValues(float[] yNoise) {  
for (int i = 0; i \< yNoise.length; i++) {  
yNoise[i] = map(noise(xoff), 0, 1, 0, 200);  
xoff += inc;  
//noLoop();  
}  
return yNoise;  
}

void display() {  
pushMatrix();  
beginShape();  
for(int j = 0; j \< noiseValues; j++){  
float x = j \* 20;  
float y = yNoise[j];  
vertex(x,y);  
}  
endShape();  
popMatrix();  
}  
}

---

<div class="post-metadata">

### Author: ![hamoid](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hamoid/32/58_2.png) [@hamoid](https://discourse.processing.org/u/hamoid)
#### Post date: [November 6, 2018, 9:01pm UTC](https://discourse.processing.org/t/perlin-noise-loop-array/5265/2 "2018-11-06T21:01:04Z")

</div>

Hi. Your `xoff` variable always increases, so the lines always change. What you could do is to initialize the `xoff` variable to a known value before redrawing the lines, so you get the same noise values again.

---

<div class="post-metadata">

### Author: ![ronantuite](https://avatars.discourse-cdn.com/v4/letter/r/58956e/32.png) [@ronantuite](https://discourse.processing.org/u/ronantuite)
#### Post date: [November 6, 2018, 9:17pm UTC](https://discourse.processing.org/t/perlin-noise-loop-array/5265/3 "2018-11-06T21:17:58Z")

</div>

Thanks Hamoid, I finally got in working the xoff should have been in the display function right after beginShape(); that way it would have started at zero once the previous line was drawn.