Cannot add custom graphics to scene

Phaser 3
1

I am trying to add my game objects onto my scene. The code I am using is:

export default class WorldObject extends Phaser.GameObjects.Graphics {
constructor (scene, data) {
super(scene, data.x, data.y);

this.beginFill(0xFFFF0B);
this.drawRect(10, 10, 20, 20);
this.endFill();

}

In my scene I create this with

this.worldObjects = this.add.group();

let obj = new WorldObject(this);

this.worldObjects.add(obj);

However when I run this code I get the error beginFill is not a function, from within the constructor in my extended class.

Does anyone have any pointers on what I am doing wrong here?

Thanks

2

That looks like the Phaser 2 API. Use instead:

https://photonstorm.github.io/phaser3-docs/Phaser.GameObjects.Graphics.html

3

That is the class from which my object extends, so it is definitely using the Phaser 3 API

The developer in the link below has done what I am trying to do. So it must have worked at some point. Unless this functionality has since been removed.

4

The class is right, but there are no beginFill() or endFill() methods. You need fillRect().