See the background of this webpage? How when the circles are overlapping, it draws a line between them?

I wanted to create something like this, only I couldn't.

Before I start my long post, If you know if this is a sample code available somewhere, please tell me. Thanks.

I created a processing program where I wanted it to draw two circles, and connect them if they were overlapping. In the end, this didn't work, however, I think I have the idea right. First, I created two ellipses and stored their x and y coordates as fx,fy,sx,sy (first x, first y, second x, second y).

I then used the distance formula to calculate the distance between the center of the circles. If the distance was less than or equal to the diameter of the circle, It would draw a line ( line(fx,fy,sx,sy); ) from the center of the first to the center of the second. Unfortunately, I did something wrong somewhere along the line and draws a line some of the time.

I tried to figure this out on paper, but to no avail. Also, I couldn't figure out how to produce many circles and store the coordinates of them while they were being created (sorry if this is unclear). If you want to look at my code for errors on my part, just ask.

Thanks!

1