这是一个.png图像(在右边)和画布元素,我画了图像(在左边).你能注意到质量差异吗？画布呈现出明显的质量损失的图像.我们可以做什么？
我在Chrome和IE9上观察到这个结果.其他人也许会做同样的事情.
我如何渲染图像是很平常的：在脚本中,我创建一个新的Image()对象,加载后我调用
context.drawImage(myimage,x,y);
编辑：
这是我在画布上观察到的初始图像：
这是我在写完之后画出的东西：
context.drawImage(MYIMAGE,parseInt函数(x)中,parseInt函数(Y));
我能说什么,好回答人.最好的拍摄.帽子是给你的.
EDIT2：
我试过context.drawImage(myimage,parseInt(x)0.5,parseInt(y)0.5);这里是结果：
我觉得比第一个更糟糕.我在chrome上观察到这一点,在IE9上它差不多.
解决方法
我刚刚创建了两个图像的叠加,以便它们相互抵消.
它没有工作,我有边缘的困难.
它没有工作,我有边缘的困难.
请检查您的坐标x,y是否为整数.
这里使用浮点数可能会模糊您的图像,因为一些实现尝试将其“像素之间”
context.drawImage(myimage,parseInt(x),parseInt(y));
如果这还不行,请尝试使用整数值0.5
我知道对于OpenGL实现,你必须使用0.5的坐标才能击中一个像素的中心.
context.drawImage(myimage,parseInt(x)+0.5,parseInt(y)+0.5);
编辑：
在Html5Rocks上查看this page！