JavaScript canvas 在更改宽度后消失

JavaScript Canvas Disappears After Changing Width

本文关键字：消失 canvas JavaScript      更新时间：2023-09-26

运行此代码后：

var inventoryCanvas = document.getElementById("inventoryCanvas");
inventoryCanvas.width = width2;

它可以正确执行，但是当我运行它时画布消失了。

有谁知道原因吗？

没有办法阻止这种情况，因为它是预期的行为，我遇到了类似的问题，并通过创建一个隐藏的缓冲区画布来解决它。在调整大小之前，您可以将原始画布复制到此缓冲区，调整旧画布的大小，然后从缓冲区重新绘制。

这里有一个快速的小提琴演示它：http://jsfiddle.net/5keo7g2r/

var canvas = document.getElementById('canvas'),
    buffer = document.getElementById('buffer'),
    context = canvas.getContext("2d"),
    bufferContext = buffer.getContext("2d");

bufferContext.drawImage(canvas, 0, 0); //Make a copy of the canvas to hidden buffer
canvas.width = 50; //Resize
context.drawImage(buffer, 0, 0); //Draw it back to canvas
相关文章：