Draw base64 data with phaser.js
I am making a game with Phaser and I want to take a shot of one scene and paint it in another using game.canvas.toDataURL();
.
So far, in the first scene I tried:
GAME.cc = game.canvas.toDataURL();
and then in the second:
var img = new Image();
img.onload = function() {
var base = new PIXI.BaseTexture(this),
texture = new PIXI.Texture(base);
var sp = game.add.sprite(0, 0);
sp.setTexture(texture);
};
img.src = GAME.cc;
There are no errors in the console, but the sprite is completely black. So ... what's the problem?
source to share
You have two options.
First, force the rendering of the Canvas when you create your game. For example:
var game = new Phaser.Game(800, 600, Phaser.CANVAS, '', {
preload: preload, create: create, update: update
});
As you can see in the screenshot, you are currently using either Phaser.AUTO
or Phaser.WEBGL
what the WebGL renderer allows.
The second option is to install preserveDrawingBuffer
when you create your game.
Presumably this will work:
var game = new Phaser.Game({
width:800, height:600, renderType:Phaser.AUTO, parent:'', preserveDrawingBuffer:true
});
But in TypeScript (and probably vanilla JavaScript based on what TS spits out), this is how it should be:
var game = new Phaser.Game(800, 600, Phaser.AUTO, '', {
preload: preload, create: create, update: update
});
game.preserveDrawingBuffer = true;
source to share