1 注册账号

https://ion.cesium.com/tokens?page=1

10511

L4

2 获取秘钥

https://ion.cesium.com/tokens?page=1

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyZmVmYjIwZC01MWMwLTQ1ODMtOTgyYi01NWRlYjI5MDQzZTQiLCJpZCI6MzY5MTAsImlhdCI6MTcxODQ0MzQyM30.W67FXIW320E6hr9RLPj-I107TqSjrzEZoIB6cDXO50A

3 部署python flask

pip install Flask

4 部署censuim代码离线库

https://ion.cesium.com/tokens?page=1

主要依赖库位置

调用工程

依赖cesuim库代码位置修改

<head>
  <script src="Cesium-1.118/Build/Cesium/Cesium.js"></script>
  <link href="Cesium-1.118/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
  <link href="style.css" rel="stylesheet">
</head>

5开发

5-1运行

activate py38
python gnss_show.py

界面

5-2代码

gnss_show.py

#激活环境
 
#!/usr/bin/env python2
# -*- coding: utf-8 -*-
import time
from flask import *
 
 
app = Flask(__name__)
 
import os
pathnow=os.getcwd()
pathnow=pathnow.replace('\\','/')
#print(pathnow) #获取当前工作目录路径
#print (os.path.abspath('mainPage0.html'))
 
 
 
app = Flask(
    __name__,
    template_folder='.',  # 表示在当前目录 (myproject/) 寻找模板文件
    static_folder='',     # 空 表示为当前目录 (myproject/) 开通虚拟资源入口
    static_url_path='',
)
 
  
@app.route('/')
def index():
    return render_template('index.html')
 
 
 
  
if __name__ == '__main__':
    app.run(host='0.0.0.0',port='8080')

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <script src="Cesium-1.118/Build/Cesium/Cesium.js"></script>
  <link href="Cesium-1.118/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
  
  <style>
  body {
    overflow: hidden;
    margin: 0px;
    padding: 0px;
    height: 100%;
  }
  #cesiumContainer {
    height: 100%;
  }
</style>

</head>
<body>
  <div id="cesiumContainer"></div>
  <script type="module">
    //<link href="style.css" rel="stylesheet">
    // Get your token from https://cesium.com/ion/tokens  秘钥
   Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyZmVmYjIwZC01MWMwLTQ1ODMtOTgyYi01NWRlYjI5MDQzZTQiLCJpZCI6MzY5MTAsImlhdCI6MTcxODQ0MzQyM30.W67FXIW320E6hr9RLPj-I107TqSjrzEZoIB6cDXO50A';
 
 
   //1创建地球可视化
   const viewer = new Cesium.Viewer('cesiumContainer', {
      terrain: Cesium.Terrain.fromWorldTerrain(),
    });

    const osmBuildings = await Cesium.createOsmBuildingsAsync();
    viewer.scene.primitives.add(osmBuildings);
    
    
   //1飞到指定地点 经纬度高度
    viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(-122.384, 37.62, 4000)
      });
 
 
 
    //2创建连续点对
    const flightData = JSON.parse(
      '[{"longitude":-122.39053,"latitude":37.61779,"height":-27.32},{"longitude":-122.39035,"latitude":37.61803,"height":-27.32},{"longitude":-122.39019,"latitude":37.61826,"height":-27.32},{"longitude":-122.39006,"latitude":37.6185,"height":-27.32},{"longitude":-122.38985,"latitude":37.61864,"height":-27.32}]');
 
    // Create a point for each.
    for (let i = 0; i < flightData.length; i++) {
       
     const dataPoint = flightData[i];
 
     const airplaneEntity= viewer.entities.add({
        //点击这个点出现的描述
        description: `Location: (${dataPoint.longitude}, ${dataPoint.latitude}, ${dataPoint.height})`,
        //点的位置
        position: Cesium.Cartesian3.fromDegrees(dataPoint.longitude, dataPoint.latitude, dataPoint.height),
        //点的类型
        point: { pixelSize: 10, color: Cesium.Color.BLUE }
      });
 
    // viewer.flyTo(airplaneEntity);
      
     
    }
 
 
  </script>
</body>
</html>

posted on 2024-06-15 18:30 MKT-porter 阅读(221) 评论(0) 收藏举报

刷新页面返回顶部

1 注册账号

10511

L4

2 获取秘钥

https://ion.cesium.com/tokens?page=1

3 部署python flask

4 部署censuim代码 离线库

https://ion.cesium.com/tokens?page=1

5开发

5-1运行

5-2代码

gnss_show.py

index.html

4 部署censuim代码离线库