Combining two ideas often results in something much more interesting than each on their own: by using two for-loops and push/pop(), we can draw a grid of complex patterns using code that's easy to read and modify.
The nested for-loop walks a grid, one row at a time:
1. Y starts at the top of the canvas
2. Then we draw shapes across the full width
3. Y shifts down a row
4. We draw shapes across again
5. Repeat until y reaches the bottom
Inside each step, we enter "temporary" mode using push(), change the origin using translate(), then draw our shapes. This has the benefit of making our drawing commands relative at (0,0) and is a lot easier to modify.
🖥 [ Ссылка ]
ALL THE VIDEOS IN THIS UNIT
🎥 [ Ссылка ]
CHALLENGES
❓ Can you add rotation as well? Hint: you many need to translate to the center of the grid square instead of the upper-left corner
❓ Can you use the modulus (%) operator (returns the remainder of division) or a boolean variable to draw shapes of alternating color?
![](https://i.ytimg.com/vi/xBIDqz4udRc/mqdefault.jpg)