Country Towers
ThreeUI · Three.js · 免费
在云境TS 中打开并复制 →
内容预览
# Country Towers Six country-specific towers assembling above a procedural landscape: Japanese, Chinese, Vietnamese, Thai, Khmer, and Ottoman. > 来源：ThreeUI Community · https://threeui.com · MIT License（Meng To / Design+Code） > 组件页：https://threeui.com/component/japanese-tower · 预览动画：https://threeui.com/previews/japanese-tower.webm > 分类：Three.js > 包含变体（6）：japan、china、vietnam、thailand、cambodia、turkey /* ===== src/shaders/japanese-tower/JapaneseTowerLandscape.tsx (tsx) ===== */ import { useEffect, useMemo, useState } from "react"; export const TOWER_COUNTRIES = ["japan", "china", "vietnam", "thailand", "cambodia", "turkey"] as const; export type TowerCountry = (typeof TOWER_COUNTRIES)[number]; const COUNTRY_LABELS: Record = { japan: "Japanese tenshu", china: "Chinese pagoda", vietnam: "Vietnamese tháp", thailand: "Thai prang", cambodia: "Khmer prasat", turkey: "Ottoman mosque", }; export type JapaneseTowerLandscapeProps = { className?: string; sourceUrl?: string; country?: TowerCountry; }; export function JapaneseTowerLandscape({ className = "", sourceUrl = "/japanese-tower.html", country = "japan", }: JapaneseTowerLandscapeProps) { const [ready, setReady] = useState(false); const frameSource = useMemo(() => { const hashIndex = sourceUrl.indexOf("#"); const base = hashIndex >= 0 ? sourceUrl.slice(0, hashIndex) : sourceUrl; const hash = hashIndex >= 0 ? sourceUrl.slice(hashIndex) : ""; return `${base}${base.includes("?") ? "&" : "?"}country=${country}${hash}`; }, [country, sourceU
……（完整源码请在站内查看）