html5 – 在另一个画布上绘制画布很模糊.我该如何解决?

前端之家收集整理的这篇文章主要介绍了html5 – 在另一个画布上绘制画布很模糊.我该如何解决?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我一直在使用一些 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); ?否则你正在压缩牛头怪?

原文链接:https://www.f2er.com/html5/168312.html

猜你在找的HTML5相关文章