使用JavaScript进行图像处理过滤

Question

如果您查看Google街景图像，图像会从中心向边缘径向扭曲，从而产生更逼真的印象。

我希望使用JavaScript实现类似的效果。

那么是否有任何图像处理脚本/库/算法来提供这种特定效果？

Answer 1

我所知道的没有任何现成的东西。有很多方法可以解决这个问题，但这些方法都不是很直接：

为了努力/现实地做到这一点：

• 使用纯CSS或JS，从中心开始拉伸图像的边。举个例子，单独留10％。拉伸下一个9％到10％的宽度。接下来8％到10％的宽度，然后是7％到10％等...如果使用JS，使用canvas，如果使用CSS，则需要大量具有偏移背景位置的DIVS（google“CSS Coke Can”作为基本前提）
• 使用像Three.js这样的东西，创建一个3D环境，只需将图像作为背景放置 - 您将在WebGL中获得自由失真。
• 使用CSS3，将图像分成一堆切片，然后将它们放在圆柱形视图中的“相机”周围。您将获得“免费”的边缘失真，但仅限于现代浏览器（我已完成此操作，效果很好）。