DEV Community

Cover image for ✨ Get Dizzy with Digits: Celebrating Pi Day with JavaScript 🥧
Best Codes
Best Codes

Posted on

✨ Get Dizzy with Digits: Celebrating Pi Day with JavaScript 🥧

Pi

Check out my project here:
https://the-best-codes.github.io/projects/pi/

Happy Pi Day, fellow developers! 🥧✨

Today, we're diving into the delicious world of mathematics to celebrate our favorite irrational number, π (Pi). And what better way to honor this mathematical constant than by calculating its digits? While mathematicians have reached mind-boggling digit counts (in the Trillions!), we can still go on our own JavaScript adventure to squeeze out as many digits of Pi as our devices can handle.

Reminder: Calculating an enormous number of pi digits is resource-intensive. Be prepared for your computer to work up a sweat if you leave the code running too long!

The Magic Code

The generateDigitsOfPi function is a beautiful example of a spigot algorithm in action. This type of algorithm “spigots” out digits of π one at a time in a stream (hence the name).

function* generateDigitsOfPi() { let q = 1n; let r = 180n; let t = 60n; let i = 2n; while (true) { let digit = ((i * 27n - 12n) * q + r * 5n) / (t * 5n); yield Number(digit); let u = i * 3n; u = (u + 1n) * 3n * (u + 2n); r = u * 10n * (q * (i * 5n - 2n) + r - t * digit); q *= 10n * i * (i++ * 2n - 1n); t *= u; } } // More code function displayTenNextDigits() { let digits = ""; for (let i = 0; i < G_NUMBER_OF_DIGITS; i++) { digits += generator.next().value; } // Do something with the digits here } 
Enter fullscreen mode Exit fullscreen mode

Let's crack the code:

  • Variables:
    • q, r, t: These hold BigInt values (large integers) used in the algorithm.
    • i: A counter variable.
  • The Loop:
    • The while(true) loop acts as the engine, continuously generating digits.
    • digit is calculated using a complex formula involving q, r, t, and i. This formula is based on the Bailey-Borwein-Plouffe (BBP) algorithm, renowned for its efficiency in pi calculation.
    • yield Number(digit): This special keyword pauses the function, returning the current digit (digit) and allowing you to resume later.

Under the Hood

While a full explanation of the BBP algorithm goes beyond this article (check out https://en.wikipedia.org/wiki/Bailey_... if you are curious!), here's a simplified understanding:

  • The formula manipulates BigInt values (q, r, t) to progressively converge towards the actual digits of pi.
  • Each iteration calculates a new digit and updates the variables for the next round.

Unveiling the Hidden Digits

The second function, displayTenNextDigits(), takes the baton:

  • digits: An empty string to store the retrieved digits.
  • The Loop:
    • It iterates a predetermined number of times (G_NUMBER_OF_DIGITS) using a for loop.
    • Within the loop, it calls generator.next().value. Remember generateDigitsOfPi()? This retrieves the next pi digit using the yield statement.
    • Each retrieved digit is appended to the digits string.

Bringing it all Together

Here's where you get creative! Replace the comment // Do something with the digits here with your desired output format. You can:

  • Use console.log(digits) to print the digits to the console.
  • Get fancy and visualize them using a JavaScript charting library like Chart.js.
  • Challenge yourself to write the digits to a file (be aware, this might take a significant amount of time for a large number of digits).

Remember:

  • Adjust G_NUMBER_OF_DIGITS based on your machine's capabilities. Start small and gradually increase as you experiment.
  • This is for educational purposes. Calculating an extreme number of digits might overload your system.
  • Take a pie break every now and then; after all, it’s a celebration!

Check out how I used the base code:

Happy coding, and may your Pi Day be as infinite and transcendental as the number itself! 🎉

This article was written with the assistance of AI.


Fun fact about Pie:
The mirror image of PI.E is (an admittedly sloppy) 3.14:

pi pie mirror


Article by BestCodes
https://the-best-codes.github.io/

Top comments (0)