Skip to main content

Fill 2D Space with Hilbert Curve

Post a Comment

Fill 2D Space with Hilbert Curve

I was introduced to the amazing world of fractals by a coding channel named The Coding Train. I was fascinated by the elegance of the process. It was an amazing mix of math, computer science, coding, and nature, all of which I admire a lot! This project is about such a fractal pattern named Hilbert Curve.

I got to know about Hilbert Curve from my university's computer graphics course. As soon as I got introduced to the topic I searched the web for coding it. I coded Hilbert curve with OpenGL in C++, but it felt clumsy to set it all up. Then I remember The Coding Train and his work on p5js and processing. These libraries were primarily developed for easy use for creative coding. I played around with the libraries but never dedicated to do something serious with it; until now!

About the Project

Hilbert Curve is a space-filling curve. That means this 1-D line can fill a 2-D space! This fact on its own is amazing! The time I was learning about the amazing properties of Hilbert Curve, I came across a 3Blue1Brown's video on this topic. Equipped with mathematical and algorithmic knowledge I was pumped to make something cool with it! This leads naturally to use Hilbert Curve to fill image space. In this project, the user can see the Hilbert Curve of various generations fill a \(512 \times 512\) canvas. The hue mapping leads to a fascinating image of filled space.

Generation 6 Hilbert Curve being drawn with changing hue

Interact with the Project

Features

  • Starting Generation (1-9)

    Users are able to set the starting generation. The number is limited to 1 to 9 because in n-th generation hilbert cuve have \(2^{2n}\) points. I ran the simulation with \(n = 10\) and it could not handle it. So \(n \in [1,9]\) it is!

  • Upload Image

    Users can upload any image to be filled with Hilbert Curve!

    Image of David Hilbert being drawn with Hilbert Curve

  • Reset, Pause/Play, Fast Forward, Download as Image Reset and Pause/Play are self-explanatory. Fast Forward allows the user to go through the animation at an increased speed. This is achieved by increasing the iterationPerFrame variable by an amount each time the user clicks the Fast Forward button.

    Download as Image is also self-explanatory.

    Hilbert Curve of generation 6

     

    Image of David Hilbert with generation 7 Hilbert Curve

  • Pause on Each End of Generation

    The name of the checkbox is pretty self-explanatory. I added this afterward so that I can easily download the output of each generation.

Resources

If you are eager to learn more about the topic I would leave some links to read and see for yourself.

Labels:
Location: Dhaka, Bangladesh

Comments

Post a Comment

Popular posts from this blog

Light OJ 1278 - Sum of Consecutive Integers

Description Given a positive integer \(n\), you have to find the number of ways you can express \(n\) as sum of consecutive integers. You have to use at least two integers. For example, \(n = 15\) has three solutions, \( (1+2+3+4+5), (4+5+6), (7+8)\). একটা ধনাত্মক সংখ্যা \(n\) দেয়া আছে, তোমাকে বের করতে হবে \(n\) কে কত উপায়ে একাধিক ক্রমিক সংখ্যার যোগফল আকারে লেখা যায়। যেমন, \(n = 15\) কে তিন উপায়ে লেখা যায়, \( (1+2+3+4+5), (4+5+6), (7+8)\). Problem Link আমার সমাধান ধরে নেই \(a,b\in \mathbb{N},a \neq b\) \[ \begin{eqnarray*} &&a + (a+1) + (a+2) + \cdots + b = n\\ &\Rightarrow& \sum_{k = a}^{b} k = n\\ &\Rightarrow& \sum_{k = 1}^{b} k - \sum_{k = 1}^{a-1} k = n\\ &\Rightarrow& \frac{b(b+1)}{2} - \frac{(a-1)(a-1+1)}{2} = n\\ &\Rightarrow& b^2 + b - (a^2-a) = 2n\\ &\Rightarrow& b
Post a Comment
Read more

সীতাকুণ্ড দর্শন

রবিবার ২৮ শ্রাবণ,১৪২৫ ১২ আগস্ট,২০১৮ ঘুম থেকে ধরফর করে উঠেই ভাবলাম ঘুমায়ে পড়লে হবে না! নাহলে ত ট্রেনের করিডোরে মানুষের গায়ে পড়ে যাব! ভাবা যায় আমি কারো গায়ে পড়লে কি হবে! হুঁশ ফেরার পর চারিদিক দেখে ঘোর কাটল। না,আমি আর সেই ট্রেনে সিট আর উপরে হাতল ধরে দাঁড়িয়ে নাই! আমার নিজের বিছানায়, নিজের বালিশে, নিজের চাদরে গা জড়িয়ে উঠে বসে আছি! যে ট্রেনের কথা বলতেসি সে শুধু এক দুঃস্বপ্ন নয়,সদ্য ফেলে আসা অতীতের স্মৃতি, গতকাল রাতের স্মৃতি ! গতকাল সারাদিন হাঁটাহাঁটি,পরিশ্রমের পর কোথায় ট্রেনের কেবিনে আরাম করে ঢাকা ফিরবো তা না, আমাদের ঢাকায় ফেরার দিনটা এমন দিনেই পড়ল যখন সবাই শুক্র,শনি ছুটি কাটিয়ে ঢাকা ফিরছে! আর কি? যা হবার তাই হলো! কেবিন তো দূরে থাক সিটই পাইনি! চট্টগ্রাম থেকে ঢাকা স্রেফ দাঁড়িয়ে ! বাসায় যখন ঢুকি ঘড়িতে তখন সকাল সাড়ে ৭ টায়! ঢুকতেই অনুভূতি হারানো কাঁপা কাঁপা পা নিয়ে বিছানার কাছে গিয়েই ঘুম! ধড়ফড় করে ওঠাটা দুপুর আড়াইটায়। ট্রেন ভ্রমণটা আমারদায়ক না হলেও সুখকর ছিল! সুখের কারণ বলতেই এই লেখা! বুধবার ২৪ শ্রাবণ,১৪২৫ ৮ আগস্ট ২০১৮ ঢাকায় আছি তা প্রায় তিন বছর। ২০০৮ সালের আগেও ছিলাম
Post a Comment
Read more