使用PIXI JS图像精灵不会显示在我的画布中

Question

我的图像精灵（game.player_booba）没有出现，我也不明白为什么。尽管修改了它在x和y中的位置，但它并未出现。

game.player_booba.init();
game.player_booba.sprite.image.addEventListener("load", (event) => {
  window.requestAnimationFrame(game.loop);

});

我的代码笔：     https://codepen.io/manonragnotti/pen/abbeEKO

谢谢

Answer 1

说实话，我什至不知道这个问题与PIXI有什么关系。您已经将其包含在您的codePen项目中，但实际上从未使用过该库。所有渲染都直接使用本地2d canvas API完成。而没有在屏幕上绘制字符精灵的原因是因为它是在画布上绘制的，因此从未添加到DOM中。在此行上看​​到

buffer = document.createElement("canvas").getContext("2d");

您正在创建canvas元素，然后将其2d上下文分配给变量“ buffer”，但是DOM元素实际上从未添加到文档中。因此，您需要执行以下操作：

bufferCanvas = document.createElement("canvas");
buffer = bufferCanvas.getContext("2d");
window.document.body.appendChild(bufferCanvas);