关于webgl的大型应用

概述

最近公司在作一个大型的webgl应用，总结以下:

1.建模软件建模(3d Max revit)

2.自定义一套 语义化的模型格式，并编写模型格式转化插件,把建模软件的模型格式转成自定义格式。

为何要自定义语义化的模型格式呢？

由于，如今浏览器的性能很尴尬说好很差，说差不差。得优化啊！
好比：模型里带了描述数据，指这单个模型的 长宽高 自定义数据等。这些数据每每是比较庞大的，并且每个小模型都有，不可能随着模型加载到 浏览器上去。那么就得把模型数据，与几何数据分离。模型数据放数据库，几何数据保留，而且作必定优化，好比只存 原几何体的基础信息，经过变换获得 相似的几何体
（不少场景下，有不少相同的 长方体，在模型格式中 能够 只存一个，其余的 copy出来）

3.浏览器性能有限，不能直接加载过大的模型文件，（太大了一直loading用户也受不了）就得 本身写 切割模型 的小工具，把大的模型，切成一个一个的小模型，按需加载，或者分布加载。

4.编写展示层对webgl的交互操做 封装，推荐库 Three.js babylon.js cannon.js xeogl.js
各有强处这里就不作说明了。

5.后端提供 api 点击某个模型，返回对应的模型数据。

综上所述 webgl 的应用就是

1.webgl 展示层 封装基础 交互 操做等.

2.webgl 服务层
1).提供用户上传模型
2).自动转换模型且模型数据与几何数据分离
3).自动把大模型切割成小模型
4). 提供api

todoList

1.完成 webgl server
2.完善 webgl 展示层 各类交互操做

暂时就想到这些，下面本身写的一个小的demo 慢慢完善。。。
https://github.com/shinseed/T...

使用

1.npm install || yarn install

2.npm run dev

3.超级玛丽 模式操做 w、a、s、d 空格 (只作了向下的碰撞检测)

SloceJson 使用

1.model 文件夹为原始模型文件

2.output 切割完后的模型文件

3.终端进入 该目录 node sliceJson.js

文档目录

1.src 源码

2.sliceJson 把大的模型文件切割成小模型

3.static 静态资源

4.config webpack 配置