Javascript 画布图像调整大小和裁剪噪波

我正在尝试修复使用canvas和drawImage裁剪图像时的问题。 我浏览了互联网上的所有文章，找不到简单的答案或帮助

脚本实际上可以工作，但是裁剪的图像充满了噪声。我将感谢您的帮助和想法，这将导致解决这个问题

当我使用这些功能时，我正在使用firefox（27.0.1）

$(document).ready(function() {
    var width = 80, height = 80;
    var ctx = document.getElementById('canvas').getContext('2d'),
       img = new Image,
       w = 200,
       h = 200,
       x = 800,
       y = 100; 
    img.src = $('#image2').attr('src');

    ctx.drawImage(img, x, y, w, h, 0, 0, width, height);
});

Fiddle示例，展示了裁剪后的外观：

我如何看待它（以及我希望它看起来如何）以及它在以下情况下如何变化的示例：

---

画布处理得当，效果非常好。不幸的是，有时程序员需要深入寻找解决问题的方法

我的解决方案实际上来自另一篇文章：

我遇到的问题是，当使用canvas将图像从非常好的质量裁剪到非常小的尺寸时，如果根本不进行处理，最终的裁剪将缺少任何抗锯齿处理

---

如果您碰巧使用canvas和drawimage获得了粗略的裁剪结果，那么上面的链接就是解决此问题的众多解决方案之一。

js fiddle不做任何事情。。。即使有一个正确的图像，我也觉得很奇怪。其他人能确认小提琴问题吗？使用jquery，你可以通过在画图之前缩放画布来作弊：

ctx.scale（0.5,0.5）ctx.drawImage（img，x，y，w，h，0，0，w，h）我也不是专家，但我会在这里介绍您：