Cesium

实景三维

 

参考资料

数字三维

 

 

安装项目结构

前提软件

TE Pro6.1.1

MK

软件存放目录:/Users/jack/Documents/project/数字三维

三维安装说明:

\\192.168.1.103\station-share\高峰3D\数字三维

 

1、MK.rar解压至本地D:   
2、TE Pro6.1.1安装后,将sp2目录内容复制到安装目录(即安装的根目录)

用Internet Explorer 软件,打开这个网站: http://121.199.43.212:8087/GIS_SkySystem/

之前用 IE8 可以正常访问的。测试用 Windows 10 下面的 Internet Explorer 可以正常打开网址。

引擎

Unity3d 

ue4  

http://www.52vr.com/article-1985-1.html

 

 

网页版平台

Cesium

       Cesium是一个地图引擎,专注于Gis

       国内很多三维空间分析的必要功能如量测,通视分析,日照分析,淹没分析,剖面分析等都没有继承进系统中,甚至图层管理都没有,更不用说导航球,UI风格等交互层面的内容,这给业务开发带来了大量的不便利。

       cesium本质就是依托于node环境的一个三维地球渲染的web网站

 

OpenWebGlobe

 

 

babylonjs

        

        https://www.babylonjs.com/

ThreeJS: 

        Three.js作为以WebGL封装的3D库

Babylon.js         Babylon.JS是最好的JavaScript3D游戏引擎,它能创建专业级三维游戏

hightopo

 

 

http://www.hightopo.com/demos/index.html

 

Skyline

http://www.skylineglobe.cn/

 

TE Pro

 

bentley 

专业团队构建的三维效果

https://www.bentley.com/zh/project-profiles/mcc-tiangong_bageng-bridge

数据采集

三维激光点源

三维激光密集点云扫描系统是一种高速高精度的三维扫描测量设备,系统具有速度快、精度高、易操作、可移动等特点。

https://baike.baidu.com/item/%E4%B8%89%E7%BB%B4%E6%BF%80%E5%85%89%E5%AF%86%E9%9B%86%E7%82%B9%E4%BA%91%E6%89%AB%E6%8F%8F%E7%B3%BB%E7%BB%9F/5078054

 

三维激光扫描系统  Maptek I-Site SR3L

DXF 

模型处理

软件处理,过滤掉,1~2天完成


实景建模
倾斜摄影

需要做的内容,井下管道,管网,机电设备的显示
结合整个地球,Google地球,做一张图管理。人从外面进入系统

 

 

倾斜摄影测量技术

通过实践表明,人工1~2年的人工建模,利用倾斜摄影测量技术进行三维建模只需要3~5个月,大大提高了效率,缩短了时间。

 

采集工具数据导出

切片是指三维图像中的一个切面对应的图像。切面可以是过图像内部一点且平行于XY、YZ、XZ平面的平面,也可以是任意的过三维图像内部一点任意方向的平面。通过提取切片

HTML5/WebGL

基于HTML5以及WebGL技术研发的TerraExplorer for Web产品,无需下载与安装任何插件就能在浏览器端轻松实现三维地形浏览、三维城市模型加载、矢量图层加载、KML文件加载以及栅格图层加载等功能。同时支持多平台与多浏览器的运行环境。

WebGL 版本: 基于 Cesium 做的一套框架

演示示例:

http://skylineglobe.com/sg/TerraExplorerWeb/TerraExplorer.html

超图 WebGL版本

https://www.supermap.com/cn/

 

效果展示

http://support.supermap.com.cn:8090/webgl/examples/examples.html#layer

 

 

https://www.cnblogs.com/cesium1/p/10062942.html

封装的平台
ThingJS平台

        价格收费: http://www.thingjs.com/guide/?m=price

MarsGIS平台

在 Cesium 上,重新封装的一个平台。有图层管理,导航等功能。做得不错。

        价格收费:[http://cesium.marsgis.cn/go.html?id=16 http://cesium.marsgis.cn/go.html?id=16

        http://cesium.marsgis.cn/examples.html#baselayer-typelayer

 

        文章:https://www.jianshu.com/p/9c4530b3a981

教程也挺丰富的:

官员cesium的教程

http://cesium.marsgis.cn/go.html?id=11

 

 

ArcGIS 和 SuperMap(中国 超图)

一般是采用 基于 OGC 标准开源的 GIS 技术实现方案

 

JavaEE 派: GeoServer + uDig(桌面软件) + Tomcat + PostGIS / MySQL 空间扩展

                  OpenLayers / Leaflet / Cesium (浏览器客户端)

Gis 基础知识

http://cesium.marsgis.cn/go.html?id=gis

 

 

可视化技术基础知识

http://cesium.marsgis.cn/go.html?id=v

常用数据格式

xyz格式瓦片

arcgis格式瓦片

ArcGis Server服务

 

Cesium 招聘要求

1、熟悉cesium引擎,有相关开发或使用经验

2、GIS、计算机、数学相关专业,本科及以上学历

3、精通JAVASCRIPT语言

4、具备GIS领域相关专业知识者优先

5、具备WEBGL相关技能者优先

 

研究和开发三维相关功能,如三维渲染特效、漫游交互、WebVR;

参与Cesium相关应用系统前、后端开发;

精通JS、HTML、CSS,熟练掌握Vue、ES6以及三维开源引擎Cesium,熟悉Babylon.js、Three.js开源引擎;

熟悉SuperMap、CityMarker、ArcGIS三维SDK或BIM引擎渲染开发者优先考虑;

做过智慧城市、BIM或3DGIS相关项目经验者优先考虑。

基于开源引擎Cesium实现地图服务的浏览和地图功能的开发;

Cesium

英['si:zɪəm] 美['si:zɪrm]

https://cesiumjs.org/

优点:有较多的demo,详细的api文档,有测试平台,比较丰富的展示特性和扩展。

 

工具

Cesiumlab是一款专为Cesium开源数字地球平台打造的免费数据处理工具集。

https://www.cesiumlab.com/

目前包含 地形数据处理、影像数据处理、点云数据处理、数据下载、建筑物矢量面处理、倾斜数据处理、三维场景(max,maya)处理、BIM数据(revit,ifc)处理等工具。同时提供一套java开发的数据服务器。形成从数据处理、服务发布、到代码集成的完整工具链。它能帮您最快速、最低成本的搭建项目所需要的基础场景,为您节省宝贵时间。

 

免费的数据生成工具,可以从osg转为3d tiles,这是目前最大的瓶颈。简单说,Cesium目前提供了基本技术和规范,但并没有提供完整的解决方案,同时还缺少基于3D Tiles的丰富的扩展和应用。当然,我们不能对一个开源项目要求苛刻,

 

 

CZML是cesium中很重要的一个概念,也是一个亮点,CZML使得cesium很酷很炫地展示动态数据成为可能。

CZML是一种JSON格式的字符串,用于描述与时间有关的动画场景,CZML包含点、线、地标、模型、和其他的一些图形元素,并指明了这些元素如何随时间而变化。

 

 

 cesium中支持载入3D模型,不过只支持gltf格式

 

Cesiumjs托管在著名的社交编程平台github上,

https://github.com/AnalyticalGraphicsInc/cesium,

 

 

Cesium 中文社区

http://cesiumcn.org/

教程

http://cesiumcn.org/guide/%E6%96%B0%E6%89%8B%E5%85%A5%E9%97%A8%E4%B8%AD%E6%96%87%E6%95%99%E7%A8%8B/Cesium%E5%85%A5%E9%97%A81%20-%20Cesium%E4%BB%8B%E7%BB%8D/

 

知识点

带有单个建筑的KML / COLLADA示例

用于流式传输大量异构3D地理空间数据集的开放规范

Cesium为开箱即用的许多不同提供商提供图像支持。

Cesium数据格式

glTF (小场景的三维模型)

3D Tites 数据格式 (大场景的三维模型, LOD瓦片化)

    LOD技术即Levels of Detail的简称,意为多细节层次。LOD技术指根据物体模型的节点在显示环境中所处的位置和重要度,决定物体渲染的资源分配,降低非重要物体的面数和细节度,从而获得高效率的渲染运算。

 

CZML (JSON格式,数据与程序的分离)

http://cesium.marsgis.cn/friendlylink.html

     

 

支持的图像格式

  • WMS
  • TMS
  • WMTS(带时间动态图像)
  • ArcGIS中
  • Bing地图
  • 谷歌地球
  • Mapbox
  • 打开街道地图

请注意,不同的数据提供商有不同的归属要求 - 确保您有权使用来自特定提供商的数据,并使用credit选项相应地对来源进行归因。

 

主要步骤

添加图像

添加地形

相机控制

Cameraviewer.scene 并且控制当前可见的属性。我们可以通过直接设置其位置和方向来控制相机,或者使用Cesium Camera API来控制相机,Cesium Camera API用于指定相机的位置和方向。

一些最常用的方法是:

 

<code data-lang="javascript">// Create an initial camera view
var initialPosition = new Cesium.Cartesian3.fromDegrees(-73.998114468289017509, 40.674512895646692812, 2631.082799425431);
var initialOrientation = new Cesium.HeadingPitchRoll.fromDegrees(7.1077496389876024807, -31.987223091598949054, 0.025883251314954971306);
var homeCameraView = {
    destination : initialPosition,
    orientation : {
        heading : initialOrientation.heading,
        pitch : initialOrientation.pitch,
        roll : initialOrientation.roll
    }
};
// Set the initial view
viewer.scene.camera.setView(homeCameraView);</code>

 

取消默认航班的事件监听器,并调用flyTo()我们的新主视图

<code data-lang="javascript">// Add some camera flight animation options
homeCameraView.duration = 2.0;
homeCameraView.maximumHeight = 2000;
homeCameraView.pitchAdjustHeight = 2000;
homeCameraView.endTransform = Cesium.Matrix4.IDENTITY;
// Override the default home button
viewer.homeButton.viewModel.command.beforeExecute.addEventListener(function (e) {
    e.cancel = true;
    viewer.scene.camera.flyTo(homeCameraView);
});</code>

为了便于可视化,Cesium支持流行的矢量格式GeoJson和KML,以及我们专门为描述Cesium中称为CZML的场景而开发的开放格式。

 

Cesium Entity是一个数据对象,

 

 

CZML文件定义了一个实体(默认情况下可视化为一个点),其位置定义为不同时间点的一系列位置。

Cesium支持基于glTF(GL传输格式)加载3D模型,这是一个开放规范 的Cesium团队,与Khronos团队共同开发,通过最小化文件大小和运行时处理,有效地加载应用程序的3D模型。没有glTF型号?我们提供在线转换器, 用于将COLLADA和OBJ文件转换为glTF格式。

 

使用概念上类似于Cesium的地形和图像流的技术,3D Tiles可以查看巨大的模型,包括建筑物数据集,CAD(或BIM)模型,点云和摄影测量模型,否则将无法以交互方式查看。

以下是一些展示不同格式的3D Tiles演示:

 

 

基于Cesium开源框架的3D展示

https://blog.csdn.net/Enbir/article/details/85088647

加载底图(天地图)

飞行、复位等实用工具

三维服务器

虽然Cesium是开源的,可是目前市面上好像没有好的三维服务器,那平时开发者们在服务端是怎么跟Ceisum搭配使用呢?

模型吗?模型你直接扔到web容器就可以

http://cesiumcn.org/topic/606.html

数据的加载和显示

cesium支持topojson,GEOjson和普通的json格式,

https://blog.csdn.net/zhishiqu/article/details/78553624

 

Cesium – AJAX to update InfoBox ?

http://www.phpmind.com/blog/2016/04/cesium-ajax-to-update-infobox/

ar scene = viewer.scene;
 
var handlerA = new Cesium.ScreenSpaceEventHandler(scene.canvas);
  handlerA.setInputAction(function(click) {
    var pickedObject = scene.pick(click.position);
    if (Cesium.defined(pickedObject)) {
      $.ajax({
 
        type: 'GET',
        url: 'InfoBox.php',
        data: (pickedObject.id.id).val(),
 
        success: function(result) {
          pickedObject.id.description = "The temperatur of " + result.town + " is " + result.temp + " degrees...";
        }
      }); 
    }
  }, Cesium.ScreenSpaceEventType.LEFT_CLICK);

 

技术框架

基于Webpack的Cesium+Vue应用

https://blog.csdn.net/m0_37972557/article/details/79768408

建模模型转换3D演示效果

Cesium加载三维模型数据

https://blog.csdn.net/csdn_zhangchunfeng/article/details/79030926

 

esium通过 glTF格式支持三维模型,glTF是 WebGL, OpenGL ES, and OpenGL的实时载入模型(the runtime asset format)。Cesium包含了一些可以使用的glTF模型

https://www.jianshu.com/p/8ae3624347cb

https://www.jianshu.com/p/47cd185b58c7

Cesium中目前支持gltf和bgltf两种格式,gltf和bgltf都可以通过dae格式的三维模型转换而来,

 

 

命令工具

command line interfaces (CLIs) 

tiling raw source data into optimized 3D tilesets.

https://cesium.com/docs/on-premise/
支持不同的三维文件形式

 Extract the contents of Cesium-ion-3D-Tiling-Pipeline.zip.

Cesium-ion-3D-Tiling-Pipeline 是 收费产品

 

 

【未用过】osgb转3dtiles工具(cesium平台,无限制,支持超10GB大数据)
https://download.csdn.net/download/muyao520/10714815

资料

webgl开源三维引擎的选择

https://blog.csdn.net/lh1162810317/article/details/50827948

 

http://www.cnblogs.com/miaosen/p/8390945.html

webgl发展的很快,可谓日新月异,所以下面的这些引擎过一个月

webgl发展很快,所以有些暂时不够友好的,相信在大家的努力下很快会变的很好用。

 

Cesium基础使用介绍

http://www.cnblogs.com/miaosen/p/8390945.html

Cesium三维数据可视化框架以及其简单的使用,

 

数据可视化系列之十五]把实时视频贴到cesium上

https://www.jianshu.com/p/d6c11c50f89c

cesium 中文网

http://cesium.xin/wordpress/

 

WebGL 3D 工业隧道监控实战

https://blog.csdn.net/xhload3d/article/details/79692899

 

 

ThreeJS 在 Cesium 上的应用

https://github.com/AnalyticalGraphicsInc/cesium-threejs-experiment

 

回头看一看我的2018年

https://www.cnblogs.com/giserhome/p/10201065.html

ArchGis

为用户提供一个可伸缩的,全面的GIS平台

Esri公司

加轻松地部署自己的Web GIS应用,大大简化地理信息探索、访问、分享和协作的过程,感受新一代Web GIS所带来的高效与便捷。

ArchGis 百科

https://baike.baidu.com/item/ArcGIS/8738161?fr=aladdin

 

三维效果展示

态势系统案例

http://igame.ga/web3dgis/

 

湖南联智桥隧技术有限公司 

http://bd.bds35.cn/login

http://bd.bds35.cn    zhangtingwei  123456

 

热力图

热力图参考

http://cesium.marsgis.cn/cesium-example/editor.html#51_heatmap

 

三维的成长路线

https://www.cnblogs.com/giserhome/p/6225917.html

通于arcgis api for js 的通用功能等等,比如:兴趣点搜索、地址搜索、空间范围查询、缓冲分析、叠加分析、地图标绘(绘制信息报错在数据库,可以在线修改标绘的样式颜色)、标绘下载(下载格式为shp图层)、图层控制、地图统计地块信息、路径分析、地图分屏、叠加shp图层文件、量算工具、打印地图、专题图制作

三维文件格式

COLLADA 是面向交互式 3D 应用程序
OBJ文件 是一套基于工作站的3D建模和动画软件,Maya读写
DAE(Digital Asset Exchange)文件格式是3D交互文件格式,DAE是一种3D模型,可被flash 导入。3Dmax与maya需要安装dae输出插件

Cesium 可以做:
将COLLADA和OBJ文件转换为glTF格式

三维文件格式知多少 | abc、glTF、fbx、obj、dae、stl、3ds...
http://www.bgteach.com/article/132


glTF是一种可以减少3D格式中与渲染无关的冗余数据并且在更加适合OpenGL簇加载的一种3D文件格式 - 支持动画等!.gITF 2.0 格式逐步的完成了 WebGL 的布局,也成为了这个领域的专用格式
glTF 就是三维文件的 JPEG ,三维格式的 MP3
glTF使用json格式进行描述,也可以编译成二进制的内容:bglTF


FBX 是 FilmBoX 这套软件所使用的格式,后改称 Motionbuilder.FBX最大的用途是用在诸如在 Max、Maya、Softimage 等软件间进行模型、材质、动作和摄影机信息的互导,这样就可以发挥 Max 和 Maya 等软件的优势
. fbx 格式,Autodesk 家族格式 - 支持动画!这是一个商业的格式,兼容最好的当属 Autodesk 家族的软件了。fbx 也开放给了第三方软件,但总是感觉除了他自己的软件之外或多或少的都有解决不完的问题。


BVH 是BioVision等设备对人体运动进行捕获后产生文件格式的文件扩展名。BVH文件包含角色的骨骼和肢体关节旋转数据。BVH 是一种通用的人体特征动画文件格式,,广泛地被当今流行的各种动画制作软件支持。
. bvh 格式, 动作捕捉通用格式 - 骨骼动画数据!捕捉后的文件可以重复利用,应用在不同的角色骨骼驱动上制作动画。

OBJ文件是Alias|Wavefront公司为它的一套基于工作站的3D建模和动画软件"Advanced Visualizer"开发的一种标准3D模型文件格式
.obj 格式, 静态多边形模型 - 附带 UV 信息及材质路径!不包含动画、材质特性、贴图路径、动力学、粒子等信息。主要支持多边形(Polygons)模型。是最受欢迎的格式。

.dae 格式, FBX 的代替品 - Collada DAE需要自行下载安装!


STL 文件是在计算机图形应用系统中,用于表示三角形网格的一种文件格式。 STL是最多快速原型系统所应用的标准文件类型。


3DS 文件越来越不受欢迎了。比较早的一种三维格式,三角面,最早游戏模型应用比较广泛。 3ds 格式 - 三角面静态模型!文件格式简单


DXF 是一种开放的矢量数据格式,可以分为两类:ASCII格式和二进制格式;ASCII具有可读性好的特点,但占用的空间较大;二进制格式则占用的空间小、读取速度快。
.dxf 格式 - Drawing Exchange File - CAD 通用格式!一般都是CAD 矢量数据的交互格式。

 

osgb 倾斜摄影测量三维模型

表达巨量三维模型的文件夹,据估计应该是伟景行软件出的数据,其中有三种文件类型(.xml , .osgb , .dds)和一个投影文件,其中osgb是一种倾斜摄影测量三维模型文件格式,dds文件是三维模型的纹理,而xml文件组织这些模型、纹理和参数的文件。

 

GML 地理标记语言(Geography Markup Language,GML) 是专门用于表示空间和属性数据的标记语言规范,是XML在地理空间信息领域的重要应用,由OGC 于1999 年提出。

 

LAZ

文件扩展名 LAZ 有 二 种文件类型,并且与 二 种不同的软件程序相关联,但主要相关联软件程序是由 Global Heavy Industries开发的 Liquid Studio。

 

参考软件

Geomodeller

 

三维使用工具

LocalSpaceViewer

http://www.locaspace.cn/

 

hightopo图扑

https://www.hightopo.com/demos/index.html

 

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>

官网

https://cesium.com

目前的理解:

建模等资料需要上传到 他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

 

交流前准备的问题
  1. 硬件采集回来的模型有哪些? 3D 模型如何编辑?
  2. 如何把采集的模型转换成三维图形?
  3. 量测,通视分析,日照分析,淹没分析,剖面分析 如何做?
  4. 有哪些做的框架,类似 MarsGIS, ThingJS 这些框架,有没有推荐使用的?
  5. 有哪些做三维的框架?
  6. 没有地理信息人员如何做?
  7. 大神的微信(小解)
  8. 之前做项目周期,经验有哪些?
  9. gis服务器用的什么?
  10. 需要Gis工程师吗?
  11. Cesium 地形图文件?
  12. 整理的资料
  13. 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数据读取的问题

http://liubf.com/2018/10/23/%E8%A7%A3%E5%86%B3cesium1-50%E5%AF%B9gltf2-0-3dtiles%E6%95%B0%E6%8D%AE%E8%AF%BB%E5%8F%96%E7%9A%84%E9%97%AE%E9%A2%98/

 

 

 

 

大量模型肯定是3dtiles啊 如果是个小体量的可以考虑gltf啊。各人感觉gltf数据集比3dtiles 好操控

max格式模型 -> obj格式 -> 3DTiles格式

现在的问题是我的3DTiles数据只有一个级别的瓦片,如何制作多级别的瓦片数据呢

 

提供程序请求切片

需要流式传输到客户端。Cesium支持使用图像提供程序请求切片的几种标准。大多数图像提供程序使用HTTP上的REST接口来请求切片

 

地图服务器 GeoServer 搭建

http://geoserver.org/

 

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

  1. 在项目根目录创建 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

posted @   lvye1221  阅读(1032)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· DeepSeek “源神”启动!「GitHub 热点速览」
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· C# 集成 DeepSeek 模型实现 AI 私有化(本地部署与 API 调用教程)
· DeepSeek R1 简明指南:架构、训练、本地部署及硬件要求
· 2 本地部署DeepSeek模型构建本地知识库+联网搜索详细步骤
点击右上角即可分享
微信分享提示