【发布时间】:2013-05-25 13:22:26
【问题描述】:
三个 JS,通常看起来有棱有角且直边。我已经很久没有使用它了,因此我很难理解如何弯曲世界。我想渲染器或其他东西必须改变,但想法是采用 2d 地图并将其变成一个简单的三车道运行游戏。但是,如果您看下图是另一个类似的游戏,我该如何实现鱼眼效果呢?
【问题讨论】:
标签: javascript three.js webgl game-engine perspective
三个 JS,通常看起来有棱有角且直边。我已经很久没有使用它了,因此我很难理解如何弯曲世界。我想渲染器或其他东西必须改变,但想法是采用 2d 地图并将其变成一个简单的三车道运行游戏。但是,如果您看下图是另一个类似的游戏,我该如何实现鱼眼效果呢?
【问题讨论】:
标签: javascript three.js webgl game-engine perspective
我会根据与相机的距离对每个顶点的基础做这种效果。 此外,也许稍微调整一下具有更大垂直 fov 的透视相机会增强“曲线”的效果。 这只是一个以某种方式模拟的简单失真效果,它可能不是真正弯曲的。希望这会有所帮助。
【讨论】:
我确信有许多可能的不同方法...这里有一种可以产生很好的桶形失真效果。
您可以通过将普通广角相机渲染到纹理,然后将其投影到透镜形状的平面(甚至是球体)来执行类似的操作,然后实际的屏幕渲染来自指向该纹理的相机。
我没有可用的 ATM 代码,但如果有兴趣,我应该可以在几天内找到它。或者你可以从 three.js 的例子中改编。 Three.js 包含一些后处理示例,其中首先将场景渲染为纹理,然后将该纹理应用于四边形,然后使用正交相机拍摄。您可以通过将正交相机更改为透视相机来修改此类示例,然后将四边形扭曲/更改为更合适的形状。
走极端,这种方法会产生一些像素化/块状伪影。
【讨论】: