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>
标签：__,部署,离线,longitude,height,Cesium,dataPoint,版本,latitude From： https://www.cnblogs.com/gooutlook/p/18249605