zfxcms ^回到顶部

您的当前位置:首页 > web资讯 > WEB框架 >cesium > node搭建CesiumJS,其他服务器搭建CesiumJS

node搭建CesiumJS,其他服务器搭建CesiumJS

所属分类: cesium   2019-03-04 10:42:24  编辑:admin  浏览次数 701 次

  1. 下载 https://cesiumjs.org/downloads/

    image.png

  2. Node服务器搭建

    npm install

  3. node server.js启动Web服务器,打开holleword   

  4. http://localhost:8080/HelloWorld.html
  5. 其他服务器搭建(php的apache举例)

    npm install

    放到apache下,

    配置虚拟域名image.png

    http://www.ditu.com/Apps/HelloWorld.html 打开案例

  6. 如果自己不想安装案例可以直接把

    image.png

  7. build下的放到js里面,就直接引用就好了

<!DOCTYPE html>

<html>

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

反正做到4步即可

(1)引入cesium.js。该文件定义了Cesium对象,它包含了我们需要的一切。

<script src="../Build/Cesium/Cesium.js"></script>

(2)为了能使用Cesium各个可视化控件,我们需要引入widgets.css。

@import url(../Build/Cesium/Widgets/widgets.css);

(3)在HTML的body中我们创建一个DIV,用来作为三维地球的容器。

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

(4)最后,在js中初始化CesiumViewer实例。

var viewer = new Cesium.CesiumViewer('cesiumContainer');

Web文章检索

Web文章目录