使用 THREE.js 和 CANNON.js 创建 3D 赛车游戏

Create a 3D Car Racing Game with THREE.js and CANNON.js

使用 CANNON.js 物理库和 WebGL 库 THREE.js 轻松创建赛车游戏

你将会学到的

  • 您将了解三个 js 库。
  • 您将了解物理引擎的工作原理。特别是CANNON js
  • 您将知道如何调整您的资产以使用 CANNON RayCastVehicle 类。
  • 您将知道如何使用来自物理引擎的位置和旋转信息并将其应用到您的资产中。
  • 您将知道如何在您的场景中使用碰撞器来防止您的汽车驶过您的 3d 环境。

要求

  • 您需要了解基本的 Javascript。
  • 所需的工具是一个好的文本编辑器和一个可选的导出 FBX 文件的 3D 应用程序,例如 Blender。

说明

创建一款可在包括移动设备在内的浏览器中运行的赛车游戏从未如此简单。使用两个开源THREE.jsCANNON.js ,本课程将带您完成您需要了解的步骤,并构建一个完整的赛车游戏。在路上你会学到

  1. 如何设置你的开发环境
  2. 如何访问免费低成本的资产以在您的游戏中使用。
  3. 如何编辑这些资产以使用 THREE.js 和 CANNON.js 库。
  4. 如何使用 THREE.js 将 3D 添加到 HTML 页面。
  5. THREE.js 灯光、相机和网格的基础知识。
  6. CANNON.js 库的基础知识,包括刚体。
  7. 如何使用 CannonDebugRenderer 或使用作者创建的 CannonHelper 类来调试物理。两者都包含在课程资源中。
  8. 如何使用CANNON.RayCastVehicle类添加带有悬架和完全工作的车轮的汽车
  9. 如何将您自己的资产应用到 RayCastVehicle 并添加碰撞器以使其撞到您的内容。
  10. 如何向游戏添加响应式 GUI

该课程包括赛车游戏的资产,如课程图片和宣传视频所示。作者曾因制作的3D游戏获奖。向拥有超过 30 年游戏创作经验的专家学习。我们将开发的游戏允许玩家从可选、车身、发动机、排气装置车轮中进行选择。它涉及驾驶遥控车绕着花园跑道行驶。

这是一路提高 JavaScript 技能的好方法。所有代码均采用最新的 ES6 风格,全程使用类。 

此课程面向哪些人:

  • 如果您有兴趣开发可在浏览器(包括移动设备)中运行的 3D 游戏。
  • 如果您有兴趣在创建有趣的游戏时了解物理引擎的工作原理。
  • 如果您想知道如何为您的游戏添加响应式 GUI。
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。