three实现三维户外激光秀舞台场景代码-html代码-BFW代码库

three实现三维户外激光秀舞台场景代码

代码语言：html

所属分类：其他

代码由claude-5 ai生成，可能有错误，仅供参考：点击查看提示词

代码描述：户外三维带激光活动舞台

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>逼真3D户外舞台 - 激光秀 & 动态天气</title>
<style>
  html,body{margin:0;padding:0;overflow:hidden;background:#000;font-family:"Microsoft YaHei",sans-serif;}
  canvas{display:block;}
  #ui{position:fixed;top:10px;left:10px;color:#fff;background:rgba(0,0,0,0.45);
      padding:12px 16px;border-radius:8px;font-size:14px;line-height:1.7;z-index:10;
      user-select:none;backdrop-filter:blur(4px);}
  #ui b{color:#ffd54a;}
  #ui button{margin-top:8px;padding:7px 14px;border:none;border-radius:5px;
      background:#ffd54a;color:#222;font-weight:bold;cursor:pointer;}
  #ui button:hover{background:#ffe083;}
  #tip{position:fixed;bottom:10px;left:10px;color:#ccc;font-size:12px;z-index:10;
       background:rgba(0,0,0,0.35);padding:6px 10px;border-radius:6px;}
  #flash{position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;
         opacity:0;pointer-events:none;z-index:20;}
  #loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
           color:#fff;font-size:20px;z-index:30;}
</style>
</head>
<body>
<div id="ui">
  <div>🎪 <b>户外演唱会舞台</b></div>
  <div>天气：<b id="weatherLabel">-</b></div>
  <div>时间：<b id="timeLabel">-</b></div>
  <div>下次天气变化：<b id="countdownLabel">-</b> 秒</div>
  <button id="changeWeatherBtn">🎲 立即切换天气</button>
</div>
<div id="tip">鼠标左键拖拽旋转 · 滚轮缩放 · 右键平移</div>
<div id="flash"></div>
<div id="loading">场景加载中...</div>

<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/controls/OrbitControls.js"></script>
<script>
/* ========================= 全局变量 ========================= */
let scene, camera, renderer, controls, clock;
let sunLight, hemiLight, sunMesh, moonMesh, skyMesh, skyUniforms;
let lasers = [], movingHeads = [], clouds = [];
let rainPoints, rainVel, snowPoints, snowVel, stars;
let groundFogMesh, lightningLight;
let screenCanvas, screenCtx, screenTexture;

let dayTime = 0.30;              // 0~1 代表一天
const dayLength = 240;           // 一个昼夜循环秒数

const weatherTypes = ['clear','cloudy','rain','storm','snow','fog'];
let currentWeather = 'clear';
let weatherTimer = 15;
let .........完整代码请登录后点击上方下载按钮下载查看