Coding Challenge 130: Fourier Transform Drawing with Complex Number Input

Other Parts of this Challenge:

References:

Videos:

Related Coding Challenges:

Timestamps:
0:00 Fourier Transform and Epicycles Part 3 - Complex Numbers
4:44 Complex numbers
6:06 Let's Code!
8:00 Create a Complex number class
13:37 Use "FOIL" to multiply complex numbers
17:13 Write an add function to add the real components / imaginary components together
22:02 Add a user-drawn path
24:27 Conclusion and suggestions for variations

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

#fouriertransformsquarewave #discretefouriertransform #epicyclesdrawing #javascript #p5js

[Hungryturtledev]

As an engineering nerd and professional programmer (and fellow youtuber) this sort of stuff really gets me going! Awesome job as always Dan :)

[Robber]

Wow.. This blows me away more than the fact that man went to space and are living there. It just blows my mind so much, just a bunch of circles rotating drawing such things? So damn awesome!

[dielfonelletab]

Would be super neat to turn an image into a Fourier series.
Maybe edge detection then vertex detection some kind of travelling salesman algorithm to find a path along those edges to get the points.

That'd be pretty dope.

[Matt]

I watched Mathologer's video about the Homer Simpson drawing, and his explanation of the Fourier Transform and the math behind it all. However, I never knew how EASY it actually is to do... Thanks for the videos!

[omargaber]

Thank you very much, I really appreciate the effort you put into this video
You are a genius teacher

[priyankamalviya]

You make every topic appear so simple! You are not just very knowledgeable, but an excellent teacher. Thank you so much for creating videos.I am trying to understand topics related to concurrency and wanted to request you to please consider making videos for the following problems:

i) Execute at most N tasks in parallel using JS promises or generators
ii) Implement an asynchronous concurrent priority queue
iii) Write your own version of V8’s event queue

[DrSpooglemon]

I absolutely love this channel. Daniel is a great teacher and an awesome person.

[FishFart]

Your videos are amazing and hilarious, thanks for all of your hard work in making these!

[svensbasteltisch]

I like your videos, you are an amazing tutor!

But I found two things I did not understand:
fourier.js, Line 30: k needs to be started at -N/2 running to N/2. if it runs from 0 to N you only have positive frequencies and your drawing machine does not hit the shape. After two hours examinating my calculations I changed the k-loop as mentioned and bamm! I hit my shape. Awesome!

[cleisonarmandomanriqueagui]

I am astonished ... amazing content one can learn thanks to your time and effort !!! thankssss

[SimonTiger]

Oh, by the way, this is the reason the circles were all "lined up" previously. As I said already, a real number is just a complex number with no imaginary component. So basically, the circles were drawing a 1-dimensional pencil sketch! An easy way to "fix" this is just to remove every other circle. It'll look more realistic. Or you can do the fourier transform with complex number input like Daniel did in this video!

[firephoenix]

I came too late in the stream to get most of this. Time to watch now!

[jenner]

i tried that code but, instead to sort by amps, sorted by frequencies, lower first, also begin from part of frequencies (from lower parts beginning); with increase count of wheels, when T is bigger than TWO_PI, just T decrease by TWO_PI, and don't clear previous path, instead to cut end, (you do it on earlier videos). Sorry for complex phrases ))) English is not my native. Result - I have a total mess in beginning, and it gradually draw a something, tried to reach a exact result of Coding Train ))). Very interesting result in live motion.

[aramavlad-alican]

Please make some C++ tutorials. Btw, you're the best coding "teacher" (if i can say so)that i know

[ihumbleyou]

thanks for helping me out bro! This helped me so much i kind of understand coding now !LOL!

[cknox]

I propose in epicycles() to subtract rotation instead of add.
x += radius * cos(freq * time + phase - rotation);
y += radius * sin(freq * time + phase - rotation);
Then the rotation will be correct. For instance:
let v = epicycles(width / 2, height / 2, 45, fourierX);

[Pawan.]

Keeps us motivating Sir, awesome coding challenge...

[chessdude]

Hello, new subscriber from Mike's channel. I always wanted to try coding. Here I go... :) Thumbs up on your channel!!

[djcarroll]

Very cool video! I'm quickly becoming obsessed with your channel. :) Just a heads up, we use the term "double distribute" now instead of foil. This is because foil only applies to the case of multiplying a binomial by another binomial and implies you're using a "trick", but you can always distribute, double distribute, triple distribute and so on and so forth and it is mathematically sound and flexible.

[aljazmedic]

Great episode 🙂
Now I have to go implement it by myself 😁
Keep up the good work 👍