|
一位小哥耗时 16 个月打造的 3D 版赛车游戏，这两天忽然火了起来。 只需一个浏览器，就能驾车从森林、海滩，“无缝切换”到广袤的沙漠甚至平原： 无论春夏秋冬还是白天黑夜，也无论你用的是电动汽车、自行车（？）还是公共汽车： 甚至不想开的时候，还可以开启自动驾驶模式，感受一波“AI 飙车”的快乐。 △ 甚至有“自”行车 & 自动驾驶小巴据小哥表示，这个名叫 Slow Road 的 3D 赛车游戏没有用到任何传统引擎，而是基于 JavaScript 编写的，无需登录就能直接在浏览器上运行。 要是电脑发出了吃力的声音，稍微更改一下渲染配置就能搞定。 网友们也是嗨得不行：此情此景怎能少得了经典 BGM 逮虾户（Deja Vu） △ 作者回复：我写代码时听的是 10 小时沉浸版还有网友回忆起了自己几十年前做过的 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，包括在环境上，开发更多的越野地点、加入更多环境细节，包括建筑、动物、植物阴影、灯光效果等； 赛车上，加入更多的赛车皮肤和车辆类型；天气上，细化天气类型（下雨、下雪、刮风等），也进一步改善已有天气的效果； 功能上，将来会加入竞争模式和全球排行榜（包括限时竞速、比拼距离等），同时对系统进一步进行优化，未来适配手柄、赛车模拟器等。 你做好上班摸鱼的准备了吗？（手动狗头）
| 
雷达卡
发表于 2022-11-5 19:12:53
提升卡
千斤顶
