Cesium本地化部署

最新推荐文章于 2024-09-21 11:29:05 发布

打杂的QQ

最新推荐文章于 2024-09-21 11:29:05 发布

阅读量1.2k

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/sinat_34721059/article/details/124986261

版权

最近在学习三维的过程中，发现使用Cesium过程中受网络影响较大，所以部署在本地一份，仅以此做个记录。

本地部署，肯定是需要下载源码，进行打包编译，可以在github上面下载到源码，源码地址
下载后的源码进行npm install
安装好依赖之后，可以执行npm start命令，启动项目
浏览器中输入地址（建议使用谷歌浏览器）

可以在sandcastle里面编写自己的代码，很方便代码调试。到这边我们就可以在自己本地调试cesium代码了。

如果是项目中使用的话，也就是只使用js，就是通过script标签引入js，有如下几个步骤需要执行一下：

在cesium中执行编译打包的命令 npm run release，执行成功后会发现多了一个Build文件夹。
将Build文件夹，拷入你所需要的文件夹中，如果只是纯前端的项目，建议使用VScode编译工具，装一个live Server插件，本次使用需要以服务的方式启动。

具体html文本内容

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <!-- Include the CesiumJS JavaScript and CSS files -->
  <script src="./Build/Cesium/Cesium.js"></script>

  <!-- <script src="https://cesium.com/downloads/cesiumjs/releases/1.93/Build/Cesium/Cesium.js"></script> -->
  <!-- <link href="https://cesium.com/downloads/cesiumjs/releases/1.93/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> -->
  <style>
    @import url(Build/Cesium/Widgets/widgets.css);
  </style>
  <link href="./css/common.css" rel="stylesheet">
</head>

<body>
  <div id="cesiumContainer"></div>
  <script>


    const viewer = new Cesium.Viewer("cesiumContainer");

  </script>
  </div>
</body>

</html>