# Change line() color in a nested while-loop

**URL:** https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421
**Category:** Coding Questions
**Tags:** homework
**Created:** [January 11, 2019, 3:06pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421 "2019-01-11T15:06:42Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [January 11, 2019, 3:06pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/1 "2019-01-11T15:06:42Z")

</div>

I am doing a small assignment that requires the following:

I have to create a while-loop that draws 30 lines on-screen. Line number 7 and line number 23 should be colored red.

Because I am still trying to figure things out, I try to color the 2 nearest lines from stroke(0); to stroke(255);, but no matter what I try, I cannot get the 2 lines to change color

In this example I tried nesting a while loop, which so far doesn’t work. I also tried removing te nested while loop and add an “if” statement with the same variables (x == 40 && x == 60) but still nothings happens. What can I do to fix this?

```auto
var x = 20;
var stap = 20;
var stop = 600;

function setup () {
    createCanvas (700, 700);
}

function draw () {
    
    stroke(0);
    
    while(x < stop) {
    line(x, 60, x, 80);
    x += stap;
        
        while (x == 40 && x == 60) {
        stroke(255);
    } 
    }
}

```

---

<div class="post-metadata">

### Author: ![Whahahahaha](https://avatars.discourse-cdn.com/v4/letter/w/3be4f8/32.png) [@Whahahahaha](https://discourse.processing.org/u/Whahahahaha)
#### Post date: [January 11, 2019, 3:58pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/2 "2019-01-11T15:58:12Z")

</div>

@anon98404100 a few things:

- Processing, and I strongly believe P5.js as well, only update their screens at the end of the draw loop
- You’re changing the stroke AFTER you draw the line, then draw restarts, set stroke to 0 and draws again
- while (or if for that matter) x == 40 AND x == 60 never happens. x cannot be both 40 And 60 at the same time, use or: ||

Here’s your code with the proper changes, but note it does not draw all the lines at once, for that you’d need to store the x values in an array of some sorts and use a for loop to draw them

```auto
var x = 20;
var stap = 20;
var stop = 600;

function setup () {
  createcanvas(700, 700);
}

function draw () {

  stroke(0);
  if (x < stop) {
    if (x == 40 || x == 60) {
      stroke(255);
    }
    line(x, 60, x, 80);
    x += stap;
  }
}

```

Hope this solves your question 🙂

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [January 11, 2019, 4:17pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/3 "2019-01-11T16:17:51Z")

</div>

@Whahahahaha

Thank you! it works indeed 🙂

I added the ‘while’ loop that I needed for my assignment to it 🙂

```auto
while (x < stop) {
        
        stroke(0);
        
        if (x == 40 || x == 60) {
        stroke(255);
        }
        
    line(x, 60, x, 80);
    x += stap;
        
    }
}

```

and got the desired effect I was looking for :).

Sorry if the question is stupid, but could you tell me why I cannot put the

```auto
line(x, 60, x, 80);
x += stap;

```

right under the x\<stop equation, and before the if (x== 40 …)

like:

```auto
while (x < stop ) {

stroke(0);
line(x, 60, x, 80);
    x += stap;

   if (x == 40 || x == 60) {
      stroke(255);
    }
  }
}

```

it just seems like it is in the same position either way (as in being inside the while loop) but just getting added later. Or does it need to do the equation/counting first before it should draw?

---

<div class="post-metadata">

### Author: ![Kevin](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kevin/32/2297_2.png) [@Kevin](https://discourse.processing.org/u/Kevin)
#### Post date: [January 11, 2019, 6:18pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/4 "2019-01-11T18:18:45Z")

</div>

If you post to multiple sites, please link between those posts so we know what help you’ve already received. This question has also been asked (and answered) here:

> <https://stackoverflow.com/questions/54149280/p5-js-how-can-i-change-line-color-in-a-while-loop-on-specific-x-values>

---

<div class="post-metadata">

### Author: ![TfGuy44](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/tfguy44/32/41_2.png) [@TfGuy44](https://discourse.processing.org/u/TfGuy44)
#### Post date: [January 11, 2019, 7:39pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/5 "2019-01-11T19:39:13Z")

</div>

A painter does not touch brush to canvas and then pick which color paint to use afterwards.

The painter picks which color paint to use, and then paints with it.

Like a painter, you should pick which color you want your lines to be… and then draw them.

This is why stroke() and fill() calls should come first.

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [January 11, 2019, 8:29pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/6 "2019-01-11T20:29:29Z")

</div>

Sorry about that. I am used to the fact that I sometimes do not get a response on 1 site, which makes me inclined to post it on another for good meassure.

When i got my first answer on stackoverflow, it unfortunately wasnt the answer I could use (actual javascript and not P5) and later on got the answer here before others started to comment i believe.

But wont happen again. Will stick it to 1 post at a time.

---

<div class="post-metadata">

### Author: ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [January 28, 2019, 8:23pm UTC](https://discourse.processing.org/t/change-line-color-in-a-nested-while-loop/7421/7 "2019-01-28T20:23:46Z")

</div>

> [@anon98404100](#):
>
> Will stick it to 1 post at a time

@anon98404100 – you don’t have to stick to 1 post at a time! Just link to those posts.

1. post to [stackoverflow.com](http://stackoverflow.com)
2. post to [processing.org](http://processing.org)
3. on [processing.org](http://processing.org), add a link to the stackoverflow post
4. on [stackoverflow.com](http://stackoverflow.com), add a link to the [processing.org](http://processing.org) post.

That way people can look at both when seeing whta help you have already received, and they won’t waste time repeating others.
