实景三维
参考资料
数字三维
Cesium中国博客列表
https://my.oschina.net/u/1470240
CesiumLab 视频教程
http://www.iqiyi.com/w_19s2ql9p69.html
Cesium 批量显示三维模型(gltf)的心得体会
https://blog.csdn.net/zxzfcsu/article/details/80957399
学习 Cesium 过程中搜集到的优秀资源
http://cesium.xin/wordpress/archives/130.html
一位研究得很深的Giser 写的 Cesium 学习笔记
https://www.cnblogs.com/fuckgiser/tag/Cesium/default.html?page=1
Cesium 教程系列目录：
https://www.cnblogs.com/fuckgiser/p/5706842.html
笔记代码
https://gitee.com/Youda2019/ExamplesforCesium
语雀的知识库- 三维
https://www.yuque.com/search?q=%E4%B8%89%E7%BB%B4
三维数据可视化-资料
https://www.yuque.com/gisser/3d
Cesium 基础知识介绍
https://www.jianshu.com/p/3de8cb08bc4c
这几类数据归为一类都是矢量数据，所以这里要介绍的就是如何加载矢量数据，当然数据量特别大的时候就需要考虑矢量瓦片，Cesium也正在开发矢量瓦片相关版本，之前看到一个折中方法是先读取矢量瓦片而后转换成GeoJson进行加载
GeoJson是较为通用的一种网络矢量数据传输方案。
KML是Google Earth定义的一种矢量数据组织方式，其加载方式与GeoJson基本相同，
Cesium QQ学习群
476893082
Cesium学习笔记-工具篇32-cesium圆形扫面线
http://blog.sina.com.cn/s/blog_15e866bbe0102yiw2.html
STK11.6
链接：https://pan.baidu.com/s/1rUbu-dWujWqDSbq93ekTbQ 提取码：84fz
STK官方全套视频教程
链接：https://pan.baidu.com/s/16MQ1HqcXjAL0AD2_g7TvDg
提取码：hb7m
ODTK6.4.3
链接: https://pan.baidu.com/s/1ZtR2ZZ3-3RFIQZCtIUmJ5w 提取码: 2333
开源项目
官网地址：
https://github.com/AnalyticalGraphicsInc/cesium
演示示例的沙箱请求的地址是：
http://localhost:8080/Apps/Sandcastle/
加载了3d模型的效果
https://gitee.com/someu/cesium3d
编译Cesium
cd E:\temp\Cesium-1.51 cnpm install npm run release
https://blog.csdn.net/wt346326775/article/details/83789578
常用代码
// 去掉左下角的商标信息 viewer._cesiumWidget._creditContainer.style.display = "none";
计算经纬度
// Compute longitude and latitude in degrees var cartographicPosition = Cesium.Cartographic.fromCartesian(entity.position.getValue(Cesium.JulianDate.now())); var longitude = Cesium.Math.toDegrees(cartographicPosition.longitude); var latitude = Cesium.Math.toDegrees(cartographicPosition.latitude);
去掉底部的空白横线
原因： #app 元素未设定宽高：
<style>
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
#app {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
</style>
官网
目前的理解：
建模等资料需要上传到 他cesium 服务器，并且做了权限验证，如果内网部署，还需要额外的费用。
官网 js api 文档
https://cesiumjs.org/Cesium/Build/Documentation/
资料
官网中的第一个app
https://cesium.com/docs/tutorials/getting-started/#your-first-app
纽约城市地图工作坊
https://cesium.com/docs/tutorials/cesium-workshop/
上传文件到资料库
所支持的文件格式： glTF (.gltf, .glb)、KML/COLLADA (.kml, .kmz) 等等
https://cesium.com/docs/tutorials/uploading/
D:\station-share\高峰3D\Model\Model
mtl + 图片 model
Primitive API面向图形开发人员的低级别，
以及Entity API数据驱动可视化的高级别。
开源项目
Cesium的教程
https://gitee.com/HQCode/Cesium-test
Cesium中的地形介绍
https://my.oschina.net/u/1585572/blog/290481
交流前准备的问题
- 硬件采集回来的模型有哪些？ 3D 模型如何编辑？
- 如何把采集的模型转换成三维图形？
- 量测，通视分析，日照分析，淹没分析，剖面分析 如何做？
- 有哪些做的框架，类似 MarsGIS, ThingJS 这些框架，有没有推荐使用的？
- 有哪些做三维的框架？
- 没有地理信息人员如何做？
- 大神的微信（小解）
- 之前做项目周期，经验有哪些？
- gis服务器用的什么？
- 需要Gis工程师吗？
- Cesium 地形图文件？
- 整理的资料
- Cesium 怎么部署离线版？ 环境 nodejs/ tomcat
3D Tile
加载3D Tile
3D瓦片可以显示建筑物、地标乃至森林广告牌等等以及其对应的属性信息。每个3D瓦片就是一个3D对象
https://github.com/AnalyticalGraphicsInc/3d-tiles-samples
支持的格式
b3dm： Batched 3D Model 用于展示城市建筑等大规模的3D对象
l3dm： Instanced 3D Model 用于展示模型等。
pnts： Point Cloud 用于展示大量的3D点。
vctr： Vector Data 用于展示矢量元素，代替KML（那么CZML呢？动画？）
cmpt： Composite 用于合并异构3D瓦片，如将城市建筑的b3dm和树的i3dm合在一起展示。
解决Cesium1.50对gltf2.0/3dtiles数据读取的问题
大量模型肯定是3dtiles啊 如果是个小体量的可以考虑gltf啊。各人感觉gltf数据集比3dtiles 好操控
max格式模型 -> obj格式 -> 3DTiles格式
现在的问题是我的3DTiles数据只有一个级别的瓦片，如何制作多级别的瓦片数据呢
提供程序请求切片
需要流式传输到客户端。Cesium支持使用图像提供程序请求切片的几种标准。大多数图像提供程序使用HTTP上的REST接口来请求切片
地图服务器 GeoServer 搭建
GeoServer一：GeoServer的安装与初步使用
https://blog.csdn.net/qq_35732147/article/details/81869864
如果是默认安装，那么用户名为"admin"，密码为"geoserver"。
GeoServer发布影像和地形数据供Cesium使用
https://blog.csdn.net/qq_27532167/article/details/82590086
跨域解决
安装版的 jetty 设置
https://www.jianshu.com/p/3bce123cbaf4
Tomcat 部署版 设置
CORS的原理为：跨域资源共享标准新增了一组 HTTP 首部字段，允许服务器声明哪些源站有权限访问哪些资源。另外，规范要求，对那些可能对服务器数据产生副作用的 HTTP 请求方法（特别是 GET
<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
https://blog.csdn.net/qq_24622397/article/details/78344221
OBJ 文件
3D中的OBJ文件格式详解（转载）
https://www.cnblogs.com/zhouyunqing/p/4305008.html
3ds Max Wavefront OBJ Exporter v0.97b - (c)2007 guruware
OBJ文件是Alias|Wavefront公司为它的一套基于工作站的3D建模和动画软件"Advanced Visualizer"开发的一种标准3D模型文件格式，很适合用于3D软件模型之间的互导，
OBJ3.0文件格式支持直线(Line)、多边形(Polygon)、表面(Surface)和自由形态曲线(Free-form Curve)。直线和多角形通过它们的点来描述，曲线和表面则根据它们的控制点和依附于曲线类型的额外信息来定义，这些信息支持规则和不规则的曲线，包括那些基于贝塞尔曲线(Bezier)、B样条(B-spline)、基数(Cardinal/Catmull-Rom)和泰勒方程(Taylor equations)的曲线。其他特点如下：
(1)OBJ文件是一种3D模型文件。不包含动画、材质特性、贴图路径、动力学、粒子等信息。
地下管线
cesium地下管线和挖坑问题 2017
clippanle
https://www.jianshu.com/p/c0874f226316
尝试： 无地图模型？
http://cesium.marsgis.cn/cesium-example/editor.html#31_onlyModel
Cesium三维球开发的时候，会遇到需要对地下数据可视化的情况，如果只是显示的需要，可以采用这个办法：移除球上的imageryLayers，再设置Cesium球体的透明度，将绘制元素的高度设置为负值（需要夸张一定倍数）。
https://blog.csdn.net/weixin_44674963/article/details/88540333
https://blog.csdn.net/zhangqun23/article/details/88837053
英文论坛，实现了三维实体效果的显示
https://groups.google.com/forum/#!topic/cesium-dev/M7cKgT1IEsw
完善的 三维效果展示 代码 及 步骤
https://stackoverflow.com/questions/41541223/how-to-display-data-underground-in-cesium-js
1.change only one line code in cesium source code;get the cesium source code,then find the file named GlobeSurfaceTileProvider.js,change
<code>command.pass = Pass.GLOBE;</code>
to
<code>command.pass = Pass.TRANSLUCENT;</code>
2.generate the cesium release code with gulp tool;use your CLI to execute gulp release. PS： You may need set your node environment and install the dependency node modules and install gulp tool.
3.Implemention code.PS: note the following snippet can run only if you have changed the cesium source code which is illustrated in step one.
<code><!DOCTYPE html>
<html lang="en">
<head>
<!-- Use correct character set. -->
<meta charset="utf-8">
<!-- Tell IE to use the latest, best version. -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Make the application on mobile take up the full browser screen and disable user scaling. -->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<title>Hello World!</title>
<script src="../Build/Cesium/Cesium.js"></script>
<style>
@import url(../Build/Cesium/Widgets/widgets.css);
html,
body,
#cesiumContainer {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
}
.tools {
position: absolute;
top: 20px;
left: 20px;
width: 100px;
}
</style>
</head>
<body>
<div class="container">
<div id="cesiumContainer">
</div>
<div class="tools">
Opacity: <input id="btnImageryAlpha" type="range" min="0" max="10" value="10" oninput="change()" />
</div>
</div>
<script>
function change() {
var value = document.getElementById("btnImageryAlpha").value;
if (viewer.imageryLayers) {
for (var i = 0; i < viewer.imageryLayers.length; i++) {
viewer.imageryLayers.get(i).alpha = value / 10;
}
}
console.log(value);
}
var terrainProvider = new Cesium.CesiumTerrainProvider({
url: 'https://assets.agi.com/stk-terrain/v1/tilesets/world/tiles',
requestVertexNormals: true
});
var viewer = new Cesium.Viewer('cesiumContainer', {
//skyAtmosphere: false,
//orderIndependentTranslucency: false,
baseLayerPicker: false,
terrainProvider: terrainProvider
});
//viewer.scene.globe.depthTestAgainstTerrain = false;
//change the ugly blue color to black
viewer.scene.globe.baseColor = new Cesium.Color(0, 0, 0, 0);
//default is 1
//viewer.scene.globe.imageryLayers.get(0).alpha = 0.5;
var blueBox = viewer.entities.add({
name: 'Blue box',
position: Cesium.Cartesian3.fromDegrees(-114.0, 40.0, 5),
box: {
dimensions: new Cesium.Cartesian3(400000.0, 300000.0, 500000.0),
material: Cesium.Color.BLUE
}
});
viewer.zoomTo(blueBox);
</script>
</body>
</html></code>
Cesium学习笔记-工具篇06-GroundPush挖地形
http://blog.sina.com.cn/s/blog_15e866bbe0102xwyb.html
groundpush plugin
https://github.com/NICTA/cesium-groundpush-plugin
地下开挖效果展示：
https://www.cnblogs.com/giserhome/p/11029020.html
室内模型
或者说是这个。目前能实现室内模型的，
1. ThreeJS
2. Cesium BIM 模型
https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/index.html?src=3D%20Tiles%20BIM.html
集成 Vue
Vue+Cesium集成笔记
https://blog.csdn.net/u011347088/article/details/83090527
Vue 项目启动抛出 Error/ No PostCSS Config found in
https://yq.aliyun.com/articles/646385
- 在项目根目录创建 postcss.config.js 文件，并配置以下内容
<code data-spm-anchor-id="a2c4e.11153940.0.i1.5a5c3ecanyvqMG">module.exports = {
plugins: {
'autoprefixer': {browsers: 'last 5 version'}
}
} </code>
局域网访问配置
localhost -> 0.0.0.0
https://blog.csdn.net/qq_32340877/article/details/79738949
注意出现Unable to determine Cesium base URL automatically, try defining a global variable called CESIUM_BASE_URL.错误时，解决方法是在webpack.dev.conf.js和webpack.prod.conf.js文件中plugin里面加上：
CESIUM_BASE_URL:JSON.stringify(’’)
https://blog.csdn.net/wqy248/article/details/87970163
开发工具
VSCode 小技巧
添加cesium的vscode帮助
npm install --save @types/cesium
参考资料：
http://cesium.xin/wordpress/archives/283.html
gltf 三维模型验证工具
https://pissang.github.io/clay-viewer/editor/
模型转化工具
安装方法：
https://www.npmjs.com/package/obj23dtiles
obj23dtiles -i AGI_HQ.obj --b3dm obj23dtiles -i AGI_HQ.obj --b3dm --outputBatchTable obj23dtiles -i AGI_HQ.obj --tileset obj23dtiles -i Model.obj --tileset obj23dtiles -i 巷道.obj --tileset obj23dtiles -i 400维修硐室点云.obj --tileset
【重要资料】
gltf模型姿态的问题
https://blog.csdn.net/zxzfcsu/article/details/82532491
图像渲染工具，建模工具
https://docs.blender.org/manual/zh-hans/dev/getting_started/index.html
坐标转换资料
https://blog.csdn.net/u012411498/article/details/80716751