Cesium基础知识一

标签： Cesium 分类： Gis 创建时间：2019-09-29 06:28:11 更新时间：2025-01-17 10:39:22

最近在研究三维这一块的东西，发现了不少好的网站朱家林数字孪生平台，感觉这个还是挺好的。

参考文章:
1.让GIS三维可视化变得简单-初识Cesium 作者用心写的教程，比我写的教程强多了，我都是遇到问题，找问题，解决问题，然后随便找一篇文章，堆砌一下，充其量顶多算是读书笔记，有时候连读书笔记都不算，只能是读书摘要。
2.地图图层接入：从mapbox转向cesium cesium加载高德底图、cesium加载mapbox底图、cesium加载倾斜摄影(S3MTilesLayer)；mapbox-gl + deck.gl + loader.gl加载3D Tiles。这里还有：cesium加载mapbox底图，cesium加载倾斜摄影(S3MTilesLayer)，cesium加载高德底图
3.教程 - 深度探讨在 Vue3 中引入 CesiumJS 的最佳方式 CesiumJS 的库构成、选择 Vite3 和 pnpm 的理由、使用 External 模式引入静态库 - 不打包静态库。
4.Cesium深入浅出之图层管理器关键是要先找到不同类型数据的载体，我总结了下在Cesium中大概分为四类数据：图元数据（Primitive）、实体数据（Entity）、影像数据（Imagery）、地形数据（Terrain），因为这四类数据的形式是截然不同的，它们分别处于四个不同的数据载体中，所以我们在图层管理器中也是划分了对应的四个分组，接下来就是针对不同的数据载体进行不同的操作了。
5.Cesium入门-3-官方完整实例

前言

Cesium是一个开源的三维地图引擎，和ArcGIS Api的三维有什么样的优势，除了免费开源，还有没有其他的呢？有待于深究。

参考文章：
1.Cesium 中文教程
2.Cesium系列目录
3.Cesium基础使用介绍
4.Cesium与游戏引擎 (这里是一篇比较Cesium与游戏引擎不同的文章，也是一篇发表不同观点的文章)
5.Cesium开发实战 (一个系列教程，应该没写完)

1.关闭不常用插件

默认的Cesium通常包含了很多么有用的插件，在使用new Cesium()创建时已经包含，我第一反应就是要关闭这些没有用的东西。

var viewer = new Cesium.Viewer('cesiumContainer',{
    geocoder:false, //一种地理位置搜索工具，用于显示相机访问的地理位置。默认使用微软的Bing地图
    homeButton:false, //首页位置，点击之后将视图跳转到默认视角。
    sceneModePicker:false, // 切换2D、3D 和 Columbus View (CV) 模式。
    baseLayerPicker:false, //选择三维数字地球的底图（imagery and terrain）。
    navigationHelpButton:false, // 帮助提示，如何操作数字地球。
    animation:false, //控制视窗动画的播放速度。
    // creditContainer:"credit", // 展示商标版权和数据源。
    timeline:false, //展示当前时间和允许用户在进度条上拖动到任何一个指定的时间。
    fullscreenButton:false, //视察全屏按钮。
    vrButton:false, //A single button widget for toggling vr mode.
});

2.关闭版权信息

通过构造函数没有办法将版权信息关闭，但是我们可以曲线救国，通过css将版权信息隐藏掉，界面上不就看不见了吗(在非法的边缘疯狂试探))。

1 2	//去掉版权信息 viewer._cesiumWidget._creditContainer.style.display="none";

3.添加geojson数据

加载KML，和其他的Geojson数据，其实也简单的，通过不同的dataSource的load方法请求数据，请求数据成功之后就挂载到viewer的dataSources上即可。

//加载管线数据
var geojsonOptions = {
    clampToGround : true
};
// Load neighborhood boundaries from KML file
var pipelinePromise = Cesium.GeoJsonDataSource.load('http://localhost:8068/api/pipeline', geojsonOptions);

// Save an new entity collection of neighborhood data
pipelinePromise.then(function(dataSource) {
    console.log(dataSource);
    // Add the new data as entities to the viewer
    viewer.dataSources.add(dataSource);
});

加载数据其实挺简单的，问题是如何生成这些数据，特别是3d tiles数据，以及将shp文件转成3d模型，这个问题还是需要解决的。

参考文章：
1.Cesium入门9 - Loading and Styling Entities
2.Collada 快速入门 (这里主要讲解了骨骼动画的存储格式)

4.坐标系

参考文章：
1.Cesium中的几种坐标和相互转换

5.加载底图

const viewer = new Cesium.Viewer('cesiumContainer',{
    /** 省略了 属性设置 */
    imageryProvider:new Cesium.UrlTemplateImageryProvider({
        // 暗黑底图
        url: "https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png ",
        // 日常底图
        // url:"https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png",
        subdomains: ["a", "b", "c", "d"],

    }) 从抄抄写写自行车vZ现场v帮你们宣传v不能买
});

参考文章:
1.在CesiumJS中使用CartoDB底图
2.Cesium加载OpenStreetMap 加载了多种底图
3.Display a map maptalks中加载了白天的底图

5.geojson贴地

let gjson = require("@/assets/lj.json");
Cesium.Math.setRandomNumberSeed(0); //设置随机数种子
let promise = Cesium.GeoJsonDataSource.load(gjson, {
    clampToGround: true
}); //geojson面数据

参考文章:
1.cesium 加载模型后高或低偏离出地面了；已解决
2.Cesium加载Geojson并设置贴地

往期推荐

文章目录

微信公众号

广告位

诚心邀请广大金主爸爸洽谈合作

每日一省

isNaN 和 Number.isNaN 函数的区别？

1.函数 isNaN 接收参数后，会尝试将这个参数转换为数值，任何不能被转换为数值的的值都会返回 true，因此非数字值传入也会返回 true ，会影响 NaN 的判断。

2.函数 Number.isNaN 会首先判断传入参数是否为数字，如果是数字再继续判断是否为 NaN ，不会进行数据类型的转换，这种方法对于 NaN 的判断更为准确。

每日二省

为什么0.1+0.2 ! == 0.3，如何让其相等?

一个直接的解决方法就是设置一个误差范围，通常称为“机器精度”。对JavaScript来说，这个值通常为2-52，在ES6中，提供了Number.EPSILON属性，而它的值就是2-52，只要判断0.1+0.2-0.3是否小于Number.EPSILON，如果小于，就可以判断为0.1+0.2 ===0.3。

每日三省

== 操作符的强制类型转换规则？

1.首先会判断两者类型是否**相同，**相同的话就比较两者的大小。

2.类型不相同的话，就会进行类型转换。

3.会先判断是否在对比 null 和 undefined，是的话就会返回 true。

4.判断两者类型是否为 string 和 number，是的话就会将字符串转换为 number。

5.判断其中一方是否为 boolean，是的话就会把 boolean 转为 number 再进行判断。

6.判断其中一方是否为 object 且另一方为 string、number 或者 symbol，是的话就会把 object 转为原始类型再进行判断。

每日英语

Happiness is time precipitation, smile is the lonely sad.

幸福是年华的沉淀，微笑是寂寞的悲伤。