Overlap/Collider between Tiled Object Layer and Player/Sprite doesn't work in Phaser 3

[VanderlyleCrybaby]

Hello everyone!

I've been a lurker on this site for most of the time and the threads here helped me time and time again to sort things out. 

I'm currently trying to get a simple Jump'n'Run Game going, but I'm struggling with the collectibles.
I'm using a Tiled Object Layer and imported it succesfully into the game. However, the overlap between the objects and the player just isn't working. I've tested the collectPoint1 function on another object and it worked. Also the sprites are all visible in my game. Really, the only problem is the overlap.  

class Level extends Phaser.Scene {

    constructor(){
        super({
            key: 'Level'
             });

    };


    create(){

        let scene = this;

        let map = this.make.tilemap({ key: 'Level1'});

        let player1_config = {...};


        //Player 1
        this.player1 = new Player1(this, player1_config);

        
       //Setting the score-data
        
       this.data.set('player1Score',0);
        

        //Animation of the Coins
        var coinSpin_config = {
            key: 'spin',
            frames: this.anims.generateFrameNumbers('coin', {
                start: 0, end: 7
            }),
            frameRate: 10,
            repeat: -1
        };
        
        this.anims.create(coinSpin_config);
        
        
//Using createFromObjects to display the coins
       this.points = map.createFromObjects('HousePoints', 'point', {key: 'coin'}, this);
        this.points.enableBody = true;
        
       this.anims.play('spin', this.points);
        
        
         //Score-text
         this.scoreText = this.add.text(30, 22, 'Score for ' + this.playerHouse + ': 0');  this.scoreText.setScrollFactor(0);

    };
    
    
      //Collecting Points
    collectPoint1 (player, coin){
        var score = this.data.get('player1Score');
        this.data.set('player1Score', score + 10);
            
        this.scoreText.setText('Score: ' + this.data.get('player1Score'));
        coin.disableBody();
        }


    update(){
        
        this.player1.move();
        
        this.physics.add.overlap(this.player1, this.points, this.collectPoint1, null, this);
      
        }
    }

}

As I'm well aware of this post, I've tried it with map.getObjectLayer as well. Didn't work.

I'm a huge fan of this template, but its structure is so very different to mine that it down't really help me.

.
.
.
.
this.housePoints = this.add.group(null);
        
        const objects = map.getObjectLayer('HousePoints');
        
        let housePoints_config = {
            scene: this,
            collected: false
        }
        
        objects.objects.forEach(
        (point) => {
//Creates a Points Object defined in a Points class (see below)
               point = new Points(this, housePoints_config);
            this.housePoints.add(point);
            
               });

.
.
.
.
.
}

 update(){
        
        this.player1.move();

//This throws the error 'spin is not a function', but that's not my focus
        this.housePoints.spin();

//This overlap doesn't work either
        this.physics.add.overlap(this.player1, this.housePoints, this.collectPoint1, null, this);

      
        }

}

/////////////////////////////////////////////
///This is in another .js file naturally////
///////////////////////////////////////////

class Points extends Phaser.Physics.Arcade.Sprite {
  constructor(scene, config) 
  {
    super(config.scene, config.x, config.y);
    config.scene.physics.world.enable(this);
    this.scene = config.scene;
    this.collected = config.collected;
    this.scene.add.existing(this);
    this.scene.physics.world.enable(this);
      
    var coinSpin_config = {
            key: 'spin',
            frames: this.anims.generateFrameNumbers('coin', {
                start: 0, end: 7
            }),
            frameRate: 10,
            repeat: -1
        };
      
      this.anims.create(coinSpin_config);
      
      
  }
    
   spin(){
        
        this.anims.play('spin', true);
        console.log('point updated');
    }
     
}

I'd be eternally thankful for every tip! Thanks so much, if you decide to take the time to help me.

 

[sharks]

Hey, it's me from the thread you referenced.  I've added my code and added some comments for you

        var overlapObjects = this.map.getObjectLayer('Overlap')['objects']; //my Object layer was called Overlap
        let overlapObjectsGroup = this.game.physics.add.staticGroup({
        
        });
        let i = 0;
        overlapObjects.forEach(object => {
        let obj = overlapObjectsGroup.create(object.x, object.y, 'grass');
            obj.setScale(object.width/32, object.height/32); //my tile size was 32
            obj.setOrigin(0); //the positioning was off, and B3L7 mentioned the default was 0.5
            obj.body.width = object.width; //body of the physics body
            obj.body.height = object.height;

            
        });
        overlapObjectsGroup.refresh(); //physics body needs to refresh
        console.log(overlapObjectsGroup);

        this.game.physics.add.overlap(this.player, overlapObjectsGroup, this.test, null, this);

 

[VanderlyleCrybaby]

Thank you so so so so much!!! It finally works!! 

[sharks]

Glad you figured it out