一位小哥耗时 16 个月打造的 3D 版赛车游戏，这两天忽然火了起来。
只需一个浏览器，就能驾车从森林、海滩，“无缝切换”到广袤的沙漠甚至平原：
无论春夏秋冬还是白天黑夜，也无论你用的是电动汽车、自行车（？）还是公共汽车：
甚至不想开的时候，还可以开启自动驾驶模式，感受一波“AI 飙车”的快乐。
据小哥表示，这个名叫 Slow Road 的 3D 赛车游戏没有用到任何传统引擎，而是基于 JavaScript 编写的，无需登录就能直接在浏览器上运行。
要是电脑发出了吃力的声音，稍微更改一下渲染配置就能搞定。
网友们也是嗨得不行：此情此景怎能少得了经典 BGM 逮虾户（Deja Vu）
还有网友回忆起了自己几十年前做过的 3D 赛车游戏，这波属实“爷青回”了：
来看看它究竟是怎么实现的。
基于 Javascript 而非传统引擎搭建
与大多数 3D 赛车游戏采用 Unity3D、UE 等传统引擎不同，Slow Roads 是基于 JavaScript 编写的。
具体来说，它采用了一个名叫 Three.js 的开源框架，相当于一个能实现 3D 效果的 JavaScript 库，基于原生 WebGL 运行，可以在大部分网页浏览器中搞定交互式 2D / 3D 图形。
除了开头提到的随意切换地点、季节和天气以外，这个赛车游戏也可以随意切换各种车型和视角。
此外，考虑到不同电脑对浏览器的适配，这款赛车游戏还给出了不同级别的渲染设置，从“粗糙大色块”到更精细的树木和围栏都能生成。
要是有电脑显卡的话，还可以更改一下浏览器设置，给图形渲染加加速。
所以，这个赛车游戏中“任意变幻”的环境是如何生成的？
首先是生成环境地形。
小哥采用了类似柏林噪声（Perlin noise）的自定义算法，来生成环境高度图（Heightmap，用于生成三维地形的图像），随后进行简单修改让山景看起来更逼真。
柏林噪声，Ken Perlin 发明的自然噪声生成算法，经常用于在游戏和特效中生成随机内容，包括火焰、云彩、奇形怪状的岩石以及树木和大理石表面等。
随后是制作赛道。
选择地图上一个不太陡峭 / 凹陷的地方作为起点后，选择一个方向并测量周围高度图，以坡度最缓的路线作为道路中线，并给每个点注释上元数据，包括道路宽度、曲率等。
值得注意的是，如果赛道铺到一半出现“打结”的情况，也就是铺到一半撞到了一起，一定要想办法解决。这也是道路铺设最难的地方之一：
接下来就是渲染环境了。
从图中来看，整体环境被分成了很多个分辨率 10m 的大型网格，最大视距 1km²；靠近道路时，每个网格又会被分成 5×5 的较小网格。
越接近道路中线，渲染越精细，最终道路高度和底层环境高度之间会进行插值，尽量让它保持“无缝衔接”。
当然小哥表示，这种衔接并不是“真・无缝”的，但通常看不出来。
最后就是整个环境的渲染了，这里面也有一些小细节：
包括地面和悬崖纹理、基于柏林噪音做草色变化，以及给树木等植被加上简单阴影、在湖泊周围渲染更多树等。
除了环境之外，就是一些基础物理学的配置了，包括重力、表面摩擦力和动力学计算等。
不过为了节省性能，小哥忽略了提示牌和树木的碰撞。
此外，他也采用了更“平和”的电动汽车作为核心赛车手，因为这样一来就不需要考虑齿轮或 RPM 等部件，而音频和物理特性也更容易编写了。（小哥称：内燃机正逐渐过时！）
当然，随着这款游戏的关注度上升，他表示后续还会进行更多优化。
未来支持手柄和汽车模拟器
随着人们对这款游戏的好奇度提升，小哥也着重解答了几个热点问题。
例如，采用 JavaScript 编写游戏的原因，是因为小哥想改变人们对浏览器的“刻板印象”，它可以做到比查资料更广泛的事情，甚至还能更好地对游戏性能进行优化。
不过，目前这款游戏还没有开源。小哥表示，后续可能会开源部分子系统，如图形 MOD 接口等。
对于这款游戏的未来，小哥也立下了几个 flag，包括在环境上，开发更多的越野地点、加入更多环境细节，包括建筑、动物、植物阴影、灯光效果等；
赛车上，加入更多的赛车皮肤和车辆类型；天气上，细化天气类型（下雨、下雪、刮风等），也进一步改善已有天气的效果；
功能上，将来会加入竞争模式和全球排行榜（包括限时竞速、比拼距离等），同时对系统进一步进行优化，未来适配手柄、赛车模拟器等。
你做好上班摸鱼的准备了吗？（手动狗头）
玩耍地址：
https://slowroads.io/
参考链接：
[1]https://twitter.com/anslogen
[2]https://news.ycombinator.com/item?id=33305234
[3]https://anslo.medium.com/slow-roads-tl-dr-a664ac6bce40
[4] 10 小时版逮虾户:https://www.youtube.com/ watch?v=9ILQNSgE7mw
本文来自微信公众号：量子位 （ID：QbitAI），作者：萧箫
标签： 赛车游戏
