Thursday, 8 August 2013

canvas drawImage failing without error

canvas drawImage failing without error

A little background:
I'm making a 2d browser-based game. The rendering code splits moving
objects and scenery objects into two groups and then draws each group in
its entirety onto an 8192x8192 canvas, which is not displayed directly.
This is only done when something in that group changes in some way. For
all frames, the following is done:
canvas.drawImage(zoneBufferStatic,
Math.floor((w/2 - playerX) * tileSize),
Math.floor((h/2 - playerY) * tileSize));
canvas.drawImage(zoneBufferDynamic,
Math.floor((w/2 - playerX) * tileSize),
Math.floor((h/2 - playerY) * tileSize));
(where canvas is the 2d context of the user-visible canvas;
zoneBufferStatic and zoneBufferDynamic are the offscreen canvases for
scenery and moving objects, respectively; w and h are the width and height
of the user-visible canvas in tiles; playerX and playerY are the player's
position, again in tiles; and tileSize is the number of pixels on the side
of a tile, currently 32)
The UI (chat text, dialogs) is drawn directly on the visible canvas.



The two drawImage calls shown above work exactly as they should on my
desktop (16GB RAM, i7, GTX 780) but do nothing on my Chromebook (Samsung
ARM (codenames daisy, snow), 2GB RAM). The UI is displayed normally, but
the scenery and characters are never shown. There are no errors in
Chrome's developer console. I have confirmed that the back buffers are
being drawn using document.body.appendChild(zoneBufferStatic) in the
Chrome developer console.
Is there a better way to do this, or a (non-hacky) way to detect when it
fails so I can fall back to drawing directly on the visible canvas?

No comments:

Post a Comment