mirror of
				https://github.com/jiawanlong/Cesium-Examples.git
				synced 2025-11-04 09:14:17 +00:00 
			
		
		
		
	
		
			
	
	
		
			119 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
		
		
			
		
	
	
			119 lines
		
	
	
		
			4.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| 
								 | 
							
								<!--********************************************************************
							 | 
						||
| 
								 | 
							
								* by jiawanlong
							 | 
						||
| 
								 | 
							
								*********************************************************************-->
							 | 
						||
| 
								 | 
							
								<!DOCTYPE html>
							 | 
						||
| 
								 | 
							
								<html>
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								<head>
							 | 
						||
| 
								 | 
							
								    <meta charset="UTF-8" />
							 | 
						||
| 
								 | 
							
								    <link rel="stylesheet" href="./../../cesium/Cesium1.98/Widgets/widgets.css">
							 | 
						||
| 
								 | 
							
								    <script type="text/javascript" src="./../../cesium/Cesium1.98/Cesium.js"></script>
							 | 
						||
| 
								 | 
							
								    <script src="./latlng.js"></script>
							 | 
						||
| 
								 | 
							
								</head>
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
							 | 
						||
| 
								 | 
							
								    <div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								    <script type="text/javascript">
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								        Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3ZjQ5ZGUzNC1jNWYwLTQ1ZTMtYmNjYS05YTY4ZTVmN2I2MDkiLCJpZCI6MTE3MTM4LCJpYXQiOjE2NzY0NDUyODB9.ZaNSBIfc1sGLhQd_xqhiSsc0yr8oS0wt1hAo9gbke6M'
							 | 
						||
| 
								 | 
							
								        const viewer = new Cesium.Viewer('map', {});
							 | 
						||
| 
								 | 
							
								        // 开启帧率
							 | 
						||
| 
								 | 
							
								        viewer.scene.debugShowFramesPerSecond = true;
							 | 
						||
| 
								 | 
							
								        // 深度监测
							 | 
						||
| 
								 | 
							
								        viewer.scene.globe.depthTestAgainstTerrain = true;
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								        function add() {
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            let x = 120.948058;
							 | 
						||
| 
								 | 
							
								            let y = 24.826652;
							 | 
						||
| 
								 | 
							
								            let z = 2000;
							 | 
						||
| 
								 | 
							
								            var position = Cesium.Cartesian3.fromDegrees(x, y, z);
							 | 
						||
| 
								 | 
							
								            var heading = Cesium.Math.toRadians(270);
							 | 
						||
| 
								 | 
							
								            var pitch = Cesium.Math.toRadians(-120);
							 | 
						||
| 
								 | 
							
								            var roll = Cesium.Math.toRadians(180);
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
							 | 
						||
| 
								 | 
							
								            var orientation = Cesium.Transforms.headingPitchRollQuaternion(
							 | 
						||
| 
								 | 
							
								                position,
							 | 
						||
| 
								 | 
							
								                hpr
							 | 
						||
| 
								 | 
							
								            );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            let entity1 = viewer.entities.add({
							 | 
						||
| 
								 | 
							
								                position: position,
							 | 
						||
| 
								 | 
							
								                orientation: orientation,
							 | 
						||
| 
								 | 
							
								                model: {
							 | 
						||
| 
								 | 
							
								                    uri: './models/dd/scene.gltf',
							 | 
						||
| 
								 | 
							
								                    scale: 70,
							 | 
						||
| 
								 | 
							
								                },
							 | 
						||
| 
								 | 
							
								            });
							 | 
						||
| 
								 | 
							
								            viewer.scene.postRender.addEventListener(updateRainPositions);
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            function updateRainPositions() {
							 | 
						||
| 
								 | 
							
								                x = x - 0.01 / 100
							 | 
						||
| 
								 | 
							
								                y = y - 0.01 / 100
							 | 
						||
| 
								 | 
							
								                z = z - 2100 / 100
							 | 
						||
| 
								 | 
							
								                if (z > 0) {
							 | 
						||
| 
								 | 
							
								                    entity1.position = Cesium.Cartesian3.fromDegrees(x, y, z);
							 | 
						||
| 
								 | 
							
								                } else if (z == 0 || (z < 0 && z > -21)) {
							 | 
						||
| 
								 | 
							
								                    addDK(x, y)
							 | 
						||
| 
								 | 
							
								                    window.entity.show = 1;
							 | 
						||
| 
								 | 
							
								                    viewer.clock.shouldAnimate = true;
							 | 
						||
| 
								 | 
							
								                    viewer.clock.clockRange = 1;
							 | 
						||
| 
								 | 
							
								                    viewer.clock.multiplier = 0.3
							 | 
						||
| 
								 | 
							
								                }
							 | 
						||
| 
								 | 
							
								            }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            function addDK(x, y) {
							 | 
						||
| 
								 | 
							
								                var position = Cesium.Cartesian3.fromDegrees(x, y, 1);
							 | 
						||
| 
								 | 
							
								                let entity = viewer.entities.add({
							 | 
						||
| 
								 | 
							
								                    position: position,
							 | 
						||
| 
								 | 
							
								                    model: {
							 | 
						||
| 
								 | 
							
								                        uri: './models/dk/dankeng.gltf',
							 | 
						||
| 
								 | 
							
								                        scale: 1,
							 | 
						||
| 
								 | 
							
								                    },
							 | 
						||
| 
								 | 
							
								                });
							 | 
						||
| 
								 | 
							
								            }
							 | 
						||
| 
								 | 
							
								        }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								        addBZ();
							 | 
						||
| 
								 | 
							
								        function addBZ() {
							 | 
						||
| 
								 | 
							
								            //俯视到目的地
							 | 
						||
| 
								 | 
							
								            viewer.camera.setView({
							 | 
						||
| 
								 | 
							
								                destination: Cesium.Cartesian3.fromDegrees(120.957668, 24.799042, 1625.0),
							 | 
						||
| 
								 | 
							
								                orientation: {
							 | 
						||
| 
								 | 
							
								                    heading: Cesium.Math.toRadians(316.8),
							 | 
						||
| 
								 | 
							
								                    pitch: Cesium.Math.toRadians(-30),
							 | 
						||
| 
								 | 
							
								                    roll: Cesium.Math.toRadians(0),
							 | 
						||
| 
								 | 
							
								                }
							 | 
						||
| 
								 | 
							
								            });
							 | 
						||
| 
								 | 
							
								            var position = Cesium.Cartesian3.fromDegrees(
							 | 
						||
| 
								 | 
							
								                120.938526, 24.817069, -0.5);
							 | 
						||
| 
								 | 
							
								            var heading = Cesium.Math.toRadians(45);
							 | 
						||
| 
								 | 
							
								            var pitch = Cesium.Math.toRadians(0);
							 | 
						||
| 
								 | 
							
								            var roll = Cesium.Math.toRadians(0);
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            var hpr = new Cesium.HeadingPitchRoll(heading, pitch, roll);
							 | 
						||
| 
								 | 
							
								            var orientation = Cesium.Transforms.headingPitchRollQuaternion(
							 | 
						||
| 
								 | 
							
								                position,
							 | 
						||
| 
								 | 
							
								                hpr
							 | 
						||
| 
								 | 
							
								            );
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            window.entity = viewer.entities.add({
							 | 
						||
| 
								 | 
							
								                position: position,
							 | 
						||
| 
								 | 
							
								                orientation: orientation,
							 | 
						||
| 
								 | 
							
								                model: {
							 | 
						||
| 
								 | 
							
								                    uri: './models/bz1/scene.gltf',
							 | 
						||
| 
								 | 
							
								                    scale: 0.42,
							 | 
						||
| 
								 | 
							
								                },
							 | 
						||
| 
								 | 
							
								            });
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								            setTimeout(() => {
							 | 
						||
| 
								 | 
							
								                add()
							 | 
						||
| 
								 | 
							
								            }, 20000);
							 | 
						||
| 
								 | 
							
								        }
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								    </script>
							 | 
						||
| 
								 | 
							
								</body>
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								</html>
							 |