- 综合排序
- 最热优先
- 最新优先
- 来自专栏烤包子
【Cesium】Cesium坐标转换
Cesium中用Cartesian3变量表示，笛卡尔空间直角坐标系，用new Cesium.Cartesian3(x, y, z)创建。 坐标的定义： 1：Cartesian2-----new Cesium.Cartesian2(x, y) 2：Cartesian3---- new Cesium.Cartesian3(x, y, z） 3 cesium.js为我们提供了很有用的变换工具类， Cesium.Cartesian3（相当于Point3D）Cesium.Matrix3（3x3矩阵，用于描述旋转变换）Cesium.Matrix4（ var rotate = Cesium.Math.toRadians(angle);//转成弧度 var quat = Cesium.Quaternion.fromAxisAngle(Cesium.Cartesian3 Cesium.Cartesian3.ZERO var m = Cesium.Matrix4.fromRotationTranslation(rot_mat3, Cesium.Cartesian3.ZERO
3.9K40发布于 2021-11-10 - 来自专栏前端漫步
Cesium入门之一：Cesium本地运行
Cesium简介 Cesium是一个开源的、面向三维地球和地图的JavaScript库，它是基于Apache2.0许可的开源程序，可以免费的用于商业用途； Cesium下载 Cesium的官网地址是：https ://cesium.com/platform/cesiumjs/，由于Cesium的服务器在国外，我们访问会比较慢，所以，我们可以将Cesium下载到本地，在本机上运行，后面查看Cesium的帮助文档和示例程序就比较方便了 打开官网地址，在Platform菜单下找到Downloads，打开下载页面 当前Cesium的最新版本是1.105.1，在下载页面点击DOWNLOAD CESIUMJS 1.105.1，将Cesium 下载到本地 Cesium目录结构 下载后的Cesium是一个压缩文件，解压该压缩文件，通过VSCode打开该文件夹，其目录结构如下： 本地运行Cesium 我们可以将Cesium发布到本机服务器 一个是Documentation：这个是Cesium的API文档，可以在开发的过程中查看开发文档，帮助我们更好的了解API 另外一个是Sandcastle,Cesium为我们提供了一个沙盒测试环境，通过
5.8K31编辑于 2023-10-14 - 来自专栏前端漫步
Cesium入门之八：Cesium加载矢量数据
二、Cesium支持的矢量数据格式 KML (Keyhole Markup Language) CZML (Cesium Language) GeoJSON KML格式 KML(Keyhole Markup Cesium中，可以通过调用Cesium.KmlDataSource()实例来加载KML文件，并将其添加到图层中。 在Cesium中，可以使用Cesium.CzmlDataSource()实例加载和解析CZML数据源。 在Cesium中，使用Cesium.GeoJsonDataSource.load()方法可以将本地的GeoJSON文件加载到图层中。 /public/china.json') viewer.dataSources.add(geoJson) 三、Cesium加载GeoJSON数据格式的中国地图示例 Cesium加载GeoJSON数据非常简单
6.8K42编辑于 2023-10-14 - 来自专栏前端博客
Cesium笔记(1)：在项目中使用Cesium—Vue整合Cesium
项目中引入Cesium，普通项目，按照官方文档照做就可https://cesium.com/docs/tutorials/getting-started/常规引入很多人说需要require.js,我是没有使用 ，/Cesium-1.40/Build/CesiumUnminified/Cesium.js/Cesium-1.40/Build/CesiumUnminified/Widgets/widgets.css 当然，也可以手工导入 improt 导入，这个不需要修改webpack 配置整合入webpack首先npm i cesium，如果按照不成功(再次fuck GFW)，直接下载cesium包（https: / cesium--配置------------------------------------ sourcePrefix: ' ' }, // cesium--配置------------- Cesium》,请注明出处：https://www.zhoulujun.cn/html/GIS/cesium/8321.html
2.3K20编辑于 2023-05-14 - 来自专栏前端漫步
Cesium入门之九：Cesium加载gltf文件
Cesium中的模型坐标系 在Cesium中，为了确保各种数据都可以在三维场景中正确地显示和交互，定义了一个特定的模型坐标系，即ENU坐标系，其中ENU代表东北上。 要将模型从外部坐标系转换到ENU坐标系，我们需要使用Cesium的坐标转换功能。Cesium提供了许多函数和对象，用于将3D模型从外部坐标系转换到ENU坐标系。 相关类介绍 Cesium.Cartesian3(x, y, z)类 Cesium.Cartesian3是Cesium库中用于表示三维世界空间中笛卡尔坐标的类。 （均为0度）的Cesium.HeadingPitchRoll对象： var hpr = new Cesium.HeadingPitchRoll(); 常用转换函数 Cesium.Transforms.eastNorthUpToFixedFrame 例如： var enuPoint = new Cesium.Cartesian3(10, 10, 0); var fixedFramePoint = new Cesium.Cartesian3(); Cesium.Matrix4
5.1K31编辑于 2023-10-14 【Cesium】七、设置Cesium 加载时的初始视角
一、前言 在前面的文章 【Cesium】三、实现开场动画效果 中有提到过 虽然也能回到初始点位但是有一个明显的动画过程。下面方法加载时就是在初始点位 没有动画效果，根据需求选择。 本文参考文章： Cesium：设置加载时的初始视角 cesium设置相机的初始位置 二、实现方法 2.1 获取点位、视角 运行项目 调整好视角 打开控制台，分别输入下： viewer.camera.position = viewer; 2.2 设置 在2.1 中获取到了点位等信息，然后利用viewer.camera.setView 进行设置 第一种： viewer.camera.setView({ // Cesium 的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州 // fromDegrees()方法，将经纬度和高程转换为世界坐标 destination: Cesium.Cartesian3 from "cesium"; const initFn = async () => { const viewer = new Cesium.Viewer("cesiumContainer", {
20210编辑于 2025-12-15- 来自专栏前端漫步
Cesium入门之五：认识Cesium中的Viewer
构造函数 new Cesium.Viewer(container, options)：是用来创建一个新的 Cesium 视图器（Viewer）实例的构造函数。 下面代码在名为“cesiumContainer”的HTML元素中创建一个新的Cesium Viewer const viewer = new Cesium.Viewer('cesiumContainer terrainProvider: 地形提供者，可以是Cesium.CesiumTerrainProvider、Cesium.GoogleEarthEnterpriseTerrainProvider等类型 skyBox: 天空盒样式，可以是Cesium.SkyBox或者Cesium.Color类型。 skyAtmosphere: 大气层设置，可用于控制大气层渲染效果。 sceneMode: 场景模式，有Cesium.SceneMode.SCENE3D、Cesium.SceneMode.COLUMBUS_VIEW、Cesium.SceneMode.SCENE2D三种，默认为
4.2K62编辑于 2023-10-14 - 来自专栏前端漫步
Cesium入门之十一：认识Cesium中的Entity
Entity在Cesium中的作用 Entity是Cesium中非常重要的类，它为我们提供了一种灵活、强大的方式来描述、呈现和操控地球上的实体对象。 material：设置线的材质，可以使用Cesium.Material提供的材质类型，如Cesium.ColorMaterialProperty、Cesium.ImageMaterialProperty ({ color: Cesium.Color.GREEN, outlineWidth: 1, outlineColor: Cesium.Color.BLACK }) } }) 面（Polygon）的外观样式 material：设置面的材质，可以使用Cesium.Material提供的材质类型，如Cesium.ColorMaterialProperty、Cesium.ImageMaterialProperty extrudedHeight: 0, material: Cesium.Color.GREEN.withAlpha(0.5) } }) Cesium中的Entity类提供了在地球空间上创建
2.8K40编辑于 2023-10-14 - 来自专栏前端博客
Cesium笔记(0)：Cesium简介及学习资料搜集
Cesium起步Cesium官方起点：https://cesium.com/docs/tutorials/getting-started/ 把里面大致看一下，然后撸代码学习Cesium官方代码实例：https ({evenColor : Cesium.Color.WHITE, oddColor : Cesium.Color.BLACK, repeat : new Cesium.Cartesian2(4, 4) 学习路线API学习路线图，按下图顺序学习相关类Cesium进阶之路 （3大方向）Web前端方向：Cesium与webpack （裁剪以及压缩），Cesium 与vue （框架设计， 嵌入复杂业务系统）， Cesium的UI （UI 设计，定制可复用的Cesium交互界面）图形学方向：WebGL深入，基于Cesium 的可视化定制（视阈、水淹、水面、热力图，流场图、飞线图、扫描图）数据预处理方向：投影变换 笔记(0)：Cesium简介及学习资料搜集》,请注明出处：https://www.zhoulujun.cn/html/GIS/cesium/5668.html
1.9K20编辑于 2023-05-14 - 来自专栏前端漫步
Cesium入门之七：Cesium加载地形数据
Cesium加载地形数据 一、什么是地形数据 地形数据是描述地球表面和地形高度的数字模型或图像。 二、TerrainProvider类 TerrainProvider类是Cesium中用于加载地形数据的基本类。 CesiumTerrainProvider是Cesium默认的地形提供者。 CustomHeightmapTerrainProvider：Cesium中用于自定义高程数据的地形提供器，它允许开发人员使用程序生成或者从其他来源导入高程数据来创建自定义的地形。 OK，关于Cesium加载地形数据的内容，就介绍到这里了。
10.3K21编辑于 2023-10-14 - 来自专栏前端文章小tips
Cesium 组件重写
时，相机不是定位到Cesium自带的默认位置，而是定位到我们想要的位置。 1）修改相机的默认矩形范围 Cesium.Camera.DEFAULT_VIEW_RECTANGLE = Cesium.Rectangle.fromDegrees( 110.15, 通过查看 Cesium 源码（Source/Widgets/Geocoder/GeocoderViewModel.js 第73行），我们发现Cesium 默认采用的是 Bing 地图服务来实现地理编码的功能 那么我们就可以通过覆写 geocoder 方法的方式来实现自定义的地理编码服务，下面我们重写geocode方法，将 Cesium 默认的 Bing 地图服务改为OSM地图服务。 ", }); var arcgisVM = new Cesium.ProviderViewModel({ name: "ArcGIS地形", iconUrl: Cesium.buildModuleUrl
1.5K30发布于 2021-11-23 - 来自专栏前端漫步
Cesium入门之十：Cesium加载3DTiles数据
Cesium中与3DTiles相关的类 1.Cesium3DTileset类 Cesium3DTileset类是3DTiles数据的主要管理类，负责加载和渲染Tileset。 2.Cesium3DTileStyle类 Cesium3DTileStyle是用于指定和应用3D瓦片集的样式的类；它可以控制3D瓦片的颜色、点大小、标签风格和文本内容等；它可以对3D瓦片进行分类和着色， 3.Cesium3DTileContent类 Cesium3DTileContent是用于表示单个3D瓦片的内容和几何信息的类。 Cesium3DTileFeature类 Cesium3DTileFeature类用于表示3D瓦片中的单个要素（feature）及其相关属性。 Cesium中加载3DTiles数据的示例 try { const tileset = await Cesium.Cesium3DTileset.fromIonAssetId(75343);
8.3K10编辑于 2023-10-14 - 来自专栏点滴积累
Cesium基础使用介绍
前言 最近折腾了一下三维地球，本文简单为大家介绍一款开源的三维地球软件——Cesium，以及如何快速上手Cesium。 一、 Cesium简介 Github地址：https://github.com/AnalyticalGraphicsInc/cesium。 安装完之后，新建html页面并引用Cesium.js，如下： <! ({ url: 'data/Cesium_Ground.gltf', //以下这些信息也均可在entity中设置 color : Cesium.Color.fromAlpha(Cesium.Color.RED 2.6.3 CZML CZML是Cesium中很重要的一个概念，也是一个亮点，CZML使得cesium很酷很炫地展示动态数据成为可能。
8.3K71发布于 2018-04-28 - 来自专栏JSAPIThree
JSAPIThree 加载 Cesium 数据学习笔记：使用 Cesium 地形和影像服务
作为一个刚开始学习 mapvthree 的小白，今天要学习加载 Cesium 数据了！听说这个功能可以加载真实的地形数据，还能使用 Cesium 的影像服务！想想就期待！ 第一次听说 Cesium 数据加载今天在文档里看到了"Cesium"这个词。 文档说 Cesium 数据加载可以：加载真实的地形数据使用 Cesium 的影像服务支持 Cesium Ion 服务需要配置 AccessToken我的理解：简单说就是"用 Cesium 的地形和影像服务 第一步：配置 Cesium Ion AccessToken作为一个初学者，我习惯先看看需要什么配置。文档说使用 Cesium 服务需要配置 Cesium Ion AccessToken！ 第二步：加载 Cesium 地形看到需要配置 AccessToken 后，我想：怎么加载地形？文档说可以用 CesiumTerrainTileProvider 来加载 Cesium 地形！
15310编辑于 2025-12-04 【Cesium】八、Cesium 默认地图不显示，不加载默认Bing地图
前言 Cesium 默认加载的地图是bing地图，个人认为请求bing地图会收到网络限制，导致地图资源下载很慢，所以设置默认不加载bing地图（后续我使用的是天地图） 参考文章： cesium 不加载默认的底图 默认地图 Bing地图 cesium将默认底图设置为不显示 实现方法 怎么做才能不加载默认地图 第一种： viewer.imageryLayers.get(0).show = false; 第二种： from "cesium"; const initFn = async () => { const viewer = new Cesium.Viewer("cesiumContainer", { false, }); viewer.imageryLayers.addImageryProvider(tdtAnnotionLayer); }; onMounted(() => { // Cesium width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden; } </style> 后面我还会更新更多关于cesium
19410编辑于 2025-12-15【Cesium】二、vite+vue3+cesium 使用，项目中使用cesium 地图，具体步骤。快速搭建Cesium三维地图应用项目
vite-commit：点击跳转GitHub 二、安装 下载依赖 yarn add cesium vite-plugin-cesium vite -D 或者用npm npm i cesium vite-plugin-cesium vite -D 修改vite.config.js 引入：import cesium from 'vite-plugin-cesium' 并在plugins中添加。 from "cesium"; onMounted(() => { const viewer =new Cesium.Viewer("cesiumContainer") }) </script> 五、消除控件 可以看到初始界面有许多控件，下面我们来隐藏这些控件： 参考文章： 使用Vite快速搭建Cesium三维地图应用项目 cesium(一)vite环境搭建 Cesium在vue3中的安装 from "cesium"; const initalize = async () => { const viewer = new Cesium.Viewer("cesiumContainer"
33311编辑于 2025-12-15- 来自专栏点滴积累
Cesium几个案例介绍
前言 本文为大家介绍几个Cesium的Demo，通过这几个Demo能够对如何使用Cesium有进一步的了解，并能充分理解Cesium的强大之处和新功能。 其他的无需多言，如果还不太了解什么是Cesium，可以参见我的另外两篇关于Cesium的博客，下面直接进入正题。 二、 根据地形瓦片直接绘制高程、坡度及等高线 这是Cesium 1.4.0版新添加的功能，所以一定要更新到此版本。只需要正确加载地形瓦片，Cesium可以自动算出高程设色瓦片、坡度设色瓦片以及等高线。 Cesium根据此uniform生成相应类型的等高线。 理解了这一点，高程设色和坡度设色也就明白了。 ; }, Cesium.ScreenSpaceEventType.PINCH_END); 四、 改造geocoder控件 Cesium自带了geocoder控件，可以检索并定位到某个地址，原理很简单，就是后台解析此地址
13.6K50发布于 2018-04-28 - 来自专栏计算机图形学 前端可视化 WebGL
Cesium for Unreal加载倾斜摄影
本文介绍UE4中通过Cesium插架加载本地倾斜摄影模型。Cesium for Unreal插件运行在UE环境何总运行Cesium，这样方便做一个GIS应用。 安装Cesium for Unreal插件 在UE 虚幻商城中，搜索 “Cesium for Unreal”， 然后下载插件，下载完成后，可以点击安装到引擎： 可以安装到引擎，需要UE 4.26以上， 启用之后可能需要重启 添加Cesium SunSky Cesium SunSky扩展了UE本身的SunSky，针对Cesium场景做了优化。 有关细节此处不详细说明。 来源可以是Cesium ion，也可以From Url。 如果需要使用Cesium ion的线上数据，可以登录Cesium ion账户。 通过点击【Add】按钮，弹出【Cesium ion Assets】选项卡，内部列表数据与线上Cesium ion账户内【My Assets】选项卡中的数据一样。
3.1K30编辑于 2023-01-08 - 来自专栏烤包子
【Cesium】修改操作惯性值
ScreenSpaceCameraController API:https://cesium.com/docs/cesiumjs-ref-doc/ScreenSpaceCameraController.html
1.7K20发布于 2021-11-10 - 来自专栏LET
Cesium与游戏引擎
今天看了《百度终于也入了Cesium的坑》这篇文章，里面有关Cesium的评价，让我的阅读体验极度不悦，比如“但是无论从整个产品的成熟度以及可视化效果上来说，Cesium现阶段已经不能算是第一梯队的选择了 ，“整体上来说游戏引擎的效果和整个技术生态基本上可以吊打现在的Cesium，就是对于GISer来说上手门槛有点高。”，“所以现阶段，无论从哪个角度来看Cesium都不是一个值得长期投入的技术路线”。 从这段描述可见，Cesium技术上以JS为主（Web方向），产品定位是世界级的三维地球和地图，重点是性能，精度，视觉效果以及易用性。用户通过Cesium来展示（动态）空间地理数据（应用场景）。 相比可视化和游戏引擎，Cesium是对地球和世界的仿真。 其次，说一下Cesium在渲染上的短板，为什么大家觉得Cesium渲染效果差。一个场景的渲染效果，主要取决于两点：材质和光（影）。
5.3K92发布于 2020-09-14
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号