基于webgl2的知识开发mapboxgl 3d customelayer学习教程。笔者学习webgl过程中，每个教程都会新出一个场景和数据，学完一节再看下一节就有点蒙。后来改在地图场景中练习，将webgl知识与地图应用结合起来学习比较有场景代入感。因此，本学习教程本质还是webgl理论，只是故意固定到地图中进行带入。
为降低学习难度和第三方框架干扰，建议所有新手，使用原生webgl进行学习，不引入第三方webgl框架，例如three、regl、twgl、luma等。原因是新手不理解底层，使用框架出现各种问题也不知道定位和解决，资料也没原生webgl多，所以新手绝对不能直接就上框架，后患很大，笔者亲自体会入门直接luma，各种问题翻遍了源码还是webgl基础，一个问题卡几天，千万别直接框架，哪怕three也不行。
- 三角形-->顶点索引--> 纹理绘制
- mvp矩阵略（自行掌握，使用地图已有，练习不再说明，部分模型需要引入矩阵计算之后）
- 光照与法向量
- 正射投影略，有需要自行掌握，地图自带透视投影
- fbo（离屏渲染）
- 地图上的阴影
- 地图上的文字
- 地图上的模板测试
- 地图上的混合
- 深度检测
- 三维物体透明渲染
# 安装依赖
npm install
# 编译
npm run build
# 启动
npm run serve
当前已有资料如下：
1 绘制三角形
2 顶点索引
3 uv纹理
4 地理坐标系纹理
5 地形
6 地形光照
7 地形纹理
8 偏移旋转
9 模型矩阵变换
10 球体
11 球体实例化渲染
12 球体透明OIT渲染
13 球体透明dual_depth_peeling渲染