cesium实现3d模拟操控飞机地球飞行代码
代码语言:html
所属分类:三维
代码描述:cesium实现3d模拟操控飞机地球飞行代码
代码标签: cesium 3d 模拟 操控 飞机 地球 飞行 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>3D Real Flight Sim - Fixed</title>
<!-- 引入 Cesium -->
<script src="https://cesium.com/downloads/cesiumjs/releases/1.113/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.113/Build/Cesium/Widgets/widgets.css" rel="stylesheet">
<style>
body { margin: 0; overflow: hidden; background: #000; user-select: none; font-family: "Consolas", "Courier New", monospace; }
#cesiumContainer { width: 100%; height: 100vh; cursor: crosshair; }
/* === 启动遮罩 (用于解锁声音) === */
#start-overlay {
position: absolute; top: 0; left: 0; width: 100%; height: 100%;
background: rgba(0,0,0,0.85); z-index: 10000;
display: flex; flex-direction: column; justify-content: center; align-items: center;
color: #0f0; cursor: pointer; transition: opacity 0.5s;
}
#start-overlay h1 { font-size: 40px; text-shadow: 0 0 20px #0f0; margin-bottom: 20px; }
#start-overlay p { font-size: 18px; color: #fff; animation: blink 1s infinite; }
@keyframes blink { 50% { opacity: 0.5; } }
/* === 驾驶舱 UI === */
#hud-overlay {
position: absolute;
top: 20px; left: 20px;
color: #0f0;
background: rgba(0, 15, 0, 0.7);
padding: 15px;
border: 1px solid rgba(0, 255, 0, 0.5);
border-radius: 8px;
z-index: 999;
min-width: 300px;
backdrop-filter: blur(8px);
box-shadow: 0 4px 15px rgba(0,0,0,0.5);
}
h2 { margin: 0 0 10px 0; font-size: 18px; text-transform: uppercase; border-bottom: 1px solid rgba(0,255,0,0.3); padding-bottom: 5px; text-align: center; color: #fff; text-shadow: 0 0 5px #0f0; }
.stat-row { display: flex; justify-content: space-between; margin: 5px 0; font-weight: bold; font-size: 15px; text-shadow: 1px 1px 0 #000; }
.settings-box { margin-top: 15px; border-top: 1px dashed rgba(0,255,0,0.3); padding-top: 10px; }
.control-group { margin-bottom: 12px; }
.control-label { font-size: 12px; color: #bbb; display: block; margin-bottom: 5px; }
select, input[type=range], input[type=text], button { width: 100%; cur.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0