Question

一点背景：

我正在制作一款基于浏览器的2D游戏。渲染代码将移动的对象和场景对象分成两组，然后将每个组全部绘制到8192x8192画布上，该画布不会直接显示。仅当该组中的某些内容以某种方式更改时才会执行此操作。对于所有帧，完成以下操作：

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)
);

（其中canvas是用户可见画布的第2个上下文; zoneBufferStatic和zoneBufferDynamic分别是风景和移动对象的屏幕外画布; w和h是图块中用户可见画布的宽度和高度; playerX和playerY是玩家的位置，同样是图块; tileSize是像素数在瓷砖一侧，目前是32）

UI（聊天文本，对话框）直接在可见画布上绘制。

上面显示的两个drawImage调用完全按照我们桌面上的操作（16GB RAM，i7，GTX 780），但在我的Chromebook上没有任何操作（Samsung ARM（codenames daisy，snow），2GB RAM）。 UI正常显示，但不会显示风景和字符。 Chrome的开发者控制台中没有错误。我已确认在Chrome开发者控制台中使用document.body.appendChild(zoneBufferStatic)绘制了后台缓冲区。

有没有更好的方法来做到这一点，或者（非hacky）方式来检测它何时失败，以便我可以直接回到直接在可见画布上绘图？

Answer 1

Chromebook是否可能内存不足，并且可能导致问题？如果每个像素为4字节（RGBA），并且内存（8192x8192）中有6710万像素，则RAM几乎为250Mb。如果您有许多其他程序正在运行，或者打开了选项卡以及使用RAM的操作系统，那么我猜很容易用完RAM。这些天2Gb的内存已不多了。

Canvas：drawImage方法失败而没有错误

1 个答案: