# Is there a way to avoid collisions? E.g. 20 circles that don’t overlap

**URL:** <https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695>\
**Category:** Coding Questions\
**Created:** [October 8, 2021, 2:03pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695 "2021-10-08T14:03:49Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![GoodJuJu](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/goodjuju/32/14504_2.png) [@GoodJuJu](https://discourse.processing.org/u/GoodJuJu)\
**Post date:** [October 8, 2021, 2:03pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/1 "2021-10-08T14:03:49Z")

</div>

I am just starting out with processing.

I wondered if there was a way to prevent ‘collisions‘?

For example, I would like to have 20 circles on a canvas and ensure that none of them overlap or touch each other.

Is this possible with simplistic code?

Thanks.

---

<div class="post-metadata">

**Author:** ![jafal](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jafal/32/19112_2.png) [@jafal](https://discourse.processing.org/u/jafal)\
**Post date:** [October 8, 2021, 3:00pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/2 "2021-10-08T15:00:54Z")

</div>

Hi

welcome to our community

This is a good start

> **[Processing Collision Detection](https://happycoding.io/tutorials/processing/collision-detection)**
>
> Learn how to trigger an action when objects overlap in Processing!

---

<div class="post-metadata">

**Author:** ![jafal](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jafal/32/19112_2.png) [@jafal](https://discourse.processing.org/u/jafal)\
**Post date:** [October 8, 2021, 3:12pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/3 "2021-10-08T15:12:04Z")

</div>

[![](https://img.youtube.com/vi/Se0Hbp3hy38/maxresdefault.jpg "Random Circles with No Overlap Translated into Processing") ](https://www.youtube.com/watch?v=Se0Hbp3hy38&t=192s)

---

<div class="post-metadata">

**Author:** ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)\
**Post date:** [October 8, 2021, 4:06pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/4 "2021-10-08T16:06:56Z")

</div>

Hi @GoodJuJu,

I would say that the solution would depends mainly on your use case and the performance you are aiming for.

The more simplistic approach I could think of is the following in pseudo code:

```auto
declare an array to hold the circles to draw on canvas

While the number of circle in the array is less than 20:
    chose a random (x, y) coordinates where you will draw your next circle
    
    for all circles in the array:
        Check if the distance between its center and the center of the new circle is larger than the sum of their radius
        if it is not the case:
            move to the next loop

    Add the new circle to the array. Since you arrive at this line, it means that you did not move to the next loop which means that the distance between the new circle and each of the other circles is larger than the sum of their radius which means that it is not overlapping either of them.

```

---

<div class="post-metadata">

**Author:** ![GoodJuJu](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/goodjuju/32/14504_2.png) [@GoodJuJu](https://discourse.processing.org/u/GoodJuJu)\
**Post date:** [October 8, 2021, 4:36pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/5 "2021-10-08T16:36:27Z")

</div>

Hi jb4x,

Thanks for your suggestion, it’s a good idea, I like it.

Thank you also for taking the time to provide a working example.

---

<div class="post-metadata">

**Author:** ![GoodJuJu](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/goodjuju/32/14504_2.png) [@GoodJuJu](https://discourse.processing.org/u/GoodJuJu)\
**Post date:** [October 8, 2021, 4:38pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/7 "2021-10-08T16:38:02Z")

</div>

Thanks Jafal,

That was what I was looking for. I am trying to find my way around.

Appreciate you taking the time to provide the link

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 8, 2021, 8:36pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/8 "2021-10-08T20:36:47Z")

</div>

This sounds like an assignment

But in any case

https://openprocessing.org/sketch/769200/embed/?

---

<div class="post-metadata">

**Author:** ![rapatski](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/rapatski/32/5164_2.png) [@rapatski](https://discourse.processing.org/u/rapatski)\
**Post date:** [October 8, 2021, 8:40pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/9 "2021-10-08T20:40:46Z")

</div>

Haha it does, yet you solved it for him anyway…

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 8, 2021, 9:30pm UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/10 "2021-10-08T21:30:14Z")

</div>

I mean any teacher worth their salt will ask them to explain the logic or why they chose to complete the project the way they did, and in that case the teacher would find out the student doesnt know how he achieved the result.

If they can figure out the code and the logic and explain it, then its fine though. Plus this is coded in p5.js, the question was in processing java, so they still have to complete the conversion.

---

<div class="post-metadata">

**Author:** ![GoodJuJu](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/goodjuju/32/14504_2.png) [@GoodJuJu](https://discourse.processing.org/u/GoodJuJu)\
**Post date:** [October 9, 2021, 8:00am UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/11 "2021-10-09T08:00:35Z")

</div>

Assignment?? No… I’m 48…

I was waiting for my son to come out of school and the question popped into my head…. I thought I would ask and was very pleasantly surprised with the responses. Seems like a nice, helpful community… hopefully I can pay the kindness back myself one day.

---

<div class="post-metadata">

**Author:** ![paulgoux](https://avatars.discourse-cdn.com/v4/letter/p/b9bd4f/32.png) [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Post date:** [October 9, 2021, 8:08am UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/12 "2021-10-09T08:08:32Z")

</div>

Well thanks for sharing. Its just circle packing as its called is often an introductory problem in coding

[![](https://img.youtube.com/vi/QHEQuoIKgNE/maxresdefault.jpg "Coding Challenge #50.1: Animated Circle Packing - Part 1") ](https://www.youtube.com/watch?v=QHEQuoIKgNE)

---

<div class="post-metadata">

**Author:** ![GoodJuJu](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/goodjuju/32/14504_2.png) [@GoodJuJu](https://discourse.processing.org/u/GoodJuJu)\
**Post date:** [October 9, 2021, 9:51am UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/13 "2021-10-09T09:51:04Z")

</div>

Wow! Who knew? Hopefully great minds think alike… 🙂

---

<div class="post-metadata">

**Author:** ![jafal](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jafal/32/19112_2.png) [@jafal](https://discourse.processing.org/u/jafal)\
**Post date:** [October 9, 2021, 11:14am UTC](https://discourse.processing.org/t/is-there-a-way-to-avoid-collisions-e-g-20-circles-that-don-t-overlap/32695/14 "2021-10-09T11:14:21Z")

</div>

@GoodJuJu  
Hi

Watch this link very useful

[https://funprogramming.org/](https://funprogramming.org/)
