I need to download the created pixel drawing from this Phaser example as a .png image via FilesSaver.js but the canvas returns null.
Error:
Uncaught TypeError: Cannot read properties of null (reading 'toBlob')
This is the save function:
function save() {
var canvasX = document.getElementById("canvas");
canvasX.toBlob(function(blob) { saveAs(blob, "image.png"); }); }
drawingArea: (PhaserJS 2)
function createDrawingArea() {
game.create.grid('drawingGrid', 16 * canvasZoom, 16 * canvasZoom, canvasZoom, canvasZoom, 'rgba(0,191,243,0.8)');
canvas = game.make.bitmapData(spriteWidth * canvasZoom, spriteHeight * canvasZoom);
canvasBG = game.make.bitmapData(canvas.width + 2, canvas.height + 2);
canvasBG.rect(0, 0, canvasBG.width, canvasBG.height, '#fff');
canvasBG.rect(1, 1, canvasBG.width - 2, canvasBG.height - 2, '#3f5c67');
var x = 10;
var y = 64;
canvasBG.addToWorld(x, y);
canvasSprite = canvas.addToWorld(x + 1, y + 1);
canvasGrid = game.add.sprite(x + 1, y + 1, 'drawingGrid');
canvasGrid.crop(new Phaser.Rectangle(0, 0, spriteWidth * canvasZoom, spriteHeight * canvasZoom));
}
How to get the data of the drawing to create a .png out of it?
from Download pixel art drawing as .png in PhaserJS
No comments:
Post a Comment