Jump to content

Using an Existing Canvas


Recommended Posts

I understand how Phaser works, and that it fundamentally injects a canvas into an HTML parent that you specify, but I have a specific use where I need to render my game into a preexisting canvas. Basically the game that I am working on has a main game and then has subsequent minigames throughout the game. Some of these minigames are written in Phaser, some aren't. A really crude explanation of how everything works is that when a minigame is called, the main game releases control of the canvas to the minigame which executes, then returns to the main game when the user gets a game over. I can go into more details if required, but the main point is that I need my Phaser games to use the preexisting canvas instead of trying to inject a new canvas into my HTML.


I've tried looking pretty extensively for a solution, but there doesn't seem to be any options aside from combing through the 85,000 line Phaser.js library and manually editing every canvas reference or abandoning Phaser, which I really don't want to do this far into development.


I found this topic through Google but didn't want to reply to it because the last post was from 2013. Hearing that support for it wouldn't take much leads me to believe that I'm vastly overcomplicating things.





You're not mistaken, it does indeed inject a canvas tag into the DOM. The 2nd parameter when you create your game allows you to control where in the DOM it is injected:

var game = new Phaser.Game(this, 'gameHolder', 800, 600, preload, create, update);

In the example above the canvas will be placed into 'gameHolder' (which needs to exist in advance).


There is no way to tell it to use an existing canvas though. It wouldn't take much to add support for that, but I'd love to hear a case for why it might be needed :)



Does anyone with more experience, or even Rich since he wrote the above quote, have any suggestions on what I can do to get this working as intended?


Thank you for your time.

Link to comment
Share on other sites


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...