three做个三维九龙拉棺场景代码

代码语言:html

所属分类:其他

代码由deepseek-4.1 ai生成,可能有错误,仅供参考:点击查看提示词

代码描述:三维九龙拉棺

代码标签: three 三维 九龙拉棺 场景 代码

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

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>九龙拉棺</title>
<style>
  * { margin:0; padding:0; box-sizing:border-box; }
  html, body { width:100%; height:100%; overflow:hidden; background:#05060a; }
  canvas { display:block; }
  #title {
    position:fixed; left:50%; top:26px; transform:translateX(-50%);
    font-family:"STKaiti","KaiTi","Microsoft YaHei",serif;
    font-size:28px; letter-spacing:14px; color:#e8c47a;
    text-shadow:0 0 18px rgba(255,180,60,.75), 0 0 46px rgba(255,110,0,.45);
    pointer-events:none; user-select:none;
    animation:glow 4s ease-in-out infinite;
  }
  @keyframes glow { 0%,100%{opacity:.72;} 50%{opacity:1;} }
  #hint {
    position:fixed; right:22px; bottom:18px; color:#7d6d50;
    font-family:sans-serif; font-size:12px; letter-spacing:1px;
    pointer-events:none; user-select:none;
  }
</style>
</head>
<body>
<div id="title">九 龙 拉 棺</div>
<div id="hint">拖动旋转视角 · 滚轮缩放</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
<script>
/* =========================================================
   九龙拉棺  —  Three.js 三维场景
   ========================================================= */

// ---------- 常量 ----------
const SEG        = 34;    // 龙身纵向分段
const RADIAL     = 8;     // 龙身横截面分段
const BODY_LEN   = 13;    // 龙身长度(局部坐标,头在 z=0,尾在 z=BODY_LEN)
const DRAGON_NUM = 9;

// ---------- 全局临时向量(复用,避免 GC) ----------
const _T = new THREE.Vector3();
const _N = new THREE.Vector3();
const _B = new THREE.Vector3();
const _tmp = new THREE.Vector3();
const _prev = new THREE.Vector3();

// =========================================================
//  1. 基础场景
// =========================================================
const scene = new THREE.Scene();
scene.background = new THREE.Color(0x060810);
scene.fog = new THREE.FogExp2(0x060810, 0.0105);

const camera = new THREE.PerspectiveCamera(
  50, window.innerWidth / window.innerHeight, 0.1, 1.........完整代码请登录后点击上方下载按钮下载查看

网友评论0