<!--
|
* @Author : yuan
|
* @Date : 2025-08-13 15:46:27
|
* @LastEditors : yuan
|
* @LastEditTime : 2025-10-16 15:44:12
|
* @FilePath : \video.html
|
* @Description :
|
* Copyright 2025 OBKoro1, All Rights Reserved.
|
* 2025-08-13 15:46:27
|
-->
|
<!DOCTYPE html>
|
<html lang="en">
|
|
<head>
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<title>Document</title>
|
|
<script src="./Build/Cesium.js"></script>
|
<!-- <script src="./ZLMRTCClient.js"></script> -->
|
|
<!-- <link href="https://cdn.bootcdn.net/ajax/libs/video.js/5.15.0/video-js.css" rel="stylesheet"> -->
|
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/video.js/5.15.0/video.min.js"></script> -->
|
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js"
|
type="text/javascript"></script> -->
|
|
|
<style>
|
@import url(./Build/Widgets/widgets.css);
|
|
|
* {
|
padding: 0;
|
margin: 0;
|
}
|
|
html,
|
body {
|
height: 100%;
|
}
|
|
#cesiumContainer {
|
width: 100%;
|
height: 100%;
|
}
|
</style>
|
</head>
|
|
<body>
|
<div id="cesiumContainer"></div>
|
</body>
|
|
<!-- <script src="https://cdn.bootcdn.net/ajax/libs/Turf.js/6.5.0/turf.min.js"></script> -->
|
<script>
|
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIzNjYzOTI5NC0yM2QyLTQyOTgtYWM5OS1lM2MwNTYwMGEzMjciLCJpZCI6ODQ1MjYsImlhdCI6MTY0NjM1ODM5OX0.BzsVR7Lt9RhsCia-R7E64KunaAME0HGD7Sv2-xF-RIQ'
|
|
var viewer = new Cesium.Viewer('cesiumContainer', {
|
|
|
imageryProvider: new Cesium.ArcGisMapServerImageryProvider({
|
url: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
|
maximumLevel: 18,
|
}),
|
|
// terrainProvider: Cesium.createWorldTerrain({
|
// requestVertexNormals: true,
|
// requestWaterMask: true
|
// }),
|
shouldAnimate: true,
|
selectionIndicator: false,
|
infoBox: false,
|
geocoder: false, // 位置查找工具
|
baseLayerPicker: false,// 图层选择器(地形影像服务)
|
timeline: false, // 底部时间线
|
homeButton: false,// 视角返回初始位置
|
fullscreenButton: false, // 全屏
|
animation: false, // 左下角仪表盘(动画器件)
|
sceneModePicker: false,// 选择视角的模式(球体、平铺、斜视平铺)
|
navigationHelpButton: false, //导航帮助按钮
|
})
|
//viewer.scene.debugShowFramesPerSecond = true;
|
viewer.cesiumWidget.creditContainer.style.display = "none"
|
var towerJson
|
|
// viewer.flyTo(tileset);
|
var position = Cesium.Cartesian3.fromDegrees(117.903458, 28.452275, 5000)//定义飞行终点的坐标
|
|
viewer.camera.flyTo({
|
// 设置相机前往的位置
|
destination: position,
|
// 相机的朝向
|
orientation: {
|
// 如果围绕y轴旋转,偏航角
|
heading: Cesium.Math.toRadians(0),
|
// 如果围绕x轴旋转,俯仰角
|
pitch: Cesium.Math.toRadians(-90),
|
// 如果围绕z轴旋转,翻滚角
|
roll: 0.0,
|
},
|
duration: 1,
|
complete: function () {
|
// 在相机移动完成后执行
|
// console.log("已抵达北京天安门");
|
},
|
})
|
|
// viewer.scene.globe.depthTestAgainstTerrain = true
|
|
const imageryProvider_stand = new Cesium.UrlTemplateImageryProvider({
|
url: `https://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=e110584a27d506da2740edca951683f4`,
|
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
|
// format: 'image/jpeg',
|
// show: true,
|
maximumLevel: 18,
|
credit: 'stand_tc',
|
})
|
|
const imageryProvider_standd = new Cesium.UrlTemplateImageryProvider({
|
url: `https://t{s}.tianditu.gov.cn/DataServer?T=cva_w&x={x}&y={y}&l={z}&tk=e110584a27d506da2740edca951683f4`,
|
subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
|
maximumLevel: 18,
|
credit: 'stand_zj',
|
})
|
|
viewer?.imageryLayers.addImageryProvider(imageryProvider_stand)
|
viewer?.imageryLayers.addImageryProvider(imageryProvider_standd)
|
|
|
viewer.imageryLayers.addImageryProvider(
|
new Cesium.UrlTemplateImageryProvider({
|
url: `/weather?z={myZ}&y={y}&x={x}&key=81503dad589f42bf9a9e5ea5e017f329`,
|
tilingScheme: new Cesium.GeographicTilingScheme(),
|
tileMatrixLabels: new Array(20).fill(0).map((v, i) => i + 1),
|
|
customTags: {
|
myZ: function (imageryProvider, x, y, z) {
|
|
return z + 1
|
}
|
}
|
})
|
)
|
|
</script>
|
|
</html>
|