第二篇 Cesium从零开始

最新推荐文章于 2025-11-11 17:04:29 发布

原创最新推荐文章于 2025-11-11 17:04:29 发布 · 4.2k 阅读

9 ·

CC 4.0 BY-SA版权

文章标签：

#程序人生 #数据分析

GISer 同时被 2 个专栏收录

3 篇文章

订阅专栏

可视化

3 篇文章

订阅专栏

本文介绍了如何为Cesium项目做准备，包括前端知识、下载源码、配置web服务器，并详细步骤演示如何启动服务器和处理Token问题。适合初学者快速入门Cesium视频投影应用。

文章目录

前言

本想着今天来写写量测功能，视频投影类的，因为最近正好在搞一个项目，包含此类功能，但想着还是先入门吧，毕竟很多人不是一开始就会入门，入门后就不一定会按照由易到难的步骤了；

提示：以下是本篇文章正文内容，下面案例可供参考

一、准备工作

1、知识储备

（1）、懂前端，会JavaScript，会部署简单的网站，假设这些我认为你都具备哈；

（2）、下载Cesium源码，使用vscode打开，入门呢可以直接下载编译好的版本：下载，也可以下载源码：下载；（源码结构后面讲）

（3）、下载完后，放入你的web服务器目录下，目录如下：

二、使用步骤

1.启动web服务器

在浏览器中输入网址：http://localhost/Cesium/Apps/HelloWorld.html

HelloWord.html代码如下：

<!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;
      }
    </style>
  </head>
  <body>
    <div id="cesiumContainer"></div>
    <script>
      var viewer = new Cesium.Viewer("cesiumContainer");
    </script>
  </body>
</html>

如果就上面的代码，你很有可能会遇到下面的问题：

这说明Token过期了，或无效了，你需要更换Token：

Cesium.Ion.defaultAccessToken = '你的token';
var viewer = new Cesium.Viewer("cesiumContainer");

至于token怎么获取：上：https://cesium.com/ion/这个网址；

还有个办法就是彻底去掉token

找到 Build/CesiumUnminified 目录，打开 Cesium.js 文件，搜索 Ion.getDefaultTokenCredit，修改输出出来的总文件也可以，修改如下：

Ion.getDefaultTokenCredit = function (providedKey) { return undefined; };

当然也可以修改源码，重新编译打包，后续介绍到编译源码的时候在介绍；

还是比较简单的，相信初学者也很容易上手，况且Cesium学习资源很多，慢慢来，不要想着一口气吃撑胖子；

总结

前期可能是很初级的内容，有什么问题可以留言，写的不好的也可以说，工作之余写写，就当回忆吧。

下一篇：Cesium源码结构及说明；

第二篇 Cesium从零开始

文章目录

前言

一、准备工作

二、使用步骤

1.启动web服务器

总结

4 条评论