我试图在HTML5画布上绘制大图像(5000 * 5000像素)。 这样做的最佳做法是什么?
你们可以为此推荐最佳读物并分享你的个人经历吗?
答案 0 :(得分:1)
目前我所知道的是:
Double buffering images - >非常适合你的速度。
Anti-aliased images - >即使调整大小,图像质量也很棒
A good tip - >如果您打算使用putImageData()
我作为HTML5游戏开发者的经验是,这两种做法真的很棒,我同时使用它们。
When displaying lots of complex objects(我不知道它是否相关,但可能派上用场,了解如何正确地做到这一点非常棒)
也; this
答案 1 :(得分:0)
这取决于你正在做什么,但是如果你计划在5000px5000px图像上滚动,我肯定会将其分解为部分或图块并使用drawImage
仅绘制用户将看到的部分
对于绘制大型图片,您会看到使用putImageData
drawImage
的效果会降低putImageData
。使用粒子等进行任何操作时,putImageData
都是惊人的。基本上,当您在屏幕上绘制大量小块时,可以使用{{1}}轻松绘制100,000个对象。
如果您只绘制用户可以看到的部分,那么性能和内存使用应该不是问题,即使完整的5000x5000也不应该太大部分问题。你正在做的事情并不罕见,大多数浏览器应该能够处理它。
Here is a poor unfinished example I was working on for a previous employer 该示例使用了大量的磁贴,甚至可以实现冲突和路径查找,并且可以正常运行。如果我只绘制一个大的地图图像,如果我没记错的话,那将是10000x10000左右(每个图块是64x64)