Cesium：显示一个3D地球-CSDN博客

本文链接：https://blog.csdn.net/KaiSarH/article/details/103215774

本文介绍CesiumJS，一款基于JavaScript的3D地图框架，用于创建虚拟场景和地图动态数据可视化。通过简单的代码示例展示了如何使用CesiumJS在网页上展示3D地球效果，包括获取和使用Token的过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

项目又要用到新东西 : 在3D地球上展示地图数据

百度了一下,需要 :

Cesium是一款开源的基于JavaScript的3D地图框架。其实他就是一个地图可视化框架
CesiumJS 是一款用于创建虚拟场景的3D地理信息平台。目标是用于创建以基于Web的地图动态数据可视化。目前尽力提升平台的性能、准确率、虚拟化能力、易用性以及平台的各种支持。

最直观的例子:

在这里插入图片描述

代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.63.1/Build/Cesium/Cesium.js"></script>
    <link href="https://cesium.com/downloads/cesiumjs/releases/1.63.1/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
<div id="cesiumContainer" style="width: 100%; height:100%"></div>
<script>
    Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIzMDkwNjI3Yy1kM2FmLTQwOWMtYWJjMy1lZjE5Zjg1OGRlN2EiLCJpZCI6MTg3asdfcyI6WyJhc3IiLsdfjE1NzQzMjg5ODV9.64ULptSE5yqCWMIyw4j58gRCTWL2xgso6WPFb0Y_x40';
    var viewer = new Cesium.Viewer('cesiumContainer');
</script>
</body>
</html>