# Painting with math **URL:** \ **Category:** Show & Tell\ **Tags:** graphics-and-math\ **Created:** [March 5, 2025, 10:11pm UTC](https://forum.makecode.com/t/painting-with-math/34320 "2025-03-05T22:11:37Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 5, 2025, 10:11pm UTC](https://forum.makecode.com/t/painting-with-math/34320/1 "2025-03-05T22:11:37Z")
This is my _attempt_ at using graphics and math! Don’t set the iteration speed to be too high, or… ![gif](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/9/c/9c383906bf90821ca99868d4760de63632f97e23.gif) You know. For that reason I have set the max speed to be 3 digit, or 999 \* 2 in the forever loop. Testing revealed that my computer could handle 10000 \* 2 iterations but pretty laggy. I could even do more but really slowly. Try changing the colours in my very messy code to see some half colour light combination stuff happening. Enjoy! > **[Random painting](https://arcade.makecode.com/S90502-46215-44343-08435)** > > Made with ❤️ in Microsoft MakeCode Arcade. ---
**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\ **Post date:** [March 6, 2025, 12:56am UTC](https://forum.makecode.com/t/painting-with-math/34320/2 "2025-03-06T00:56:09Z")
![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/d/f/dfe354df12be43844f230b148f7269bbb2fb1a8a.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/7/0/7010963051af434ccca1efabe3cac55797dd6713.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/f/0/f018c1cc8e7a6921dbe018311185fe4bcaa2a562.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/6/f/6f41cd2f9eac5bf51fe23e17fcd13ff99900af63.png) woah i love it!!! ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 6, 2025, 12:57pm UTC](https://forum.makecode.com/t/painting-with-math/34320/3 "2025-03-06T12:57:52Z")
Thanks a lot!!! I love how it looks pink and I originally had read and green for a weird yellow ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 10, 2025, 10:36pm UTC](https://forum.makecode.com/t/painting-with-math/34320/4 "2025-03-10T22:36:28Z")
Update!!! This now gets different colour pallets and different colours every time it hits the outside bounds. This is made possible due to @UnsignedArduino and the ColourBlock extension!!! Try setting speed to 5000, 4000, 3000, or 2000, and click A to change colours! Also B pauses the game so try using that and then switching colours. This is me switching colours while paused! > **[Random painting](https://arcade.makecode.com/S90502-46215-44343-08435)** > > Made with ❤️ in Microsoft MakeCode Arcade. ---
**Author:** ![CodeOnTheCob](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/codeonthecob/32/19306_2.png) [@CodeOnTheCob](https://forum.makecode.com/u/CodeOnTheCob)\ **Post date:** [March 10, 2025, 11:08pm UTC](https://forum.makecode.com/t/painting-with-math/34320/5 "2025-03-10T23:08:25Z")
yea cool i made a thing called making image out of array [https://makecode.com/\_YtPLgtczY8xg](https://makecode.com/_YtPLgtczY8xg) also you have to edit the array with number form 1-15 ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 11, 2025, 1:28am UTC](https://forum.makecode.com/t/painting-with-math/34320/6 "2025-03-11T01:28:04Z")
This is different though because it uses no sprites whatsoever, it is not creating a sprite for every pixel or making a sprite for the whole thing. I am just updating an image the is the background. ---
**Author:** ![CodeOnTheCob](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/codeonthecob/32/19306_2.png) [@CodeOnTheCob](https://forum.makecode.com/u/CodeOnTheCob)\ **Post date:** [March 11, 2025, 1:36am UTC](https://forum.makecode.com/t/painting-with-math/34320/7 "2025-03-11T01:36:45Z")
oh (sentence) ---
**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\ **Post date:** [March 12, 2025, 2:04am UTC](https://forum.makecode.com/t/painting-with-math/34320/8 "2025-03-12T02:04:09Z")
![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/3/7/37032526bf010e5fdda0fa14e48f9cdbabd99cfd.png) oooh i got a nice taiga biome, lots of savannah, some desert and snowy plains too + a sprinkle of deep ocean and plains ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 12, 2025, 2:23am UTC](https://forum.makecode.com/t/painting-with-math/34320/9 "2025-03-12T02:23:18Z")
Haha this version is funny! ---
**Author:** ![AgentBoom](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/agentboom/32/16635_2.png) [@AgentBoom](https://forum.makecode.com/u/AgentBoom)\ **Post date:** [March 12, 2025, 5:19pm UTC](https://forum.makecode.com/t/painting-with-math/34320/10 "2025-03-12T17:19:00Z")
Imagine making a game where the stuff painted on the screen is the randomly generated tilemap you must advance through… crazy stuff… ---
**Author:** ![Luke](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/luke/32/32519_2.png) [@Luke](https://forum.makecode.com/u/Luke)\ **Post date:** [March 12, 2025, 6:13pm UTC](https://forum.makecode.com/t/painting-with-math/34320/11 "2025-03-12T18:13:47Z")
Pretty cool how many methods of procedural generation there are, Perlin noise, wave function collapse, fractals etc ---
**Author:** ![eanders](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/eanders/32/3134_2.png) [@eanders](https://forum.makecode.com/u/eanders)\ **Post date:** [March 12, 2025, 7:20pm UTC](https://forum.makecode.com/t/painting-with-math/34320/12 "2025-03-12T19:20:45Z")
@BotWarrior this is so cool! Here’s something similar I did a while back, drawing wavy lines: > **[wavy lines](https://arcade.makecode.com/S91075-58886-37934-58001)** > > Made with ❤️ in Microsoft MakeCode Arcade. For the randomness, it uses [Fractal Brownian Motion](https://thebookofshaders.com/13/) - basically just a precalculated table of layered Perlin Noise. Total overkill for a simple effect like this, but it’s what I did :). A simpler approach might be to just stack and jitter a few sine waves at different frequencies. ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 12, 2025, 8:02pm UTC](https://forum.makecode.com/t/painting-with-math/34320/13 "2025-03-12T20:02:40Z")
Wow that is complicated! I just kind of exploded colour onto the screen! 🤣 I play a game called rim world with a mod that allows you to create geographical landforms with periin noise and stuff. I understand how complicated that can all get. 😃 ![Screenshot 2025-03-13 at 06.54.07](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/4/b/4b74350fb009c5a6f1d64b922020981e726064d7.png) Sadly I couldn’t understand much of your code, (GRAY BLOCKS!!!) but I am very interested at using lines to draw to screen. I am currently trying to use math and lines to create a game, but since the screen moves, the image gets offset if you understand what I mean. Could you maybe take a look through this? (A to change which laser you are moving) > **[laser!](https://arcade.makecode.com/S79338-40159-44781-54411)** > > Made with ❤️ in Microsoft MakeCode Arcade. ---
**Author:** ![eanders](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/eanders/32/3134_2.png) [@eanders](https://forum.makecode.com/u/eanders)\ **Post date:** [March 13, 2025, 4:28am UTC](https://forum.makecode.com/t/painting-with-math/34320/14 "2025-03-13T04:28:16Z")
Ya the code behind my wavy lines is unreasonably complicated. What appears in the gray blocks is just test code. The code to draw the lines is in another file (switch to JavaScript to see that). I had a look at your laser code, and you’re very close to having it working! I see that you’re creating a sprite for use as the laser, and drawing a line on its image every frame or so. That’s very clever as you can take advantage of Sprite’s per-pixel collision detection to detect when the laser intersects something! I also like how you’re using another sprite to center the camera on. One thing I noticed is that the laser’s length can be longer than the screen size, so I ended up recreating the laser sprite each time to be the size of the line’s bounding box. Sometimes it will be smaller than the screen, sometimes larger, depending on where the fireballs are positioned. Next issue is getting the line endpoints into the right coordinates for drawing to the laser sprite’s image. This is a bit tricky, because you’re mixing sprite and image coordinates, and the two have different origins. A sprite’s origin is in the center, whereas an image’s origin is in the upper-left corner. I added some code to calculate these coordinates. Anyway, have a look and let me know what you think of the approach: > **[laser! (edited)](https://arcade.makecode.com/S86211-77452-62094-83288)** > > Made with ❤️ in Microsoft MakeCode Arcade. Sorry about all the renamed variables! I switched to JavaScript and made some edits, which replaced spaces with underscores. ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 13, 2025, 12:06pm UTC](https://forum.makecode.com/t/painting-with-math/34320/15 "2025-03-13T12:06:34Z")
Thank you so much!!! I was really stumped and was nearly ready to throw the project away. I love how it can manage of screen and diagonals, but at basically 180 degrees relative to one another, it cuts out some bits of the laser. ![Screenshot 2025-03-13 at 17.44.43](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/1/a/1a7540f305651d16577941b457a68b6597408937.png) Do you know what could be causing this behaviour? ---
**Author:** ![eanders](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/eanders/32/3134_2.png) [@eanders](https://forum.makecode.com/u/eanders)\ **Post date:** [March 13, 2025, 4:12pm UTC](https://forum.makecode.com/t/painting-with-math/34320/16 "2025-03-13T16:12:45Z")
Oops! When the line is perfectly vertical, the width of the laser bounding box will be zero (and similarly for perfectly horizontal). Just need to make sure that can’t happen. Here’s one way to handle it: ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/1/e/1eec4e58002cbc99158a5865c24c10435a51af26.png) ---
**Author:** ![eanders](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/eanders/32/3134_2.png) [@eanders](https://forum.makecode.com/u/eanders)\ **Post date:** [March 13, 2025, 4:15pm UTC](https://forum.makecode.com/t/painting-with-math/34320/17 "2025-03-13T16:15:33Z")
Although, there may be an off-by-one error happening, so always adding 1 to `laser_width` and `laser_height` might be a better solution. ---
**Author:** ![eanders](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/eanders/32/3134_2.png) [@eanders](https://forum.makecode.com/u/eanders)\ **Post date:** [March 13, 2025, 4:18pm UTC](https://forum.makecode.com/t/painting-with-math/34320/18 "2025-03-13T16:18:14Z")
Yep, this gives better results: ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/b/3/b396d86dc3c083048ef5f456a2280f1cd06578d6.png) ---
**Author:** ![Danny\_Devention](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/danny_devention/32/30134_2.png) [@Danny\_Devention](https://forum.makecode.com/u/Danny_Devention)\ **Post date:** [March 13, 2025, 6:31pm UTC](https://forum.makecode.com/t/painting-with-math/34320/19 "2025-03-13T18:31:16Z")
you could make ![Guardian Stalker - Zelda Dungeon Wiki, a The Legend of Zelda wiki](https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRthWRTc1F6oK9cZOZd7Li9kdfCW8Hs-RVvUQ&s) ---
**Author:** ![BotWarrior](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/botwarrior/32/25328_2.png) [@BotWarrior](https://forum.makecode.com/u/BotWarrior)\ **Post date:** [March 13, 2025, 9:20pm UTC](https://forum.makecode.com/t/painting-with-math/34320/20 "2025-03-13T21:20:59Z")
Thanks a lot! [Next page](https://forum.makecode.com/t/painting-with-math/34320.md?page=2)