# Detect text overlap

**URL:** <https://phaser.discourse.group/t/detect-text-overlap/5500>\
**Category:** Phaser 3\
**Created:** [March 14, 2020, 4:15pm UTC](https://phaser.discourse.group/t/detect-text-overlap/5500 "2020-03-14T16:15:52Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Steven](https://avatars.discourse-cdn.com/v4/letter/s/94ad74/32.png) [@Steven](https://phaser.discourse.group/u/Steven)\
**Post date:** [March 14, 2020, 4:15pm UTC](https://phaser.discourse.group/t/detect-text-overlap/5500/1 "2020-03-14T16:15:52Z")

</div>

Hi, I am new to phaser and trying to program my first game. The starting point are 85 numbers which are randomly placed on the screen. (position/rotation). I try to figure out how I can place them without overlapping, but without any luck. I tried to play around with something like " this.physics.arcade.overlap(text, nummers, onOverlap)" and binding the text to a container. but nothing seems to work. See the code below:

```
var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    physics: {
    default: 'arcade',
    arcade: {
        debug: false
    }
    },
    scene: {
        preload: preload,
        create: create,
        update: update
    }
};

var game = new Phaser.Game(config);

function preload ()
{      
    this.load.script('webfont', 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js');
    this.cameras.main.backgroundColor.setTo(255,255,255);
}

function create ()
{

  var start = this.physics.add.staticGroup();

  var nummers = this.physics.add.staticGroup();

```

for (var i = 0; i \< 85; i++)  
{

```
   let text = this.add.text(0+ Math.random() * 800, 0 + Math.random() * 600, i+1 ,{font: 20+ Math.random() * 30 + "px Arial", fill: '#000000' }, nummers);
    text.setAngle(Phaser.Math.Between(0, 359));

}

}

function update ()
{
}
```

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [March 14, 2020, 11:54pm UTC](https://phaser.discourse.group/t/detect-text-overlap/5500/2 "2020-03-14T23:54:51Z")

</div>

You can try it this way. It’s a little nonrandom.

https://codepen.io/samme/embed/preview/xxGWvoq?height=300&slug-hash=xxGWvoq&default-tabs=js,result&host=https://codepen.io

---

<div class="post-metadata">

**Author:** ![Steven](https://avatars.discourse-cdn.com/v4/letter/s/94ad74/32.png) [@Steven](https://phaser.discourse.group/u/Steven)\
**Post date:** [March 17, 2020, 5:35pm UTC](https://phaser.discourse.group/t/detect-text-overlap/5500/3 "2020-03-17T17:35:26Z")

</div>

Thank you, a complete other approach then I had in mind but is works!