- Welcome to the first in a series, or maybe just one video, I have no idea what's going
to happen with all this stuff, calculating the digits of pi. So, for Pi Day today, at least with the silly American way of putting the date
together, March 14th, 3/14, if only it was the year 1592,
it would really be Pi Day. I'd like to do coding challenges around calculating the digits
of pi or approximating pi. Although, if I want to approximate pi, I should really do that on July 22nd 'cause that's 22/7 or 22. Anyway, the point is I
released a video this morning about counting the digits of
pi through block collisions, and that's one you could watch. I'll link to that in the description. But there are three other
methods I want to explore and I might do all of these video, more likely just one
of them in this video. There's the Leibniz Method, there's this way of looking at
random numbers and co-primes, which is a method that Matt Parker used in his YouTube channel
Stand Up Maths to calculate pi, and then there's also this amazing thing that happens in the Mandelbrot set, the Mandelbrot fractal, which I have a coding challenge about. Where you can actually
find the digits of pi, the number pi in a very strange place. There's a wonderful numberphile video with mathematician Holly Krieger, who explains this in great detail and we can see if we can write
a code example to do that since I already have
a Mandelbrot set code. Alright, let's start
with the Leibniz Method and let's use the P5 web editor. Let's try to think of a way
of making this interesting. So, first of all, the
Leibniz formula states that if we start with the number one and then alternating fractions
where the denominator is the next odd number
subtracting first, adding next, subtracting next, adding next. If this infinite series will
converge to pi divided by four. Wow! That's crazy. Let's see if that works. So, this shouldn't be too hard to code. At least, in terms of
things I've coded before. Let's just start with, let's
just do all this in setup first and then we'll think about if there's an interesting
way to animate it. So, let's start with, I'm just
going to to make a variable called pi. I'm going to to start at one because I need to sum up the values. Then, I need to do some
number of iterations. So, we'll start with zero. Let's just try doing
10 iterations to start. Now I need to get that alternating
sequence of odd numbers. So that should be easy. That's the denominator of the fraction. So, let's call that denominator. It's really just, i i times two plus three. Right, because we're starting at three, then five, then seven, then nine. So, zero times two is zero
plus three that's three. One times two is two plus three is five. You can see how this works. And then, what I want to do the fraction is one divided by that denominator and then I need to say pi
plus equals that fraction. I could just, that's silly,
I'll just say pi plus... Oh! Wait, wait, wait, wait. First to subtract then add. So, I need to say that if
i modulus two equals zero. Right because that's how it can detect whether I'm alternating
even or odd numbers. I mean, they're all odd numbers but am I the first one or the second one or the third one or the
fourth one, et cetera. So, I would say in that case pi minus equals one
divided by that denominator and then otherwise. Of course, I could write this in, you could probably find a
clever way to write this in just a few lines of code, in many fewer lines of code. Plus equals and then, let's just say create
a div with that digit and we can see, there it is. Okay, well, that is not the number pi. Nowhere close to the number pi. Why? Well, if you remember
from the Leibniz series, this series converges
on pi divided by four. So, I could put four minus
four divided by three plus four divided by five or I could
just at the very end say, pi times equal four. So let's say, let's add, I might graph it so let's leave the canvas there and let's do this again and there we go 3.23, that's not so great. First, let's make that number bigger. So we can see, there we go, we have got this number. Now, we only did 10
iterations, that's very few. By the way if we just do one, 2.6, two 3.4, three 2.8, you can see it's bouncing up and down, this might be interesting to graph but let's do 400 3.144, 4,000, 40,000, you can see that we're getting closer and closer to the digits of pi. Let's try graphing it. Let's go and put in draw. I'm actually going to take
out the idea of this loop. I'm going to have this idea
of pi be a global variable and I'm going to do this
calculation every time through draw. So this is really, we could
think of this as an iteration. Iterations equal zero. So, the denominator is iterations if iterations module is two equals zero and then I will manually
increase the iterations every time through draw and I'm going to make
a variable called div and I'm going to div equals create pi div and I'm going to update it with pi. So, now, we can see, oh yeah something is, I'm not sure if this is working. Oh, whoa whoa whoa, oh! This times equal four is a problem. So, in this case it might make more sense for me to just start pi at four, I mean I could do a number
of different things. I could start pi at four
and I could put four in here and then I don't need to do this. Now that pi is a global
variable I know I can't multiply by four every time through draw. So this should get me converging. Yes, so you can see I'm
converging in theory on the number pi. So you can see 3.1 is settled, eventually this four should settle as I get to a certain
number of iterations. Okay, so now let's graph this. So, I'm going to make
an array called history. So what I want to do is say history.push pi. I'm going to say for let i equal zero, i is less than history.length i plus plus. And what I want to do is
I want to draw a line. I'm going to say begin shape, end shape, and I also want to calculate
sort of the spacing. The spacing is going to
be the history divided by, oh no sorry, the width of the window
divided by history.length. And then x will be i times that spacing, this should really be
spacing, I'll call it spacing. I want to figure out how many things to go across the window do I have and then I'm going to say vertex x comma, so let me just make y right
now height divided by two just to see if this works. Did I stop it? And I'm going to need to
say stroke 255 no fill. Right, I see a line going across but height divided by two, which is the y should be history index I. And let me map that value, woops. Map that value, between some range, between two and four to
between zero and height. So I want that, no no no. So, sorry, sorry this
is not making any sense. (bell dings) What am I doing here? I forgot to put the y here. (laughs) I forgot to put the y here And I forgot to put the y here. There we go, that's what
I was looking to see. We are now seeing it converge, this is what I meant to see. So in theory, where is pi? Let's draw a line. I could be more thoughtful about what my range is that I'm looking for but let's let's put a line also, we're going to say here line. Which is going to have x zero I'm going to say piY equals, we'll use the same mapping but we'll actually map the value of pi. So we're going to have a
line go across the window and this should say let. Oh, my brain has stopped working. So, this is where pi is and now we can see the Leibniz series
graphically approximating and get it converging
all on the number pi. All right, now I should really invert this because right now the
lower number starts up top. So I should really put map
it from height down to zero. Let's make the frame rate fast again. And there we go. Oh boy! And this is height down to zero. And here we go, there is, we now have the Leibniz infinite series converging on the number pi but in a very inaccurate way because we're just using
floating point numbers which only gives us, I don't
know how many decimal places, like seven at the the most. Ya know, what is p5 actually think pi is? I could say console.log pi. Well, I get more than seven, but I get this many decimal places. So could we possibly do this in a more accurate way is the question. Thanks for watching this coding challenge approximating the number
pi with the Leibniz method. I think there's some things
you could probably do. First of all, this should really be, these should be variables like min y max y because I'm using them in two places. Min y max y. Then, I could just initialize
them with something like, min y equals two and max y equals four and this should be exactly the same thing. But the point is that minimum
and maximum could be adaptive. So, for example, you
could do something like, actually start to adapt the
range that you're graphing based on where you are in
the approximation series. I don't know, in other words,
what are some other ways that you could animate
this or visualize it in perhaps a more interesting way? There must be some sort of
like spiraling convergence that you could do but also the Leibniz series, the Leibniz formula I picked
because of it's simplicity, almost relatively easy to implement. But there are many other
series for approximating pi. For example, there's
the Euler Convergence, you could look at that. There's these more recent ones that are quite famous and
sort of insane looking. I really should come back and
do a video trying with these although I probably
would need a big integer, a big decimal data structure to store the numbers larger than
the standard integer of floating point precision will
allow me to do in JavaScript. So that's something you could also do. How could you really, with a really large number of iterations and more precision in JavaScript? I'll put a link in the description to the big rational JavaScript library. Which allows you to store a number with many more decimal places than what you just get for free
with floating point numbers, so you can try that. So try one of these other formulas, try animating it in a different way, share your community contribution at The Coding Train website with the page associated
with this challenge. And thank you for
watching this video about approximating the number
pi with the Leibniz method. Goodbye!
(bell dings) (exit music)
