cesium入门，源码编译与第一个界面搭建

最新推荐文章于 2023-10-07 22:15:35 发布

问也去

最新推荐文章于 2023-10-07 22:15:35 发布

阅读量440

点赞数 2

分类专栏： cesium 文章标签： 1024程序员节

本文链接：https://blog.csdn.net/wenyeqv/article/details/109251236

版权

cesium 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

首先下载cesium源码，官网有安装包，这里推荐在github上下载，然后自己编译，因为自己编译可以查看各种类库的源码，github地址：https://github.com/CesiumGS/cesium

利用vscode进入到该文件中，我们可以看到有个package.json文件，说明我们需要再安装相应的包文件
在控制台中输入：npm install
安装好包文件之后，对源码进行编译，输入：npm run build，即可编译
编译好之后输入 npm start即可进入服务

点击第三个，进入案例

自己建立一个cesium项目：
控制台将源码编译为发布版：npm run release
因为编译之后，已经形成了一个cesium.js文件，自己建立工程，只需要引入这个文件就可以了
在主目录中新建一个study文件夹
经过编译之后，build文件夹中已经有了Cesium文件夹，cesium.js就在这个文件夹中
在study文件夹中新建一个html文件，引入相关js和css

<!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>

在vscode中下载一个插件：live server,它可以模拟搭建一个小型服务，在代码部分右击，点击 open with live server，
即可看到地球界面

问也去

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
打赏
0
评论
cesium入门，源码编译与第一个界面搭建

首先下载cesium源码，官网有安装包，这里推荐在github上下载，然后自己编译，因为自己编译可以查看各种类库的源码，github地址：https://github.com/CesiumGS/cesium
复制链接

扫一扫