cesium开始——Hello World_cesium.js放在head中还是放在body中-CSDN博客

本文链接：https://blog.csdn.net/wgf1997/article/details/103021784

首先进入cesium的官网：https://cesium.com/cesiumjs/ 进行下载压缩包

下载完成后，解压放在项目文件夹中即可。

注册并登录官方网站，在Access Tokens获取Cesium账号令牌

在html的head中引入Cesium的js文件和css文件

// 具体路径自行配置
<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">

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <script src="/js/Cesium-1.63.1/Build/Cesium/Cesium.js"></script>
  <link rel="stylesheet" href="/js/Cesium-1.63.1/Build/Cesium/Widgets/widgets.css">
  <title>第一个应用</title>
</head>
<body>
  <div id="cesiumContains" style="width:700px;height:700px">
  
  </div>

  <script>
    // 提供Cesium账号令牌
    Cesium.Ion.defaultAccessToken = ' Cesium账号令牌... ';
    
    // 创建顶级Cesium小部件
    // var viewer = new Cesium.Viewer('cesiumContains');

    // Adding Cesium World Terrain
    var viewer = new Cesium.Viewer('cesiumContains', {
      terrainProvider: Cesium.createWorldTerrain()
    });

    // 添加自己的数据 -- 拖放AGI_HQ.kmz
    var tileset = viewer.scene.primitives.add(
        new Cesium.Cesium3DTileset({
            url: Cesium.IonResource.fromAssetId(53969)
        })
    );

    // 将应用程序的默认视图设置为图块
    viewer.zoomTo(tileset)
  </script>
</body>
</html>