Coding the Hilbert Curve

Подписаться 1,7 млн

Просмотров 108 тыс.

50% 1

Coding in the Cabana is a series where I attempt challenges from my garden cabana in Brooklyn, NY. In this episode, I animate the path of the classic "space filling curve" known as the Hilbert Curve. Code: thecodingtrain.com/challenges...
🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/s...
🎥 All videos: • Coding Challenges
References:
🗄 Hilbert Curve Wikipedia: en.wikipedia.org/wiki/Hilbert...
🔁 Iterative algorithm for drawing Hilbert curve by Marcin Chwedczuk:
Videos:
🎥 Hilbert's Curve: Is infinite math useful?: • Hilbert's Curve: Is in...
Timestamps:
0:00 Introduction
0:58 The Hilbert Curve
7:03 Hilbert Curve: First Iteration
11:38 Adding Higher Orders
23:04 Filling Space
24:55 Adding Color
24:55 Conclusions and Ideas
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
🚂 Website: thecodingtrain.com/
👾 Share Your Creation! thecodingtrain.com/guides/pas...
🚩 Suggest Topics: github.com/CodingTrain/Sugges...
💡 GitHub: github.com/CodingTrain
💬 Discord: thecodingtrain.com/discord
💖 Membership: ru-vid.comjoin
🛒 Store: standard.tv/codingtrain
🖋️ Twitter: / thecodingtrain
📸 Instagram: / the.coding.train
🎥 Coding Challenges: • Coding Challenges
🎥 Intro to Programming: • Start learning here!
🔗 p5.js: p5js.org
🔗 p5.js Web Editor: editor.p5js.org/
🔗 Processing: processing.org
📄 Code of Conduct: github.com/CodingTrain/Code-o...
This description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecod...
#hilbertcurve #iterativealgorithm #spacefilling #processing

Опубликовано:

2 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 261

@CrashingThunder 4 года назад

"Nobody is watching this on a television" Yeah, about that...

@Diamonddrake 4 года назад

CrashingThunder me too

@TheLostSorcerer 4 года назад

Using my TV as a second monitor so yea...

@TheBytesCode 4 года назад

Came here to say this.

@KeithKritselis 4 года назад

Ditto, thanks Roku. 😁

@brmveen56 4 года назад

Here, here.

@anthonycannet1305 4 года назад

Catchphrase: “I’ll see you at the next stop” Like how trains stop at each station

@coolankush100 4 года назад

The thought is beautiful and wholesome. Hope Coding Train adopts it.

@silviugrada3561 4 года назад

please keep doing these. You are the reason I started to genuinely enjoy programming :))

@amund8767 4 года назад

They way he get things wrong really help me to not feel so anxious by making mistakes on my own projects. He Just makes mistakes look "fun" that really motivates me to pickup old projects from earlier

@pixelpox11 4 года назад

@@amund8767 I can relate. Truly the Bob Ross of programming.

@MrSyNRG 6 месяцев назад

he cordially codes in the cold cabana, regardless of the condensation conundrum

@generic6ixty5ive 4 года назад

This may be the single best series out there

@oshgnacknak72 4 года назад

Catchphrase: Remind me to refactor this later, bye

@amund8767 4 года назад

"Nobody is watching this on a televison" I feel attacked

@TheCodingTrain 4 года назад

As usual I’m terribly misguided in my understand of the world!

@GrinyaPLAY 4 года назад

I prefer TV to watch the coding train too! David, can I ask you to make video about different splines, but not Bézier curves?! Thanks!

@reyariass 3 года назад

I’m watching this on tv too! Blast it on my speakers so the neighbors can be interested! (Just kidding on that last bit)

@johanrojassoderman5590 4 года назад

17:00 float len = order; v.x += order ... Yep, seems about right xD

@arnavsirigere2877 4 года назад

I watched 3blue1brown's video on the Hilbert curve a while ago........ I can already tell this video is gonna be fun

@SkyeMpuremagic 7 месяцев назад

I'm not even a programmer and I enjoyed watching this from beginning to end! Even lifted my spirits a bit because the coder has such a bright and fun personality. Loved the finished result. Screenshot it so I could share it with others. Thank you for this!

@TheCodingTrain 7 месяцев назад

How did you find this video?

@SkyeMpuremagic 7 месяцев назад

@@TheCodingTrain It was recommended to me. I'm into studying a bunch of things. Mathematics/physics... Weird mysticism stuff 😆 I watched a numberphile video on The Hilbert Curve and I think that's why it was recommended by RU-vid for me 🤷 I'm really interested in watching lectures on topology & geometric knots. 😅 I get around LOL!

@szymoniak75 4 года назад

I love the fact you are always happy and smiling it's so cheering

@truthteller4689 4 года назад

Your catchphrase should be: "Goodbye, and don't forget the this dot."

@gabrielmoreno4135 4 года назад

And after that, a "Choo choo!". That would be the perfect catchphrase!

@qcdiamond8292 4 года назад

Meh

@jaredbowen827 4 года назад

Drop "the" , then it would be better.

@scottstensland Месяц назад

funny how I instinctively guessed this was filmed in Brooklyn by seeing the opening snowing scene --- Brooklyn just has a unique architectural look --- justifiably nonplus yet pervasive block after block

@ruben_meerman 4 месяца назад

I love your enthusiasm Mister Shiffman! This is wonderful

@catapillie 4 года назад

This is so sweet! I'm also very excited for the new nature of code series! Keep up man :)

@deadphim Год назад

truly the famous last words every programmer has uttered at one point

@wilstaley9479 4 года назад

Love how the animation finishes right at the end of the video!

@sanderbos4243 4 года назад

Loved the editing on this episode!

@anasadeelallawala4156 4 года назад

Who could possibly dislike such a wonderful video like this. Thumbs up to you Dan!

@monsieuralexandergulbu3678 4 года назад

it’s so homely, it’s so nice to see and hear you, keep shooting the video, and keep your joy to yourself always!

@CSGOClips12 4 года назад

wow, i was watching 3b1b's video literally 30mins before this got uploaded, and wanted to draw it in processing and now u post this, that's amazing.

@D00FY98 3 года назад

These videos are amazing. I used to hate coding but after watching and following along with a few of your vids I’m starting to love it. There’s so many Amazing possibilities!

@Djzaamir 4 года назад

Thank you for making programming so much fun. I have learned so many maths concepts from your coding videos. Thank you much :)

@mikenguyen9826 4 года назад

love this series. very soothing and calming, especially in my moments of feebleness. thank you.

@olbluelips 4 года назад

I love your Coding in the Cabana series! It's really like how I program for fun -- just play around with math, noise, cellular automata, and procedural generation in a creative/artistic way. It's soo much fun and every once in a while you discover something really cool! :)

@AntonPanchishin 4 года назад

Great video, I love the very personal feel of the cabana!! It is fantastic that you show the whole process of coding, including planning, research, errors, and debugging.

@felipedelgado4328 3 года назад

Love your work and your passion for programming. It is really inspiring, best wishes from Chile.

@Ouro17 4 года назад

Wonderfully explained! Thank you so much and please! Keep warm! I suffered watching you coding in that cold!

@stellanadais Год назад

I watched on my TV, great coding, I had fun, thanks!

@zacharymcarthur9013 4 года назад

I only ever watch you on my TV. Loved this, very interesting.

@live_destin-3408 4 года назад

"You guys are probably screeming at you're television, nobodys watching this on television..." well umm Im actully doing both... my dog thinks im crazy

@redhen 4 года назад

Perhaps a random catch-phrase generator is in need :) Perhaps the excitement this would bring at the end of each episode would be too overwhelming, however. Thanks for the maths, Uncle Shiffles x

@BradleyDunlap 4 года назад

Awesome video. Thanks for enduring the cold for us!

@turzim_uai 4 года назад

Hey, just saw all the Cabana videos today, and I loved them all! Maybe the next one could be a tutorial on how to plant all those beautiful flowers from the previous episodes! The timing couldn't be better, since you guys at the northern hemisphere are entering Spring haha. Cheers!

@RandomHamster 4 года назад

Wow that looks really cold!

@lalit_096 2 года назад

love the way you code ...

@arjuns.3752 4 года назад

I love what u do Never stop it

@beron_the_colossus 4 года назад

Ooh great topic with a great venue!

@neeharikaroyal9293 4 года назад

Colour ful animation😍 I am excited when I am watching the coding👏👌🙂

@alikellaway3901 2 года назад

I know this video is fairly old now; I implemented this in java with java fx recently for a project (super helpful video, thank you!). I found you get a really cool fractal effect if you draw the order 8 curve in 1024x1024 window and only draw the line if the point you are drawing's index modulus 1.5 is 0. You get some really cool and wacky effects if you change the order or the 1.5 to other values. Take a look and let me know what you think! private void draw() { for (int i = 1; I < path.length; i++) { // Start at one so we can draw backwards. double hue = map(i, path.length); gc.setStroke(Color.hsb(hue, 1, 1)); try { // Draw the line if (i % 1.5 != 0) { gc.strokeLine(path[i].getX(), path[i].getY(), path[i - 1].getX(), path[i - 1].getY()); } } catch (IndexOutOfBoundsException ignored) { } } } private double map(float coordinateIndex, float maxIndex) { return (coordinateIndex/maxIndex) * 360; // Note that when using the hue value in the hsb method, it will loop round to red } Not sure where I can post an image of it so that's why I am dumping here. Let me know if you try it or where I could post the result! P.S. This is not my actual draw function, this is a simplified version since I had to optimise mine for an AnimationTimer class.

@Mihai-mb4ew 4 года назад

Amazing video, much love from Romania!

@solsticeprojekt1937 4 года назад

Dude, you're awesome! I'm sitting under my (diagonal) window a lot, even when it's winter outside. Got me some hot tea and as long as the wind's not chilling my hands I'm a happy little camper. :D

@deadmusik9969 3 года назад

telling me to hold on and wait a minute, like im just barely listening to you over my typing, just coding away, ha no im in amazement ha. love this

@1996Pinocchio 4 года назад

Props for the editing.

@prototy 4 года назад

I watch all your videos on my tv lol my cats LOVE watching you code things

@deansundquist9601 3 года назад

Watching this during the summer in the middle of the corona virus, makes the cabana and snow look very enjoyable at this time.

@realcygnus 4 года назад

Total awesomeness ! .....as usual

@davutsauze8319 4 года назад

Nice, i was waiting for you to make it like a week before

@rasenmaher7666 4 года назад

Actuallly, the nice thing about the Hilbert Curve is that u can map every Point of an INFINITE plane to one single scalar. When just counting line by line, u already couldn't count the second line, because those values are infinite, cause the first row is infinite. Nice video :D

@orugma Год назад

Just came to say... I watched this on a television! (And thank you!)

@magikmaker 4 года назад

Wonderful!!

@akhilkaushik7348 3 года назад

I tried Hilbert curve in Unity, transforming it to Hilbert maze, Really beautiful to dive into this amazing maze , I skip one wall each time randomly choosen So that even I, have no idea where the exit could be. Thanks Daniel for this beautiful video.

@delanolourenco 4 года назад

Hope you reach 1M subs soon.👍

@devincustodio2258 4 года назад

Bravo Dan!!

@aayushparashar4143 4 года назад

Nice touch with the notepad!!

@ThePiGuy24 4 года назад

I have a suggestion for the catch phrase: "I will see you in the next iteration!"

@algc19 4 года назад

5 minutes in and I had to go get a cup of tea! So cozy in your cabana

@Moll-ayyy 4 года назад

The Bob Ross of coding

@amanadwani9100 4 года назад

just amazing

@AlexandraDiehl Год назад

Man, you are awesome!

@RicoGalassi 4 года назад

Some say Dan's cup is still steaming to this day.. Awesome work as usual Dan! I know this isn't related, but I'm going to be starting a python course at my job soon and I absolutely cannot wait to dive into another language Edit; yes, I am watching on my television haha

@_rlb Год назад

I actually just watched this on my television.

@kevnar 4 года назад

I like how his breath eventually stops steaming as the electronic equipment warms the cabana.

@ColinTimmins 7 месяцев назад

Love these videos so much. =]

@astropgn 4 года назад

🥰 always inspiring

@iPrint3D 4 года назад

I like this style of coding maybe more than your normal white board series!

@sebastianmeisel 10 месяцев назад

Catch phrase: final station, please leave the train.

@cakdham4607 4 года назад

As usual.. great tutor

@Hoobizone 3 года назад

So cool!! thank you!!

@truthteller4689 4 года назад

my fingers are cold just watching!!!

@BillyBob-tr5cv 4 года назад

I have never been this early. I just randomly watch coding videos and whelp here I am lol

@beens3865 10 месяцев назад

I know that I am about 3 years behind on this video but as a computer science student I might build an app. One that takes in a certain image and converts it to a Hilbert curve pixelation as a research project. Just an idea. Either way, I love your videos man!

@clipi_ 4 года назад

Great video!!!

@MyTwinkie 4 года назад

This is a lovely idea and you should definitely continue this series! One drawback that I find however comparing to the old studio episodes is that video repeatedly switches from the code view to other views making it hard to follow the coding process. Would it be possible to make the picture-in-picture or split screen so the code is always seen?

@danielluna7648 3 года назад

Absolutely fascinating. I need to learn more maths. But I think I can use this to smoothly transition an RGB LED through every color in the spectrum...time to hook up the Arduino and start tooling around.

@PMA_ReginaldBoscoG 10 месяцев назад

Instead do it in python, create an explanatory video about it, and submit in manim discord channel for summer of math exposition 3. Wishing you good luck

@thiennguyenngoc1922 4 года назад

another awesome video

@ionel71089 4 года назад

I’m watching on my television!

@timh.6872 4 года назад

I know it's not the Processing way, but I think this curve drawing is worth revisiting recursively. In particular, the 3b1b videos on the towers of hanoi and sierpinski's triangle have a really neat perspective on the recursion. In this case, we're counting in base 4, with a flourish of rotation and translation thrown in between the subtasks. I don't know if processing can cleanly express that idea, but I'd love to see the more pure, if less perfomant, solution.

@cosmicgoo8074 4 года назад

Thank you for braving the cold for us

@Fragdemented 4 года назад

catchphrase idea "May the code in your heart be the same code that fills your screens."

@kisame_5331 4 года назад

God, I love this!

@Ken-S 2 года назад

This is how Ikea demo rooms are built.

@1996Pinocchio 4 года назад

The amazing thing about the Hilbert Curve is very clearly shown in the video at 25:15 where you color it and increase the order, the colors would still be mapped to the same location, whereas if you'd color it just line by line, and increase the order, the result would look completely different for each order, not stabilizing at any point, whereas when filled with the hilbert curve, the color at each point is the value of the hilbert curve color mapping for order to infinity. This color can't be defined for the line-by-line mapping.

@redumptious2544 4 года назад

Man! You're seem so sympathic😅 Rly hope to meet you one day🤘 Your videos finally got me into js back in the days.

@SxC97 4 года назад

so jealous of the snow in NY! I live in Texas and it's always so hot here :(

@ArtNowCoding 4 года назад

"whoopsie! that's our destination for the day" Catchphrase idea haha

@amritpalhh9836 4 года назад

First from the UK! Best programming teacher ever for visualising. How do you get better in logic?

@jemesmemes9026 4 года назад

Practice is the simple answer, but I guess try to find problems like the ones you wanna solve

@AntonPanchishin 4 года назад

Practice. Outside of programming, turn every day tasks into logic statements and test it. For example, I need groceries so can it be fixed if (I get groceries)or(my wife gets groceries)? No, because that statement equates to true if we both go and that would be too much groceries. Practice, even outside of programming

@indycinema 4 года назад

This man is by far the best coding teacher. Jelous of the cabana. Where did NYU go?

@TheCodingTrain 4 года назад

It's still there, just another way for me to make videos!

@X22GJP 4 года назад

I watch the vast majority of RU-vid on my television 😉 Phones are for texts, phone calls and photos, tablets are for browsing and media consumption when on the go!

@shadowatom 4 года назад

You should do a video based around the Feigenbaum Constant considering it is such a crucial part (as far as I know) of chaos theory.

@RickeyBowers 4 года назад

L => +RF-LFL-FR+ R => -LF+RFR+FL- Where * means to change the direction of rotation and (.) period means to rotate. L needs to be rotation & direction neutral, or fixups would be required after each L. Splitting the rotate operator allowed further optimization because the first four symbols repeat. Leading to: L => RRL.F*L.* R => *.LF