Background tileSprite showing at double the expected height.

[tonyedwardspz]

I'm creating a simple platform game with the phaser framework. I've added to background images as tileSprites to provide a parallax background. They are both showing in game and parallaxing as expected, however they are over sized, roughly double the height I expect.

 

 - Sprite asset size - 2048 x 1024

 - Game world size - 2400 x 1024

 

 

**Adding the tileSprite**

    preload: function () {        this.load.image('far-background', 'assets/far-background.png');        this.load.image('near-background', 'assets/near-background.png');    },    create: function () {        this.farBackground = this.add.tileSprite(0,0, 2400, 1024, 'far-background');        this.nearBackground = this.add.tileSprite(0,0, 2400, 1024, 'near-background');    }

How do I make the tilesprites fill the canvas vertically?

 

Full code can be found here if needed. 

 

Any help much appreciated.