-1

I have a for loop that draws lines in a certain direction. In the for loop, I want to change the color of the line using random numbers. But for some reason it doesn't work.

Here is the code:

for (var i = 0; i < 11; i++) {
  random1 = randomNumber(0, 255);
  random2 = randomNumber(0, 255);
  random3 = randomNumber(0, 255);
  
  stroke(rgb(random1, random2, random3));
  liftUp();
  backward(100);
  turnLeft(45);
  forward(200);
  random1 = randomNumber(0, 255);
  random2 = randomNumber(0, 255);
  random3 = randomNumber(0, 255);
  
  stroke(rgb(random1, random2, random3));
  liftDown();
  backward(150);
  turnRight(45);
  forward(150);
  turnRight(135);
  forward(150);
}
Zues
  • 307
  • 5
  • 12
  • 1
    What are the functions used? – FZs Jul 11 '21 at 07:18
  • 1
    What does that randomNumber function do? can you provide details on what you've tried? If its a custom function, provide randomNumber function code as well. – dee Jul 11 '21 at 07:18

2 Answers2

0

not sure, but that's my analyze

You're using the same variable, random1, 2, 3 to draw two different line.

I do not know how stroke() should draw your line, but since you're changing random1, 2, 3 to then reuse them into the second stroke() method you'll change the reference of the first stroke, which may result on draying twice the same line.

+ you seems to be declaring this variable outside the for loop.

What may be a quick fix could be the following

Edit: you can use either the first or second randomNumber() function below taken from this question

/**
 * Returns a random number between min (inclusive) and max (exclusive)
 */
function randomNumber(min, max) {
    return Math.random() * (max - min) + min;
}

/**
 * Returns a random integer between min (inclusive) and max (inclusive).
 * The value is no lower than min (or the next integer greater than min
 * if min isn't an integer) and no greater than max (or the next integer
 * lower than max if max isn't an integer).
 * Using Math.round() will give you a non-uniform distribution!
 */
function randomNumber(min, max) {
    min = Math.ceil(min);
    max = Math.floor(max);
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

for (var i = 0; i < 11; i++) {
  
  stroke(rgb(randomNumber(0, 255), randomNumber(0, 255), randomNumber(0, 255)));
  liftUp();
  backward(100);
  turnLeft(45);
  forward(200);
  
  stroke(rgb(randomNumber(0, 255), randomNumber(0, 255), randomNumber(0, 255)));
  liftDown();
  backward(150);
  turnRight(45);
  forward(150);
  turnRight(135);
  forward(150);
}

Didn't test it, but this is the only logical way of solving your problem.

Raphaël Balet
  • 6,334
  • 6
  • 41
  • 78
  • 1
    This is not how JavaScript works. Primitives are not passed to a function by reference, they are just copied. Your explanation is wrong. – Yuriy Yakym Jul 11 '21 at 08:51
  • Thx @YuriyYakym I did remove the explanation to avoid any misleading. Could you explain me why the code wasn't working then ? I'll update my answer then – Raphaël Balet Jul 11 '21 at 16:48
0

I like @Raphael Balet's start, but I would edit a little farther. I'm assuming your using liftUp() like penUp()(API) and liftDown() like penDown() in AppLab

For general reference here is Code.org's randomNumber() API

Old Code with Comments

for (var i = 0; i < 11; i++) {
  stroke(rgb(randomNumber(0, 255), randomNumber(0, 255), randomNumber(0, 255)));
  //since lifting up no line drawn till pen placed back down
  liftUp();
  //So this code does nothing but reposition pen (so color #1 never seen :-(  )
  backward(100);
  turnLeft(45);
  forward(200);
  
  //New color
  stroke(rgb(randomNumber(0, 255), randomNumber(0, 255), randomNumber(0, 255)));
  //Pen down so will see output
  liftDown();
  backward(150);
  turnRight(45);
  forward(150);
  turnRight(135);
  forward(150);
}

New Code

for (var i = 0; i < 11; i++) {
  //reposition pen, needed?
  backward(100);
  turnLeft(45);
  forward(200);

  //Set Color
  var r = randomNumber(0, 255);
  var g = randomNumber(0, 255);
  var b = randomNumber(0, 255);
  stroke(rgb(r, g, b));

  //lower drawing implement
  liftDown();
  //Drive!
  backward(150);
  turnRight(45);
  forward(150);
  turnRight(135);
  forward(150);
}