无法删除图像中的纹理位

Question

我正在使用画布在HTML5中制作游戏。

当我使用CanvasRenderingContext2D.drawImage绘制从图像中裁剪的纹理时，您有时可以在图像中看到一些周围的纹理。

一个例子是当我从这个tileset渲染我自己的文本时：font "tileset"，根据浏览器窗口的宽度和高度，你有时可以看到相邻图块的一瞥。在这里你可以看到下面的一些字母：text，如果我将浏览器高度改变一个像素，它就会消失。

似乎图形故障发生取决于浏览器窗口的高度/宽度。如果你将高度改变1个像素就会消失，如果再改变一个高度，它就会恢复。

有谁知道如何解决这个问题？如果没有，我是否应该尝试逐像素地手动绘制图像，或者像为tileset添加一个像素边距一样？

Answer 1

Canvas具有半像素分辨率，所以我猜你可以将裁剪区域放大半个像素，看看是否省略了噪点。

如果这不起作用，您将回到使用更大的spritesheet。

如果您决定使用更大的spritesheet，here's我的Photoshop精简版的双倍版本。