GIS

一、Cesium的Hello World

2020-03-20  本文已影响0人  仙人掌开不了花

1.创建一个html页面

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
</head>
<body>
</body>
</html>

2.引入Cesium的脚本和样式文件

<script src="https://cesium.com/downloads/cesiumjs/releases/1.67/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.67/Build/Cesium/Widgets/widgets.css" rel="stylesheet">

3.创建地图的容器cesiumContainer

<div id="cesiumContainer" style="width: 700px; height:400px"></div>

4.初始化地图容器

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

完整的代码如下图所示

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <script src="https://cesium.com/downloads/cesiumjs/releases/1.67/Build/Cesium/Cesium.js"></script>
  <link href="https://cesium.com/downloads/cesiumjs/releases/1.67/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
</head>
<body>
  <div id="cesiumContainer" style="width: 700px; height:400px"></div>
  <script>
    Cesium.Ion.defaultAccessToken = 'your_access_token';
    var viewer = new Cesium.Viewer('cesiumContainer');
  </script>
</body>
</html>

效果如下图所示


HelloWorld

其中defaultAccessToken可以自己注册申请一个,之后便可以通过AccessId加载官方发布的一些示例数据。

上一篇 下一篇

猜你喜欢

热点阅读