如何使用css3校正鱼眼全景图？

Question

我觉得现在是时候将我的flash全景图转换为js / html5 / css3了。我看过一些使用单独的平面图像的优雅解决方案，但我的都是鱼眼......

我的直觉告诉我，使用-webkit-transform：matrix3d是可行的，但我并没有完全达到它。

如果可以在css3中真正完成任何想法吗？

非常感谢。

Answer 1

是的，可以做到，但你最了解你的数学。请注意，您不使用CSS3，而是使用专有扩展，这只适用于webkit浏览器。你可能最好使用Canvas元素来完成这项工作，它不仅可以被更多浏览器支持，而且还可以让你有更大的自由去做你想做的任何转换。

编辑：
那么，将你的图像切割成许多薄的垂直切片，每个切片应按大约1 / cos（[偏离中心的角度]）缩放，并且倾斜以考虑在右侧和左侧的角度不同切片。这样你应该得到一个“逆鱼眼”形状，其中图像的顶部和底部是凹的，你可能想把它切成方形。

Answer 2

我发现了three.js。

看起来很有希望。