Phaser 3 spritesheet not displaying on iOS - Shows black rectangle instead

Question

I have a project built with phaser 3, and strangely it doesn't show the spritesheet (it appears as black rectangle instead). It only happens in mobile (running on simulator and running on mobile safari). On my mac, it displays properly (both chrome and safari).

Code:

In boot-scene.ts:

this.load.spritesheet('character-walk', 'assets/walk.png',
    { frameWidth: 547, frameHeight: 481 },
);

In game-scene.ts:

this.player = this.add.sprite(100, 600, 'character-walk')

Screenshot:

Any help is greatly appreciated.

Answer 1

type: Phaser.CANVAS is not a solution if the project requires WebGL acceleration. I am finding that this happens when the sprite is over a certain number of pixels in any one direction. For instance, I have a 3000px x 6000px sprite sheet image exhibiting this behavior but when it is cut to 3000px x 3000px it loads as expected on iOS.