我正在尝试使用 HTML5 画布制作类似运动模糊效果的东西，但没有成功。
基本上我想做的是拍一张照片，让它看起来像“快进”，就像当你拍照并且人移动时一样。
问问题
6120 次
2 回答
4
有几个画布库已经实现了各种模糊算法。EaselJS已独立实现 x 轴和 y 轴模糊，如您在此示例中所见。
您可能想要的只是他们库中的 x 轴模糊。
于 2012-09-08T03:47:09.163 回答
0
我遇到了相反的问题。缩放图像时，我试图消除模糊。幸运的是，我的问题为您的问题提供了一个简单的解决方案。此外，繁重的工作由 API 执行，因此效率很高。
如果您将图像绘制到较小分辨率的画布上，然后将其放大，您将获得模糊的图像。我已经在许多浏览器中尝试过这个，它似乎工作得差不多。 如果您担心这种技术在浏览器和未来版本中的一致性，这个问题将探讨浏览器何时以及为什么会使用这种模糊行为。
canvas.drawImage 的 image 参数接受另一个画布。当您将图像绘制到中间画布上时，您可以尝试沿一个轴使用小分辨率。然后，将其缩放回原始大小，模糊效果应主要沿一个轴。
我不是图像专家，所以我不知道如何最佳地使用运动模糊（它是否应该沿着一个轴等），但是通过一些摆弄和研究，你可以使用这种技术来获得你想要的效果想。
希望这可以帮助
于 2013-02-25T20:51:52.213 回答