我一直在使用一些
HTML5画布实验,并进行了一系列技术实验编辑
https://github.com/AlexChesser/jsSprite(在Minotaur关键演示中的WSAD,Q,E,X键,在Zombie演示中添加C和B)
如果您查看演示编号1:01-draw_minotaur.PHP,您将看到直接在画布上绘制的图像,它看起来很漂亮.
但是,如果你将我将Minotaur放在画布上的演示进行比较,然后在父画布上画出画布,结果就会模糊:03-drawn_minotaur_on_canvas.PHP
如何确保画布上的画布不模糊?
编辑完整代码在GIT:https://github.com/AlexChesser/jsSprite上
edit2:请注意谷歌已经将我的域名标记为恶意软件(这是公平的,因为托管服务提供商遭到黑客入侵,那里有一个短暂的时刻,那里有某种恶意软件)而不是让易受攻击的链接上升,我已经更新到专门指向github中的源代码.
解决方法
这是一个棘手的问题!
对于画布,您实际上并不使用Style来确定其宽度和高度.
因此,通过设置画布的样式,您实际上会扭曲画布.
所以写< canvas id =“game”width = 512 height = 512> < /画布>在您的主页面将解决您的问题.
我测试了它以确认确实是问题,所以如果还有问题,请告诉我,我会发给你我的代码.
也不应该只是MainContext.drawImage(m.canvas,0); ?否则你正在压缩牛头怪?