武汉长江大桥

效果在线预览: 武汉长江大桥
视频链接: https://www.bilibili.com/video/BV1ygJq6fEgt
提示词:

# Role
你是一位精通 Three.js、WebGL 着色器（GLSL）与程序化建筑生成（Procedural Architecture）的资深前端 3D 图形工程师。

# Task
请在当前工作区创建一个完整的、可直接双击或在本地服务器运行的单文件 3D 建筑可视化项目 `wuhan_bridge_3d.html`，高精度还原中国地标建筑——**武汉长江大桥（万里长江第一桥）**及其周边的立体江景、交通流与昼夜光影系统。

# 核心建筑结构约束（绝对禁止画成斜拉桥或悬索桥！）
武汉长江大桥是经典的**双层公铁两用钢桁梁桥**，请使用精细的 Three.js 几何体组合与 `InstancedMesh` 严谨还原以下结构层次：
1. **正桥主梁（双层菱形钢桁架）**：
   - 正桥采用平直的连续钢桁梁结构，共 **8墩9孔**（每孔跨度感均匀，无高耸索塔、无任何斜拉索）。
   - 桁架外观：青灰色工业钢梁质感，两侧为高耸的密集**菱形/三角形交叉钢桁架**（包含上弦杆、下弦杆、斜腹杆、竖杆及顶部横向联结系），形成极具力量感的几何铁艺长廊。
   - **上层（公路桥面）**：位于钢桁架顶部，双向四车道沥青路面，带黄色双实线与白色车道虚线；两侧设有人行道、复古雕花护栏，以及极具代表性的成排**双排玉兰花造型景观路灯**。
   - **下层（双线铁路桥面）**：嵌套在钢桁架内部下层，铺设双线铁轨、枕木、道砟及上方电气化接触网架。
2. **中式复古桥头堡（核心视觉锚点）**：
   - 在正桥南北两端各建有一座对称的 **35米高重檐四坡攒尖顶中式桥头堡**。
   - 建筑细节：底部高大敦实的米黄色/暖灰花岗岩石材塔身（从江岸拔地而起，贯穿铁路层与公路层，带竖向复古花格窗与浮雕感腰线），顶部耸立中国古典民族风格的**翠绿色琉璃瓦重檐四角攒尖顶亭阁**，配朱红色立柱与汉白玉栏杆。
3. **桥墩与连续拱引桥**：
   - **8座巨型桥墩**：下部为圆端形/分水尖形混凝土墩座，带吃水线水渍质感与防撞护舷。
   - **两岸引桥**：桥头堡外侧连接双层钢筋混凝土**连续拱桥引桥**，与正桥的钢铁桁架形成鲜明材质对比。
4. **两岸地标远景与黄金水道**：
   - 南岸（武昌蛇山侧）山体剪影上点缀一座错落有致的**黄鹤楼**层叠飞檐剪影；北岸（汉阳龟山侧）点缀**龟山电视塔**轮廓。
   - 江面：基于自定义 Shader 或动态法线贴图的滚滚长江水体（带浑厚江水色调、波光反射与桥墩水流波纹）。

# 动态生命力与光影特效（爆款氛围感）
1. **三维立体交通系统**：
   - **上层公路**：双向流动的轿车、武汉公交车（带车头白光与车尾红光拖尾）。
   - **下层铁路**：定时双向穿行于钢桁梁内部的列车（一列复兴号/和谐号动车组，一列经典绿皮火车，夜晚车厢透出温暖窗光）。
   - **长江航道**：2-3艘带航行灯与尾部白色浪花轨迹的长江货轮与武汉两江轮渡缓缓穿行于桥孔之下。
2. **后期处理与光影（Post-Processing）**：
   - 引入 `EffectComposer`、`RenderPass` 与 `UnrealBloomPass`（辉光效果），搭配 `ACESFilmicToneMapping`。
   - 夜晚模式下：桥体钢桁架亮起暖金与冷白交织的轮廓洗墙灯、桥头堡攒尖顶泛光照明、玉兰花路灯发光、江面形成绚丽的倒影。

# 交互 UI 与镜头系统（左上角/底部毛玻璃控制面板）
请设计一套现代极简的毛玻璃（Glassmorphism）中文 UI 面板，包含：
1. **四时气象一键切换**：`清晨薄雾`、`正午晴空`、`落日熔金（黄昏）`、`江城夜景（灯光秀）`（平滑过渡天空盒渐变、太阳/月亮高度角、雾气浓度与大桥亮灯状态）。
2. **电影级机位预设（Camera Presets）**：
   - `全景航拍`（环绕大桥中心缓慢旋转）
   - `桥头堡特写`（聚焦重檐攒尖顶与玉兰花路灯）
   - `下层火车穿行视角`（跟随列车穿梭在密集菱形钢桁架光影中的第一视角）
   - `江面轮渡仰视`（从江面仰望8墩9孔钢铁巨龙）
   - `自由漫游`（OrbitControls 阻尼控制器）
3. **实时参数微调**：辉光强度（Bloom）、车流/列车速度、江面波浪强度、结构拆解展示（可单独高亮钢桁梁/桥头堡/桥墩）。

# 代码工程要求
- 通过 CDN 引入稳定版本的 Three.js 及 OrbitControls、EffectComposer、UnrealBloomPass（使用 `importmap` 规范加载 ES Modules）。
- **严禁省略代码**，严禁使用 `// TODO` 或外部本地贴图路径（所有材质纹理如水面、钢梁铆钉感、路面标线、窗户发光均采用 HTML5 Canvas 动态生成 Procedural Texture）。
- 确保代码结构清晰、帧率流畅（60FPS），直接输出完整可运行的 HTML 文件并保存。

ds宣传片

效果在线预览: deepseek宣传片
视频链接: https://www.bilibili.com/video/BV199JB6EE2j
提示词:

# Role
你是一位殿堂级的 WebGL / Three.js 创意技术总监（擅长 Apple 发布会视觉、Linear 暗黑流光美学与 GLSL 着色器艺术）。

# 核心问题修正与绝对禁令（必读！）
我们正在完全基于 `Three.js + Canvas 2D 程序化贴图 + GLSL Shader`（不使用任何外部模型或 Blender）制作一部 45 秒的 **《DeepSeek 1013：深度求索·万象觉醒》** 交互式 3D 宣传片。
**【视觉铁律——严禁低幼积木感】**：
1. **绝对禁止**使用简陋的 `SphereGeometry`、`ConeGeometry`、`BoxGeometry` 去笨拙地拼凑具象卡通玩具（严禁出现球体戴礼帽的章鱼、圆锥顶方块的塑料火箭、胶囊插柱子的玩具鲸鱼）！
2. **必须发挥 Three.js + GLSL 的真正强项**：所有的视觉主体必须采用 **大规模粒子流（Points + Custom Vertex/Fragment Shader）**、**数千实例矩阵（InstancedMesh）**、**参数化数学曲面与三维样条流光丝带（CatmullRomCurve3 + TubeGeometry）**、**全息线框扫描（Wireframe + Scanline Shader）** 来构建！
3. **强制开启电影级渲染管线**：
   - 必须引入 `EffectComposer` + `RenderPass` + `UnrealBloomPass`（辉光强度适中、阈值精准，让高光与粒子呈现柔和的电影级霓虹光晕）。
   - 必须使用 `PMREMGenerator` 与 `RoomEnvironment` 生成真实的环境反射贴图（envMap），配合 `MeshPhysicalMaterial`（带 `transmission` 玻璃透射、`ior` 折射率、`metalness` 金属度与 `iridescence` 虹彩光泽），彻底告别廉价的塑料高光！

---

# 舞台环境与 Canvas 2D 程序化纹理系统
1. **无界暗黑流光舞台（Infinite Cyber Stage）**：
   - 地面为深邃的暗曜石镜面反射网格地板（使用自定义 GLSL Shader 实现随距离指数衰减的精密发光坐标网格、脉冲波纹与中心全息刻度星盘，严禁画成死板的蓝色方格桌布）。
   - 背景为自定义 GLSL 渲染的深空星云、流动极光带与立体视差悬浮景深光斑（Bokeh Particles）。
2. **Canvas 2D 动态高分贴图（2048x2048 高清重绘）**：
   - 使用 Canvas 2D 程序化生成围绕在舞台四周的 **弧形半透明全息数据环（Holographic HUD Rings）** 与 **悬浮代码终端面板**：实时随时间 `t` 滚动展示 DeepSeek 1013 的核心推理代码流、张量矩阵波形图、帧率遥测数据与锐利的 `DEEPSEEK 1013` 现代无衬线字体排版。

---

# 单一确定性时间轴 `update(t)` 与五大高能视觉乐章（0.0s - 45.0s）
所有相机运镜、粒子形态、Shader uniform 参数与模型矩阵必须完全由纯函数 `update(t)`（`t` 为 0~45 秒）确定性计算得出，支持任意拖拽进度条毫秒级精准跳转。请按分幕式舞台切换（前一幕元素优雅消散/坍缩为粒子，无缝演化为下一幕，**严禁把所有物体乱七八糟堆在一起**）：

- **第一幕 `0.0s - 8.0s`【奇点觉醒 · The Genesis Core】**
  - **视觉主体**：舞台中央悬浮一颗精密绝伦的「克莱因拓扑量子核心」——内层是自定义 GLSL 噪波驱动的炽热青蓝流体等离子球，外层环绕 4 层不同轴向高速自转的 `MeshPhysicalMaterial` 磨砂钛金属与高折射水晶陀螺仪环（刻有 Canvas 2D 精密刻度贴图）。
  - **运镜与动效**：镜头从极近特写螺旋拉远，0~3 秒核心从全息网格线框被一道黄金+青色 GLSL 扫描光环激活点亮，释放出一圈横扫地面的环形冲击波。

- **第二幕 `8.0s - 16.5s`【万象架构 · 流光钢铁巨桥（Cyber Truss Mega-Bridge）】**
  - **视觉主体**：量子核心展开为数千根精密的 `InstancedMesh` 发光结构梁，在舞台中央通过 GLSL 生长扫描着色器，实时悬臂拼装成一座横跨画面的、极具工业与数学美感的**双层菱形钢桁架大桥与流光飞檐塔楼**（全息蓝金线框与高反光暗黑金属交织）。
  - **运镜与动效**：桥面上有数十道高速流动的激光车流轨迹（`TubeGeometry` 动态光带），桥下是 GLSL 顶点波浪驱动的黄金水道流体网格，镜头沿桥面低空高速穿梭掠过。

- **第三幕 `16.5s - 25.0s`【高维算力 · 洛伦兹超立方矩阵（Tesseract & Lorenz Attractor）】**
  - **视觉主体**：大桥消散化为 **8,000 个发光微晶块（InstancedMesh）** 与 **64 条三维流光光轨**。它们先在空中聚合成一个精密旋转的四维超立方体（Tesseract），随后在 19.5s 轰然解构，沿着**洛伦兹吸引子（Lorenz Strange Attractor）**与螺旋星系的数学微分方程轨迹高速盘旋冲天！
  - **运镜与动效**：配合弹簧阻尼环绕运镜与辉光爆发，展现令人窒息的算力风暴。

- **第四幕 `25.0s - 36.5s`【高潮：星海巡游 · 流体粒子巨鲸（Bioluminescent Particle Leviathan）】**
  - **视觉主体（重中之重，严禁用胶囊圆锥拼接！）**：用 **25,000 个自定义 GLSL 着色器粒子 + 40 条优雅的三维样条曲线丝带（CatmullRomCurve3）** 共同构筑一头半透明、星辰闪烁的巨型「深海星云蓝鲸」！
  - **数学动效**：在 Vertex Shader 中利用多重正弦波与 Simplex Noise 沿着鲸鱼脊柱轴线（Z轴）计算自然的躯干与尾鳍流体摆动（流线型轮廓由数学包络函数精确定义：头部饱满、流线脊背、修长飘逸的双叶尾鳍与胸鳍，全身流淌着青蓝色与星光金的菲涅尔边缘发光脉冲）。
  - **运镜与动效**：粒子巨鲸从星盘深处破水跃出，伴随漫天飘散的星尘光斑，以极具史诗感的慢镜头从摄像机上方优雅游过。

- **第五幕 `36.5s - 45.0s`【万流归宗 · 10.13 终极铭刻（The Convergence）】**
  - **视觉主体**：巨鲸化作漫天流光粒子，在舞台正中高速汇聚凝结成一座巨大的、带玻璃折射与边缘辉光的立体切面图腾与 **`DEEPSEEK 10.13`** 3D 发光阵列字，四周环绕所有章节的全息数据星环。
  - **定格特效**：`41.0s` 触发胶片快门闪光与轻微色差特效（Chromatic Aberration），画面优雅定格为带有电影宽银幕黑边与 `DEEPSEEK 1013 // THE SPARK OF CREATION` 纪念铭牌的终极海报画面。

---

# 保留并强化的导播台 UI 与 Web Audio 合成音轨
1. **保留现有的高颜值暗黑毛玻璃 UI 布局**：
   - 顶栏左侧品牌徽标，右侧 `16:9 / 9:16 / 1:1` 画幅切换、静音开关、隐藏 UI、实时 FPS 监控与 `Record WebM` 视频内录按钮。
   - 底栏保留带章节锚点（`奇点` / `巨桥` / `超立方` / `星鲸` / `铭刻`）的可拖拽进度条与快捷键支持（`Space` 播放暂停、`R` 重播、`H` 隐藏 UI、`M` 静音、`←/→` 微调时间）。
2. **Web Audio API 赛博交响电子配乐**：
   - 保持音画严格同步，用深沉的合成器 Pad、清脆的科技感琶音、重低音 Sub-Bass 与空灵的鲸鸣/扫描音效配合每一幕的转场高潮。

请直接输出完整、无任何省略、打开即享 60FPS 震撼视觉效果的代码！