threejs:从入门,进阶到实战

喜欢ヅ旅行 2022-01-30 04:45 840阅读 0赞

本教程的目的是实现网页端实现三维模型显示,绘制等…建立系统的知识体系。（之前有断更，现在恢复更新）  
文章内容包括了，常规在网页上的使用，同时还包括了在小程序端的使用。

### 1.three.js 入门文章 ###

该章节旨在大致介绍一下three.js的基础使用  
[**threejs：二维绘图（基础点，线，不规则图形等）**][threejs]  
**threejs：scene相关**

### 2. three.js 进阶篇 ###

##### 2.1 三维基础部分 #####

[**threejs：二维绘图（基础点，线，不规则图形等）**][threejs]

##### 2.2 三维交互（interactive） #####

**三维交互：1.picker 拾取**  
**三维交互：2.dragcontrol 拖拽**  
**三维交互：3.boxSelection 框选**

##### 2.3 具体案例 #####

[**剖切**][Link 1]  
[**爆炸图**][Link 2]  
[**测量：点至点，面至面，面积、体积等**][Link 3]

### 3.GLTF相关 ###

--------------------

[**GLTF格式学习：1. glTF介绍（ 基于WebGL**][GLTF_1. glTF_ _WebGL]  
[**GLTF格式学习：2. glTF的基础结构**][GLTF_2. glTF]  
[**GLTF格式学习：3. 最小glTF文件**][GLTF_3. _glTF]  
[**GLTF格式学习：4 scenes 和Nodes（场景和节点）**][GLTF_4 scenes _Nodes]  
[**GLTF格式学习：5.buffer缓存、bufferView视窗、accesors访问器**][GLTF_5.buffer_bufferView_accesors]

### three.js小程序相关 ###

[**three.js小程序：概述**][three.js]

### 补充WebGL相关知识 ###

### 常见问题 ###

1.[**当物体转到一定角度,有些面消失了解决方案**][Link 4]

[threejs]: https://blog.csdn.net/weixin_42755384/article/details/89180309
[Link 1]: https://blog.csdn.net/weixin_42755384/article/details/89181063
[Link 2]: https://blog.csdn.net/weixin_42755384/article/details/89181047
[Link 3]: https://blog.csdn.net/weixin_42755384/article/details/89181113
[GLTF_1. glTF_ _WebGL]: https://blog.csdn.net/weixin_42755384/article/details/105316210
[GLTF_2. glTF]: https://blog.csdn.net/weixin_42755384/article/details/105316304
[GLTF_3. _glTF]: https://blog.csdn.net/weixin_42755384/article/details/105370629
[GLTF_4 scenes _Nodes]: https://blog.csdn.net/weixin_42755384/article/details/105370725
[GLTF_5.buffer_bufferView_accesors]: https://blog.csdn.net/weixin_42755384/article/details/105370790
[three.js]: https://blog.csdn.net/weixin_42755384/article/details/103048557
[Link 4]: https://blog.csdn.net/weixin_42755384/article/details/90305460