代码语言：html

所属分类：其他

代码由qwen-3.8-max 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">
<title>云栖禅院 · 盛夏黄昏微缩古刹</title>
<style>
  html,body{height:100%;margin:0;overflow:hidden;background:#141a2c;}
  canvas{display:block;}
</style>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.128.0/examples/js/controls/OrbitControls.js"></script>
<script>
/* ================= 基础：渲染器 / 相机 / 控制器 ================= */
const renderer = new THREE.WebGLRenderer({antialias:true});
renderer.setPixelRatio(Math.min(devicePixelRatio,2));
renderer.setSize(innerWidth,innerHeight);
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
renderer.outputEncoding = THREE.sRGBEncoding;
document.body.appendChild(renderer.domElement);

const scene = new THREE.Scene();
scene.fog = new THREE.Fog(0xb9a9c6, 95, 270);

const camera = new THREE.PerspectiveCamera(42, innerWidth/innerHeight, 0.1, 800);
camera.position.set(36, 24, 44);

const controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.target.set(0, 4, 0);
controls.enableDamping = true;
controls.dampingFactor = 0.06;
controls.minDistance = 18;
controls.maxDistance = 130;
controls.maxPolarAngle = 1.46;
controls.autoRotate = true;
controls.autoRotateSpeed = 0.55;
let resumeTimer = null;
controls.addEventListener('start', ()=>{ controls.autoRotate=false; clearTimeout(resumeTimer); });
controls.addEventListener('end',   ()=>{ resumeTimer=setTimeout(()=>controls.autoRotate=true, 4000); });

/* ================= 三渲二：三阶渐变 Toon 材质 ================= */
const gradTex = (()=>{ 
  const data = new Uint8Array([70,70,70,255, 150,150,150,255, 255,255,255,255]);
  const t = new THREE.DataTexture(data,3,1,THREE.RGBAFormat);
  t.minFilter = t.magFilter = THREE.NearestFilter; t.needsUpdate = true; return t;
})();
const mat  = (c,extra={}) => new THREE.MeshToonMaterial(Object.assign({color:c, gradientMap:gradTex}, extra));
const basic= (c,extra={}) => new THREE.MeshBasicMaterial(Object.assign({color:c}, extra));
const INK = 0x2c2c38;
function outline(mesh, op=0.5){
  const e = new THREE.LineSegments(new THREE.EdgesGeometry(mesh.geometry, 38),
    new THREE.LineBasicMaterial({color:INK, transparent:true, opacity:op}));
  mesh.add(e); return mesh;
}
function put(o,x,y,z,parent){ o.position.set(x,y,z); (parent||scene).add(o); return o; }
function box(.........完整代码请登录后点击上方下载按钮下载查看

网友评论0

取消

评论提交中...

提交评论