three三维三维山坡上的寺庙场景代码-html代码-BFW代码库

three三维三维山坡上的寺庙场景代码

代码语言：html

所属分类：其他

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

代码描述：三维山坡上的寺庙

下面为部分代码预览，完整代码请点击下载或在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>山坡古寺 · Three.js</title>
<style>
  * { margin: 0; padding: 0; box-sizing: border-box; }
  html, body { width: 100%; height: 100%; overflow: hidden; background: #0a0d12; }
  canvas { display: block; }

  #hint {
    position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%);
    color: rgba(255,255,255,.75);
    font: 13px/1.6 "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
    letter-spacing: .08em; padding: 9px 20px; border-radius: 999px;
    background: rgba(10, 16, 24, .40);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border: 1px solid rgba(255,255,255,.12);
    pointer-events: none; white-space: nowrap;
    opacity: 0; animation: fadeIn 1.6s ease 1.2s forwards;
  }
  @keyframes fadeIn { to { opacity: 1; } }

  #loading {
    position: fixed; inset: 0; display: flex; align-items: center; justify-content: center;
    color: #7d93a8; font: 14px/1 system-ui, sans-serif; letter-spacing: .2em;
    background: #0a0d12; transition: opacity .9s ease; z-index: 10;
  }
  #loading.hide { opacity: 0; pointer-events: none; }
</style>
</head>
<body>

<div id="loading">正 在 生 成 山 寺 …</div>
<div id="hint">拖拽旋转 · 滚轮缩放 · 右键平移</div>

<script type="importmap">
{
  "imports": {
    "three": "https://unpkg.com/three@0.160.0/build/three.module.js",
    "three/addons/": "https://unpkg.com/three@0.160.0/examples/jsm/"
  }
}
</script>

<script type="module">
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';

/* ============================================================
   1. 程序化噪声
   ============================================================ */
const fract = (x) => x - Math.floor(x);
const hash2 = (x, y) => fract(Math.sin(x * 127.1 + y * 311.7) * 43758.5453123);

function valueNoise(x, y) {
  const xi.........完整代码请登录后点击上方下载按钮下载查看