threejs尝试开发一个RPG游戏

最近尝试用 Threejs 开发一个 RPG 游戏Demo。没有特别宏大的目标,就希望实现角色在地图上的路线规划 和 简单的战斗打怪。基于此仍然遇到了不小的技术挑战和性能瓶颈

Live: knight-adventure.vercel.app/

Code: github.com/luosijie/kn...

场景构建

这次场景和角色使用了开源的设计素材

最终在 Blender 创建了一个小场景

导出了的素材包括了

  • 场景的 glb 文件
  • 渐变贴图
  • 用于路线规划的navmesh

角色处理

从网上下载的角色一般不会直接拿来使用

  • 需要自己添加或修改一下模型,比如添加希望出现的道具
  • 还要删除多余的动画预设,最大限度减少资源的体积

路径规划

刚开始用的是比较常用的库 three-pathfinding,发现在处理动态路障方面比较麻烦。

后来发现了 recast-navigation-js 可以比较顺利的处理当前的场景

问题与挑战

用 Threejs 开发类似的项目,遇到的主要挑战还是 性能问题 。

即便是在这样简单的场景下,在去除阴影效果的前提下,也无法同时容纳很多 动画绑定的角色。

如何在有限的资源和性能约束下,做出流畅又丰富的游戏体验。将是 游戏设计者 和 开发者 面对的问题

相关推荐
Jmyd012317 小时前
WebGL 三维党史馆怎么扛住 720 度全景与移动端弱网?
webgl·三维数字化
limit00753 天前
三维 WebGIS 工具选型:加载、样式、分析、交付,一套界面能做完什么
android·前端·web3·安卓·webgl
半生过往3 天前
智慧园区数字孪生大屏总结
echarts·three.js
总要学点什么4 天前
第79篇:数据可视化-模拟迁徙效果——把三十条航线画成会飞的弧
3d·信息可视化·数据挖掘·数据分析·gis·webgl·cesium
limit00754 天前
三维模型悬空与切片偏移的排查顺序
低代码·3d·arcgis·web3·安卓·webgl
Shimeri5 天前
越卷越像:我用遗传算法做了个"内卷"实验
算法·three.js·数据可视化·遗传算法·进化算法
Sakura_j_h_5 天前
Three.js 单文件离线机械臂工作台:爆炸图、透明外壳与剖面
前端·机械臂·webgl·three.js·1024程序员节·esbuild
用户621007587026 天前
Web 3D 开发实践:BIM+GIS 融合需要解决哪些技术问题?
前端·three.js
Chen7327 天前
用 Three.js 手搓一个 GIS 引擎(二):栅格瓦片与请求调度
three.js
Chen7328 天前
用 Three.js 手搓一个 GIS 引擎(一):总览、架构与坐标系统
three.js