Sylva Living World
ThreeUI · Three.js · 免费
在云境TS 中打开并复制 →
内容预览
# Sylva Living World The original procedural moss-root world with pale flowers, ferns, drifting pollen, scan light, and a landing butterfly. > 来源：ThreeUI Community · https://threeui.com · MIT License（Meng To / Design+Code） > 组件页：https://threeui.com/component/sylva-living-world · 预览动画：https://threeui.com/previews/sylva-living-world.webm > 分类：Three.js > 包含变体（1）：living-green /* ===== src/shaders/sylva-living-world/SylvaLivingWorldScene.tsx (tsx) ===== */ import { useEffect, useMemo, useRef, useState, type CSSProperties } from "react"; import innerGreenSource from "./sources/inner-green-3d.html?raw"; import threeRuntime from "./sources/inner-green-assets/three.min.js?raw"; export const SYLVA_LIVING_WORLD_VARIANTS = ["living-green"] as const; export type SylvaLivingWorldVariant = "living-green"; export type SylvaLivingWorldSceneProps = { variant?: SylvaLivingWorldVariant; className?: string; style?: CSSProperties }; const SCENE_ONLY_MARKUP = ``; const SCENE_ONLY_STYLE = `html,body{width:100%!important;height:100%!important;min-height:0!important;margin:0!important;overflow:hidden!important}body{position:relative!important;background:#4a4d44!important}.hero{height:100%!important;min-height:0!important}#scene{pointer-events:auto!important}`; function buildSceneDocument(reducedMotion: boolean) { const presentationStart = innerGreenSource.indexOf(''); const runtimeStart = innerGreenSource.indexOf(''); if (presentationStart < 0 || runtimeStart < 0 || runtimeStart typeof document === "u
……（完整源码请在站内查看）