在这里记录一下之前遇到的 threejs 融合 webgis 场景遇到的问题：
- 问题：需要在 mapbox 地图中按提供的经纬度信息添加带着色器材质的动态特效
- 首先 要实现在
mapbox 与 threejs 融合展示，目前个人实践来说，比较方便的还是借助 threebox 库进行 threejs 与 mapbox 的相机与场景对齐；
- 其次 有一个问题：
threebox 这个库在进行实体添加时，有一定的局限性，比如它 github 文档中暴露出来的 tb.Object3D tb.line tb.label tb.extrusion 等等函数，接收的参数很有限；想要实现高自由度的实体例如带 ShaderMaterial 的 box 或者 plane，以上的 api 函数是不够的；
- 在控制台打印出
window.tb 后，发现其实这个对象与 three 里的 scene 其实是一回事，而且 threebox 库在全局是有挂载 THREE 这个全局对象的；
- 这样就好办了，用
THREE 原生写法去创建 Geometry 和 meterial，合并为 mesh 手动添加到 window.tb 其实是一样的；
- 经过以上写法，最后只剩下一个问题，就是手动创建的
mesh ，想把它放到指定经纬度，但是 mesh 的原型上是 没有 threebox 封装的 Object3D 对象拥有的 setCoords 方法的，因为 threejs 里没有经纬度的概念，只有世界坐标；
- 那么显而易见，
setCoords 方法其实内部肯定也是把传入的经纬度转为世界坐标，既然知道这个了，完全可以自己写一个工具函数做个坐标转换来实现类似效果；
- 一开始是想用
proj4 库进行坐标处理的，最后翻了下文档，threebox 在 tb 对象下挂载了 projectToWorld 方法，整挺好，直接 mesh.position.copy(window.tb.projectToWorld([经度, 纬度]))，就行了
