Coding Challenge #61: Fractal Spirograph

[ad_1]
In this coding challenge, I attempt to create a “Fractal Spirograph” with Processing (Java). The visuals are inspired by images and explanation on C. J. Chen’s blog:

Support this channel on Patreon:

Link to unedited version of this challenge:

Send me your questions and coding challenges!:

Contact:
Twitter:
The Coding Train website:

Links discussed in this video:
C.J.Chen’s blog on Fractal Spirograph:
My video on Polar Coordinates:
My Coding Challenge on 2D Solar System:

Source Code for the all Video Lessons:

p5.js:
Processing:

For More Coding Challenges:
For an Intro to Programming using p5.js:
For more videos about p5.js and Data:

Help us caption & translate this video!


Posted

in

by

Tags:

Comments

37 responses to “Coding Challenge #61: Fractal Spirograph”

  1. rosslahive Avatar

    Got through it from start to end 🙂

  2. Rob Lego Avatar

    Daniel is so hard on himself. He's really brilliant. Yes Dan, we are still watching… because it is amazing. I am trying to learn javascript by watching your videos. And thanks to you, I'm starting to get it. This guy has such a crazy knowledge of coding, and math, it's crazy.

  3. Benjamin S Avatar

    i am going to follow your coding in c# 😀

  4. LifE's YouTube Channel Avatar

    Can you make Tetris tutorial in Processing?

  5. Quiksand101 Avatar

    If you want to give the entire thing a flickering effect like in the GIF, just add noise to whole orbit

  6. Anwesome_coder Avatar

    Implemented my own fractal spirograph in html5 canvas with javascript es6. Here are the live demo and code.
    http://codepen.io/Anwesh43/pen/qrRywg

  7. Nathan Breunig Avatar

    I literally started adding con after all constructor variable names. I know how you feel. hahaha

  8. Gokalp Cetin Avatar

    Hey !
    I really like your challenges about Processing and I have a small question:
    I am trying to check a Bezier Curve Drawing programme on Processing but there is an issue for some reason.
    Could you please check it?
    Github Gist: https://gist.github.com/gokalpsterr/70e26fa715dd4005623c19328968a824
    Thank you

  9. MasterFlamaster Avatar

    Wow, you haven't abandoned Processing yet? YESSSSS

  10. Nick Ints Avatar

    22:00 You made a linked list!

  11. MINH HOANG Avatar

    like if you learn programing more from coding train than in school

  12. Khalid Khattak Avatar

    I really like the Parent child confusion and your expression… hahahhaahhahaha… children has no child and one of the parent has no parent…

  13. thepazkiller Avatar

    21:32
    You could've added to orbit's show function the following :
    if(child != null)
    child.show();

    no need for the loop

  14. shoutlike Avatar

    Hi, can you maybe do a video, in which you program Brachistochrones? More specifically a simulation of what is tested manually in this video https://www.youtube.com/watch?v=skvnj67YGmw&t=206s. That would be cool 🙂

  15. digitalArtform Avatar

    I noticed someone implement this in Houdini https://vimeo.com/206530599

  16. 小安 Avatar

    Thank you for your fantastic tutorials again
    here is my work: https://vimeo.com/206530599

  17. raedon 707 Avatar

    coding challenge : make a glitch effect video/image or anything.

  18. Whippy - Best Baby Kids Games - Learning Fun Avatar

    Hi Dan, we started using processing in class today. My professor showed us your tutorial on it! Very cool man, keep up the great work. Long time fan here.

  19. dark luffi Avatar

    Try k=+10, resolution=10 and 100
    its BEAUTIFUL

  20. dark luffi Avatar

    How do you separate things with a command?
    like ellipse(x,y,z,p);
    to ellipse(x, y, z, p);

  21. Charbel Sarkis Avatar

    has he made this in p5?

  22. SeeJay Too Avatar

    heya, daniel! i got inspired by this idea so i paused and had a go before coming back and watching how you did it. i'm surprised how many things i ended up doing similarly to you!

    my code: https://www.openprocessing.org/sketch/409963

    a couple of interesting things i did differently:
    – made the draw function use the linked structure; each orbiter draws itself and tells the child to draw.
    – made each object dumb to it's position, putting that information in the draw function's parameters. unintentionally, that's how i avoided keeping a reference to the parent
    – just a small one and a question: i tend to want to put draw() and update() code in one method. is there a particular reason you always write it with two separate functions?

    excellent video as always.

  23. ALL CAPS Avatar

    326 likes, 0 dislikes. WOW…. Impressive! (dislikes) xD jkjk <3 Love you

  24. Bruno Inec Avatar

    How did you resist calling it "be nice equation"?

  25. TechNerd01 Avatar

    Yes!!! This is what I tried to do but got the idea a bit messed up… Did the program properly… But not the rotation things cause I forgot the name of this…

  26. padronsk Avatar

    Hey mate! I don't know if somebody already pointed it out—but calculating k^(n-1) for each level is equivalent to multiplying each level's ang velocity by k with respect to the previous. That is the definition of the power function!

    So that change didn't do any difference. Just leave it as it was and save some calculations, mate 😀

  27. Bruno Signori Avatar

    use https://trackingjs.com/ to "learn", "recognize" and display objects name in the screen

  28. Rob Vogel Avatar

    I was doing this in p5js along with you and very often had to remind myself "this dot". The song was stuck in my head after awhile.
    P.S. I do see that you already converted this to p5js in your github page after i finished the video.

  29. William Macleod Avatar

    what makes you choose to do some coding challenges in Java(processing) vs JavaScript (p5)? thanks

  30. Nathan Olmstead Avatar

    Modify it so that the orbits alternate between being inside and outside the previous one. Say every odd level is outside it's parent and even is inside it's paerent

  31. xPinoyTribal Avatar

    Hey, what should i specialized in Computer Science: Algorithms, Embedded Systems and Architecture, or Networked Systems / Security. Can you label it from 1 – 3; where 1 is the most valuable field?

    I am often confused because I feel like algorithms is superior to all branches since it focuses on solving problems, but I feel like there is a lot more math rather than actual implementation…Network Systems can teach you cyber security, hacking, cryptography (Algorithms is important for this field I guess). And lastly Embedded System seems like it's fun because it allows you to control Software / Hardware and learn how to make your own electronics etc…Although it's fun I feel like it isnt valuable lol.

    Here are the different tracks offered at my school for BS http://catalogue.uci.edu/donaldbrenschoolofinformationandcomputersciences/departmentofcomputerscience/#majorstext

    Thank you!!! Love all the vidoes!

  32. Unity Blitz Avatar

    I have no idea how I found you since when I did, code wasn't even in my vocabulary.But been subbing for a while now and started to learn which was amazing! Right now I've finished my second month of a course I took for programming and absolutly love it!
    You have truly opened my eyes for math and writing code, you're my hero and idol!
    Thank you so much for creating your channel!

  33. Erik McCall Avatar

    sweet vid man! I was wondering if you could do more on 3d in p5? love your channel! thank you so much!

Leave a Reply

Your email address will not be published. Required fields are marked *