Trying to make a cross on this grid

Just as the title explains. I managed to make one line go across the grid, but i’m not sure how to do the other line to create a cross. The idea is to make an expression just like “x===y” to automaticly make the other line to make a cross on the line grid.

The sketch link is: p5.js Web Editor


Explore the P5.js website.

This is in the Learn section:

You can try this in your code to help understand co-ordinates and print them:

  print(mouseX, mouseY);
  stroke(255, 0, 0);
  point(windowWidth/2, windowHeight/2);

It will not affect your code.
You can look up the references.


This is not what i mean. I’m trying to make a cross with the line grid, the lines that form a cross will have a stroke of 200 while the others will have 0. I already made one line “x===y” but i can’t find the logic of making the other line to make a cross with the grid.

You made a diagonal line \ with a nested for loop so that x and y both increase.

Now your next line is /

It’s from the upper right corner to the lower left corner.

So you make a nested for loop again, the y is again increasing (same). BUT what about the x? Where does it start, where does it end, what do you have to add?

I know the grid is a 20x20 being 20 invisible cuz it gets out of the screen, but stroke=200 if x=1 will make a vertical line on the first column. The x start on the top-left corner.

1 Like

I see.

You draw the entire grid but you have one condition to mark the diagonal line \ :

          if (x===y)

Now for the other side " / " the y is also increasing (line is going down), but this time the x value is decreasing: it starts with num_colunas and ends with 0.

can you express this in a formula where you use num_colunas and x :

          if (num_colunas......... === y)



1 Like

Thank you so much, i found the solution. Its really just a logical problem… it was that easy. Making a new variable “x2=num_colunas-x” and then adding on the condition “if (x===y || x2===y)” will make the / line.
My head was frying with this one, thank you so much.

1 Like