3dtiles(obj转3dtiles)
Cesium 3DTiles转换工具
Download Windows Pre-build
3DTiles 转换工具集, 快速将OSGB、Shp、GDB等格式转为Cesium 3DTiles, 方便搭建三维平台。
这是一个基于c++ 17 和 Qt5.15 项目。
提供了如下的子工具：
倾斜摄影数据仅支持 smart3d 格式的 osgb 组织方式：
正确的目录结构示意：
目前仅支持GDAL格式的面数据，可用于建筑物轮廓批量生成3DTiles.
图层中需要有字段来表示高度信息。
【 攻城略地 】vue3 + vite + ts加载3dTiles
本文适用于从未接触过3d开发的新手，寻找解决方案的部分比较详细，文章最下方有相关包的配置文件，可跳过该部分直接使用。
vite为前端构建工具，我们使用vite来搭建项目基础结构。
开始 {#getting-started} | Vite中文网
如需安装其他模板可查看文档说明。
由于第一次接手3d开发，并不清楚哪些方案比较合适，所以在开始阶段碰到了许多问题，下面是找到解决方案的大致过程。
开发web3d，首先想到的就是用three.js，在参考《 threejs加载3dtiles（倾斜摄影）数据 》这篇文章时也顺利完成了数据的加载，但模型界面却显示不出来，估计与该文章下这条评论出现了一样的问题。
对于3d开发0经验的我来说，只能不停的搜索相关文档尝试解决，花费了几个小时，始终无法解决，但也得知了cesium这个3d框架更适合加载3dTiles。项目开发时，在有限时间里不能在一棵树上吊死，及时转换方向能节省更多的时间，最终在对比两者文档后果断放弃three。
相关资料：
threejs加载3dtiles（倾斜摄影）数据
threejs加载3dtiles（倾斜摄影）数据_Always（一直如此）的博客-CSDN博客_threejs 倾斜摄影
three-loader-3dtiles
GitHub - NASA-AMMOS/3DTilesRendererJS: Renderer for 3D Tiles in Javascript using three.js
3DTilesRendererJS
GitHub - nytimes/three-loader-3dtiles: This is a Three.js loader module for handling OGC 3D Tiles, created by Cesium. It currently supports the two main formats, Batched 3D Model (b3dm) - based on glTF Point cloud.
cesium天然支持3dTiles格式，加载3dTiles很简单，但需要进行额外的配置。
网上有很多vue使用cesium的配置教程，但大部分都是使用webpack进行配置，而且vue2版本居多，各种资料的内容又参差不齐，对于本项目来说造成了额外的时间成本，对新手来说非常不友好。
我在尝试配置后发现始终无效，而且对于这些配置的意思也无法理解，最终放弃直接使用cesium，继续寻找更方便的vue + cesium的解决方案。
cesium.js中文文档
Camera - Cesium Documentation
在一番查找后，最终选择了vue-cesium，vue-cesium支持vue3、typescript，我把他称为3d版的element-ui，开箱即用，非常方便，免去了各种令人头疼耗时的配置过程，对新手非常友好。
文档：
VueCesium - Vue 2.x Vue 3.x components for CesiumJS.
安装：
使用：
安装完成后，你可以选择完整引入或者按需导入，因为我只用到其中几个组件，所以我选择了按需导入，使用 VcPrimitiveTileset 这个组件就能导入3dTiles文件。
其他具体业务的实现查看文档即可，如果你使用过element-ui，那你一定会使用vue-cesium。
在使用过程中发现的问题：
1.文档 VcOverlayHtml 组件描述错误
正确引入样式文件：import 'vue-cesium/dist/index.css’
如果你打开文档时显示是正确的，那就表示文档已经更新过了。
2.build打包报错
打包时，vue-cesium源码内会有ts报错，几乎都是Cesium未找到的错误，这个需要在tsconfig.json中忽略对node_modules 中的检查，你可以配置只忽略 vue-cesium 这个包，我是全部忽略了。
注意：如果你的项目根目录没有配置tsconfig.json，需要先添加该文件，参考： tsconfig.json · TypeScript中文网 · TypeScript——JavaScript的超集
在引用vue-cesium组件的文件内ts也会Cesiu未找到的错误，可以配置ts只忽略该文件。
如果你在使用跟我一样版本的vue-cesium时也出现上述的错误，不用慌张，我们看到VcConfigProvider这个全局配置组件是使用CDN为vue-cesium导入cesium某个版本的，而不是模块化的导入。
由于没看过vue-cesium的源码实现，我猜测原因就是这个，因为没有影响任何功能的实现，我直接使用 // @ts-nocheck 忽略了整个文件的ts检查。
项目使用的各个包及其版本号：
Cesium 3Dtiles模型多边形裁剪简单整理
快三年了，在写了四篇文章，关于Cesium的基本都是水一下，不是不想写，一是没时间，二来确实比较懒，关于Cesium已经一年多没有看过了，最多也就关注一下官网的更新内容，对于Cesium深入了解还真没有下功夫。
最近公司业务调整，手头的业务也停掉了，只剩下维护了，也没有继续待着的意义了，趁着换工作的空，整理一下以前抄过、请教过、写过的一些东西吧，不确定能写多少，就简单记录一下吧。
Ceisum本身有一个clipPlane可以进行裁剪，但是不支持多边形裁剪，想要支持多边形裁剪也要费一番功夫。
多边形裁剪的主要原理：
一、构造裁剪多边形；
二、将构造多边形的定点归化到模型局部坐标系，并获取模型Rectangle，记录并传递给片元着色器；
三、将多边形渲染到到一张构造的纹理上，给多边形一个绘制的颜色，并将纹理赋值给片元着色器；
四、在顶点着色器中把从attribute获取到的定点传递给片元着色器，如
gl_Position = czm_projection*u_modelViewMatrix* viewPos; //投影矩阵*模型视图矩阵*顶点坐标
中的viewPos.xyz;
五、在片元着色器中，根据（四）中传递过来的顶点，判定该顶点是否在（二）中的rectangle中，若在，则计算该顶点在（三）中纹理的uv坐标，用texture2D（texture，uv）获取当前顶点的color值，若不为空，则继续，若为空则discard并返回。
通过以上步骤就可以实现以多边形为边界的模型裁剪。
3dtiles模型操作会随着地形动怎么办
可以调整模型高度。
3dtiles初始的位置在加载了地形后可能位于地形下方，通过调整模型高度让tiles位于地表上，这里高度设定的固定值，也可以通过上边的sampleTerrainMostDetailed获取到实际的高程再调整。
转3dtiles收费吗?
有免费的。
激光点云las格式数据转3dtiles格式数据免费。
操作流程：
1、下载安装cesiumlab白嫖了人家的工具给他一个连接吧。
2、启动运行cesiumlab，注册账号然后登录。
3、选择数据处理→选择点云切片→选择las点云数据→设置各种参数→选择存储类型散列→选择输出路径→提交处理。
osgb转3dtiles，对osgb以及3dtiles的数据结构有了足够的了解，成功地利用FME将osgb数据转换成了3dtiles数据。于是，我开心地决定先来写一下如何将osgb转换成3dtiles数据。