563 lines
47 KiB
HTML
563 lines
47 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>雪域阳光方舟——高海拔极端环境乡村医疗服务基站BIM设计与智能建造研究</title>
|
||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||
<style>
|
||
html { scroll-behavior: smooth; font-size: 17px; }
|
||
:root { --primary: #EFF0F1; --dark: #717B8B; --light: #C4D3E2; --accent: #A1B0C1; }
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body { font-family: '方正姚体','FZYaoti',serif; background: var(--light); color: #333; padding-top: 72px; }
|
||
.navbar-custom { background: linear-gradient(135deg,var(--primary),var(--dark)); padding: 0 1rem; box-shadow: 0 2px 12px rgba(113,123,139,0.3); }
|
||
.navbar-custom .navbar-brand { color: #fff; font-weight: 700; font-size: 1.271rem; letter-spacing: 1px; padding: 12px 0; }
|
||
.navbar-custom .navbar-brand:hover { color: #fff; }
|
||
.navbar-custom .nav-link { color: rgba(255,255,255,0.9) !important; padding: 22px 14px !important; font-size: 0.894rem; font-weight: 500; transition: background .2s,color .2s; white-space: nowrap; }
|
||
.navbar-custom .nav-link:hover, .navbar-custom .nav-link:focus { background: rgba(255,255,255,0.12); color: #fff !important; }
|
||
.navbar-custom .nav-link.dropdown-toggle::after { display: inline-block; margin-left: 5px; vertical-align: middle; border-top: .35em solid; border-right: .35em solid transparent; border-left: .35em solid transparent; transition: transform .2s; }
|
||
.navbar-custom .nav-link.dropdown-toggle.show::after { transform: rotate(180deg); }
|
||
.navbar-custom .dropdown-menu { background: #fff; border: none; border-radius: 8px; box-shadow: 0 8px 30px rgba(113,123,139,0.18); padding: 8px 0; margin-top: 0; min-width: 200px; }
|
||
.navbar-custom .dropdown-menu .dropdown-item { padding: 10px 20px; font-size: .847rem; color: #333; transition: background .2s,color .2s; border-left: 3px solid transparent; }
|
||
.navbar-custom .dropdown-menu .dropdown-item:hover { background: var(--light); color: var(--accent); border-left-color: var(--accent); }
|
||
.navbar-custom .dropdown-menu .dropdown-item:active { background: var(--accent); color: #fff; }
|
||
.navbar-toggler { border: 1px solid rgba(255,255,255,0.5); padding: 6px 10px; }
|
||
.navbar-toggler-icon { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.8)' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
|
||
.hero-section { background: linear-gradient(135deg,var(--dark) 0%,var(--primary) 100%); padding: 60px 0 50px; text-align: center; }
|
||
.hero-title-wrap { display: inline-block; background: linear-gradient(to right,rgba(113,123,139,0.88) 0%,rgba(113,123,139,0.08) 100%); padding: 14px 36px; border-radius: 10px; backdrop-filter: blur(1px); margin-top: 12px; }
|
||
.hero-title { font-size: 2.4rem; font-weight: 800; color: #fff; letter-spacing: 4px; margin-bottom: 4px; text-shadow: 0 2px 8px rgba(0,0,0,0.2); line-height: 1.4; }
|
||
.hero-title-sm { font-size: 1.15rem; font-weight: 400; color: rgba(255,255,255,0.8); letter-spacing: 2px; margin-top: 4px; }
|
||
.hero-subtitle { font-size: 1.1rem; color: rgba(255,255,255,0.75); letter-spacing: 4px; margin-bottom: 0; }
|
||
.hero-divider { width: 60px; height: 3px; background: var(--accent); margin: 16px auto; border-radius: 2px; }
|
||
.hero-img { width: 100%; max-width: 1200px; height: auto; border-radius: 12px; box-shadow: 0 8px 40px rgba(113,123,139,0.15); display: block; margin: 0 auto; object-fit: cover; }
|
||
.main-wrapper { max-width: 1260px; margin: 0 auto; padding: 50px 20px 80px; }
|
||
.section-card { background: #fff; border-radius: 12px; padding: 40px; box-shadow: 0 4px 20px rgba(113,123,139,0.06); margin-bottom: 40px; border: 1px solid rgba(113,123,139,0.15); }
|
||
.section-card h2 { color: var(--dark); font-weight: 700; font-size: 1.6rem; margin-bottom: 16px; padding-left: 16px; border-left: 4px solid var(--accent); }
|
||
.section-card p { font-size: 1rem; line-height: 1.8; color: #555; }
|
||
footer { background: var(--dark); color: rgba(255,255,255,0.65); text-align: center; padding: 24px 0; font-size: .85rem; }
|
||
|
||
/* Section blocks */
|
||
.section-block { padding: 50px 20px; }
|
||
.section-block:nth-child(even) { background: #fff; }
|
||
.section-block:target { animation: highlight 2s ease; }
|
||
@keyframes highlight { 0%,100% { } 50% { box-shadow: inset 0 0 0 3px var(--accent); } }
|
||
.section-block-header { max-width: 1260px; margin: 0 auto 30px; text-align: center; }
|
||
.section-block-header h2 { font-size: 1.8rem; font-weight: 800; color: var(--dark); letter-spacing: 2px; position: relative; display: inline-block; padding-bottom: 10px; }
|
||
.section-block-header h2::after { content: ''; display: block; width: 50%; height: 3px; background: var(--accent); margin: 8px auto 0; border-radius: 2px; }
|
||
.section-block-inner { max-width: 1260px; margin: 0 auto; }
|
||
.sub-section { margin-bottom: 40px; }
|
||
.sub-section-header { background: linear-gradient(135deg,var(--dark),var(--primary)); padding: 18px 24px; border-radius: 10px 10px 0 0; }
|
||
.sub-section-header h3 { color: #fff; font-size: 1.15rem; font-weight: 700; margin: 0; letter-spacing: 1px; }
|
||
.sub-section-header .badge { background: rgba(255,255,255,0.18); color: #fff; font-weight: 400; font-size: .8rem; padding: 3px 12px; border-radius: 20px; margin-right: 10px; }
|
||
.img-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 20px; padding: 24px; background: #fff; border: 1px solid rgba(113,123,139,0.12); border-top: 0; border-radius: 0 0 10px 10px; }
|
||
.img-card { background: var(--light); border-radius: 10px; overflow: hidden; box-shadow: 0 2px 12px rgba(113,123,139,0.06); transition: transform .3s,box-shadow .3s; }
|
||
.img-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(113,123,139,0.12); }
|
||
.img-card .placeholder { width: 100%; height: 200px; background: linear-gradient(135deg,#d0d9e6 0%,#b0c0d4 100%); display: flex; align-items: center; justify-content: center; color: #5a6a7a; font-size: 1rem; font-weight: 600; letter-spacing: 2px; }
|
||
.img-card .caption { padding: 14px 18px; font-size: .9rem; color: #555; text-align: center; }
|
||
.back-top { text-align: center; margin-top: 10px; }
|
||
.back-top a { color: var(--accent); text-decoration: none; font-size: .9rem; }
|
||
.back-top a:hover { color: var(--dark); }
|
||
|
||
@media (max-width: 991.98px) { body { padding-top: 64px; } .navbar-custom .nav-link { padding: 12px 14px !important; } .navbar-custom .dropdown-menu { box-shadow: none; padding-left: 16px; } .hero-title { font-size: 2rem; letter-spacing: 4px; } .hero-title-wrap { padding: 10px 20px; } .img-grid { grid-template-columns: 1fr 1fr; } }
|
||
@media (max-width: 575.98px) { .hero-title { font-size: 1.5rem; } .hero-title-wrap { padding: 8px 14px; } .section-card { padding: 24px; } .img-grid { grid-template-columns: 1fr; } }
|
||
|
||
/* ---- Lightbox ---- */
|
||
.lightbox-overlay {
|
||
display: none;
|
||
position: fixed;
|
||
z-index: 9999;
|
||
inset: 0;
|
||
background: rgba(0,0,0,0.65);
|
||
justify-content: center;
|
||
align-items: center;
|
||
padding: 20px;
|
||
box-sizing: border-box;
|
||
}
|
||
.lightbox-overlay.active {
|
||
display: flex;
|
||
}
|
||
.lightbox-close {
|
||
position: fixed;
|
||
top: 20px;
|
||
right: 30px;
|
||
font-size: 32px;
|
||
color: #fff;
|
||
cursor: pointer;
|
||
z-index: 10000;
|
||
line-height: 1;
|
||
user-select: none;
|
||
opacity: .85;
|
||
transition: opacity .2s;
|
||
}
|
||
.lightbox-close:hover {
|
||
opacity: 1;
|
||
}
|
||
.lightbox-img {
|
||
display: block;
|
||
max-width: 90vw;
|
||
max-height: 90vh;
|
||
width: auto;
|
||
height: auto;
|
||
object-fit: contain;
|
||
border-radius: 6px;
|
||
box-shadow: 0 8px 40px rgba(0,0,0,0.3);
|
||
cursor: zoom-in;
|
||
overflow: auto;
|
||
-webkit-user-drag: none;
|
||
}
|
||
.lightbox-overlay.active .lightbox-img {
|
||
cursor: default;
|
||
}
|
||
/* touch / scroll support for tall/wide images */
|
||
.lightbox-overlay.has-scroll {
|
||
align-items: flex-start;
|
||
padding-top: 60px;
|
||
overflow: auto;
|
||
}
|
||
@media (max-width: 575.98px) {
|
||
.lightbox-close { top: 12px; right: 18px; font-size: 28px; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<!-- ========== Navbar ========== -->
|
||
<nav class="navbar navbar-expand-xl navbar-dark navbar-custom fixed-top">
|
||
<div class="container">
|
||
<a class="navbar-brand" href="#home page" style="display:flex;align-items:baseline;gap:4px;"><span>内蒙古工业大学</span><span style="font-size:.847rem;font-weight:400;opacity:.8;">建筑学院</span></a>
|
||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mainNavbar" aria-controls="mainNavbar" aria-expanded="false" aria-label="切换导航">
|
||
<span class="navbar-toggler-icon"></span>
|
||
</button>
|
||
<div class="collapse navbar-collapse" id="mainNavbar">
|
||
<ul class="navbar-nav mx-auto">
|
||
|
||
<li class="nav-item"><a class="nav-link" href="#home page">首页</a></li>
|
||
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="ddResearch" role="button" data-bs-toggle="dropdown" aria-expanded="false">前期调研</a>
|
||
<ul class="dropdown-menu" aria-labelledby="ddResearch">
|
||
<li><a class="dropdown-item" href="#research-1">课题背景</a></li>
|
||
<li><a class="dropdown-item" href="#research-2">场地环境</a></li>
|
||
</ul>
|
||
</li>
|
||
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="ddArchDesign" role="button" data-bs-toggle="dropdown" aria-expanded="false">建筑设计</a>
|
||
<ul class="dropdown-menu" aria-labelledby="ddArchDesign">
|
||
<li><a class="dropdown-item" href="#prefab-1">前期方案对比</a></li>
|
||
<li><a class="dropdown-item" href="#prefab-2">文化意象分析</a></li>
|
||
<li><a class="dropdown-item" href="#prefab-5">技术图纸</a></li>
|
||
<li><a class="dropdown-item" href="#interior-1">室内设计</a></li>
|
||
<li><a class="dropdown-item" href="#landscape-1">环境设计</a></li>
|
||
</ul>
|
||
</li>
|
||
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="ddComponent" role="button" data-bs-toggle="dropdown" aria-expanded="false">构件化分析</a>
|
||
<ul class="dropdown-menu" aria-labelledby="ddComponent">
|
||
<li><a class="dropdown-item" href="#prefab-7">爆炸分析图</a></li>
|
||
<li><a class="dropdown-item" href="#prefab-8">运输装车模拟</a></li>
|
||
<li><a class="dropdown-item" href="#component-3">构件表</a></li>
|
||
<li><a class="dropdown-item" href="#prefab-9">建造全流程模拟</a></li>
|
||
</ul>
|
||
</li>
|
||
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="ddSimulation" role="button" data-bs-toggle="dropdown" aria-expanded="false">软件模拟</a>
|
||
<ul class="dropdown-menu" aria-labelledby="ddSimulation">
|
||
<li><a class="dropdown-item" href="#selfsecure-1">照度分析</a></li>
|
||
<li><a class="dropdown-item" href="#selfsecure-2">眩光分析</a></li>
|
||
<li><a class="dropdown-item" href="#sim-4">光伏发电分析</a></li>
|
||
<li><a class="dropdown-item" href="#prefab-6">力学分析</a></li>
|
||
</ul>
|
||
</li>
|
||
|
||
<li class="nav-item dropdown">
|
||
<a class="nav-link dropdown-toggle" href="#" id="ddWebDesign" role="button" data-bs-toggle="dropdown" aria-expanded="false">网络辅助设计</a>
|
||
<ul class="dropdown-menu" aria-labelledby="ddWebDesign">
|
||
<li><a class="dropdown-item" href="#web-1">网页生成</a></li>
|
||
<li><a class="dropdown-item" href="#web-2">git仓库协同</a></li>
|
||
<li><a class="dropdown-item" href="#web-3">辅助方案深化</a></li>
|
||
</ul>
|
||
</li>
|
||
|
||
<li class="nav-item"><a class="nav-link" href="#final drawings">成图</a></li>
|
||
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<!-- ========== HOME PAGE ========== -->
|
||
<section id="home page">
|
||
<div class="hero-section">
|
||
<div class="container">
|
||
<p class="hero-subtitle">ARCHITECTURE PORTFOLIO</p>
|
||
<div class="hero-title-wrap">
|
||
<h1 class="hero-title">雪域阳光方舟</h1>
|
||
<p class="hero-title-sm">高海拔极端环境乡村医疗服务基站BIM设计与智能建造研究</p>
|
||
</div>
|
||
<div class="hero-divider"></div>
|
||
</div>
|
||
</div>
|
||
|
||
<main class="main-wrapper">
|
||
<div class="container">
|
||
<img src="images/xiaoguo.jpg" alt="雪域阳光方舟项目展示图" class="hero-img mb-5">
|
||
|
||
</div>
|
||
</main>
|
||
</section>
|
||
|
||
<!-- ========== 前期调研 ========== -->
|
||
<section id="preliminary investigation" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>前期调研</h2>
|
||
</div>
|
||
|
||
<div id="research-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">前期调研</span>课题背景</h3></div>
|
||
<div class="section-card" style="text-align:center;padding:40px;">
|
||
<p style="font-size:1rem;line-height:2;color:#555;margin:0;text-indent:2em;">在我国西藏地区广袤的乡村地带，由于地理位置偏僻、人口分散、常出现医疗资源分布不足的情况。加之高海拔高寒地区有着低氧、强辐射、大温差、多风雪特点，自然条件严苛，对当地医疗建筑的建造运营维护有着极大挑战。综合分析上述问题，本课题拟在西藏自治区那曲市班戈县佳琼镇央木布村设计一栋医疗建筑，旨在满足当地医疗需求、提升偏远乡村极端环境下医疗响应水平，并探索高海拔高寒地区装配式建筑新形式，为我国高海拔地区基层卫生建设提供理论依据与技术参考。</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="research-2" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">前期调研</span>场地环境</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div class="row g-3 mb-3">
|
||
<div class="col-6"><img src="images/quwei.jpg" alt="区位分析" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">区位分析</div></div>
|
||
<div class="col-6"><img src="images/xuanzhi.jpg" alt="场地选址" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">场地选址</div></div>
|
||
</div>
|
||
<div class="row g-3 mb-3">
|
||
<div class="col-6"><img src="images/nzgzdpjqw.png" alt="年最高、最低、平均气温" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">年最高、最低、平均气温</div></div>
|
||
<div class="col-6"><img src="images/nqsgypjqw.png" alt="那曲市各月平均气温" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">那曲市各月平均气温</div></div>
|
||
</div>
|
||
<div class="row g-3 mb-3">
|
||
<div class="col-6"><img src="images/njsljyts.png" alt="年降水量、降水天数" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">年降水量、降水天数</div></div>
|
||
<div class="col-6"><img src="images/njxljxts.png" alt="年降雪量、降雪天数" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">年降雪量、降雪天数</div></div>
|
||
</div>
|
||
<div class="row g-3">
|
||
<div class="col-6"><img src="images/nrzssrzts.png" alt="年日照时数、日照天数均值" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">年日照时数、日照天数均值</div></div>
|
||
<div class="col-6"><img src="images/npjfszdfs.png" alt="年平均风速、最大风速" style="width:100%;height:280px;object-fit:contain;display:block;background:#f5f5f5;border-radius:6px;"><div style="text-align:center;padding:10px 0 4px;font-size:1.1rem;color:#555;">年平均风速、最大风速</div></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== 建筑设计 ========== -->
|
||
<section id="prefabricated building design" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>建筑设计</h2>
|
||
</div>
|
||
|
||
<div id="prefab-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">建筑设计</span>前期方案对比</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<img src="images/shaixuan.jpg" alt="前期方案对比" style="width:100%;height:auto;display:block;border-radius:6px;">
|
||
</div>
|
||
</div>
|
||
|
||
<div id="prefab-2" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">建筑设计</span>文化意象分析</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<img src="images/wenhua.jpg" alt="文化意象分析" style="width:100%;height:auto;display:block;border-radius:6px;">
|
||
</div>
|
||
</div>
|
||
|
||
<div id="prefab-5" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">建筑设计</span>技术图纸</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div style="margin-bottom:20px;"><img src="images/zongping.jpg" alt="总平面图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">总平面图</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/ping.jpg" alt="一层平面图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">一层平面图</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/li2.jpg" alt="北立面图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">北立面图</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/li1.jpg" alt="西立面图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">西立面图</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/pou.jpg" alt="1-1剖面图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">1-1剖面图</div></div>
|
||
<div><img src="images/dayang.jpg" alt="墙身大样图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">墙身大样图</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="interior-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">建筑设计</span>室内设计</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div style="margin-bottom:20px;"><img src="images/shinei_kai.jpg" alt="健康教育室-可变隔墙开启状态" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">健康教育室-可变隔墙开启状态</div></div>
|
||
<div><img src="images/shinei_guan.jpg" alt="健康教育室-可变隔墙关闭状态" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">健康教育室-可变隔墙关闭状态</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="landscape-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">建筑设计</span>环境设计</h3></div>
|
||
<div class="img-grid">
|
||
<div class="img-card"><div class="placeholder">图片占位 1</div><div class="caption">环境设计 - 示意图 01</div></div>
|
||
<div class="img-card"><div class="placeholder">图片占位 2</div><div class="caption">环境设计 - 示意图 02</div></div>
|
||
<div class="img-card"><div class="placeholder">图片占位 3</div><div class="caption">环境设计 - 示意图 03</div></div>
|
||
<div class="img-card"><div class="placeholder">图片占位 4</div><div class="caption">环境设计 - 示意图 04</div></div>
|
||
<div class="img-card"><div class="placeholder">图片占位 5</div><div class="caption">环境设计 - 示意图 05</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== 构件化分析 ========== -->
|
||
<section id="component analysis" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>构件化分析</h2>
|
||
</div>
|
||
|
||
<div id="prefab-7" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">构件化分析</span>爆炸分析图</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<img src="images/fenxi.jpg" alt="爆炸分析图" style="width:100%;height:auto;display:block;border-radius:6px;">
|
||
</div>
|
||
</div>
|
||
|
||
<div id="prefab-8" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">构件化分析</span>运输装车模拟</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div><img src="images/ys_zc.jpg" alt="运输装车模拟" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">共使用8辆货车进行运输，其中以9.6m尺寸货车为主，共6辆；13m尺寸货车为辅，共3辆。方案最大尺寸构件为屋顶板，单件尺寸1.7m*8.6m，符合运输车辆尺寸。</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="component-3" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">构件化分析</span>构件表</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div style="margin-bottom:20px;"><img src="images/gj_jiegou.png" alt="结构构件表" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">结构构件表<br><br>地梁：标准件24个+非标准件4个；柱子：标准件6个+非标准件4个；钢梁：标准件56个+非标准件8个；单片梁：标准件42个+非标准件8个。<br><br>标准化率：84%</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/gj_weihu.png" alt="围护构件表" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">围护构件表<br><br>屋面板：标准件4个+非标准件4个；地面板：标准件20个+非标准件4个；围护墙板：标准件32个+非标准件29个；天窗板：标准件4个+非标准件6个。<br><br>标准化率：58%</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/gj_neiqiang.png" alt="内隔墙构件表" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">内隔墙构件表<br><br>内墙板：标准件11个+非标准件22个。<br><br>标准化率：33%</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/gj_neizhuang.png" alt="内装构件表" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">内装构件表<br><br>吊顶板：标准件8个+非标准件11个；附框：标准件13个；预制窗：标准件12个+非标准件4个。<br><br>标准化率：68%</div></div>
|
||
<div><img src="images/gj_shebei.png" alt="设备构件表" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">设备构件表<br><br>种植棚基础：标准件6个；光伏板：标准件28个+非标准件24个；蓄能模块：标准件3个。<br><br>标准化率：62%</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="prefab-9" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">构件化分析</span>建造全流程模拟</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:16px;">
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/1.jpg" alt="地螺丝安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">地螺丝安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/2.jpg" alt="钢连接件安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">钢连接件安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/3.jpg" alt="地基安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">地基安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/4.jpg" alt="地梁安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">地梁安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/5.jpg" alt="蓄能模块安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">蓄能模块安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/6.jpg" alt="" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">柱安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/7.jpg" alt="梁安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">梁安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/8.jpg" alt="天窗梁安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">天窗梁安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/9.jpg" alt="屋顶板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">屋顶板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/10.jpg" alt="天窗板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">天窗板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/11.jpg" alt="室内部分楼板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">室内部分楼板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/12.jpg" alt="室外平台部分楼板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">室外平台部分楼板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/13.jpg" alt="室外平台围护板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">室外平台围护板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/14.jpg" alt="墙龙骨安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">墙龙骨安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/15.jpg" alt="转角墙板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">转角墙板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/16.jpg" alt="其他墙板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">其他墙板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/17.jpg" alt="短轴方向内墙安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">短轴方向内墙安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/18.jpg" alt="长轴方向内墙安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">长轴方向内墙安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/19.jpg" alt="吊顶安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">吊顶安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/20.jpg" alt="楼梯及坡道安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">楼梯及坡道安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/21.jpg" alt="附框及玻璃安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">附框及玻璃安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/22.jpg" alt="光伏板安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">光伏板安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/23.jpg" alt="栏杆安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">栏杆安装</div></div>
|
||
<div><div style="height:180px;overflow:hidden;border-radius:6px;background:#f5f5f5;"><img src="images/24.jpg" alt="种植棚安装" style="width:100%;height:100%;object-fit:contain;display:block;"></div><div style="text-align:center;padding:6px 0 0;font-size:1.1rem;color:#555;">种植棚安装</div></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== 软件模拟 ========== -->
|
||
<section id="self-supporting design" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>软件模拟</h2>
|
||
</div>
|
||
|
||
<div id="selfsecure-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">软件模拟</span>照度分析</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;">通过climate studio软件对建筑照度进行分析，得出建筑内部光照不足。通过改变开窗位置、大小，对原方案进行优化，优化后主要使用区域照度得到较大提升。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/zdfx_qian.jpg" alt="优化前" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">优化前</div></div>
|
||
<div><img src="images/zdfx_hou.jpg" alt="优化后" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">优化后</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="selfsecure-2" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">软件模拟</span>眩光分析</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<div><img src="images/xgfx.jpg" alt="眩光分析" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">眩光分析</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="sim-4" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">软件模拟</span>光伏发电分析</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;line-height:1.8;">结合梁的分布，首先采用1.9m*0.6m、2.2m*0.6m两种尺寸的光伏板，共计38块，使用n型TOP Con单晶硅光伏板，产能效率为25.1%。最终计算得出光伏全年发电16178kWh，建筑全年总能耗约为19261kWh，存在一定热量缺口。通过ladybug-tools软件的模拟优化，将1.9m*0.6m光伏板数量增加为38块；2.2m*0.6m光伏板数量增加至14块，共计52块，光伏全年发电量为21974kWh，基本满足基础能耗需求。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/gffd_qian.jpg" alt="优化前" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">优化前</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/gffd_hou.jpg" alt="优化后" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">优化后</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/gffd_duibi.jpg" alt="优化前后对比分析" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">优化前后对比分析</div></div>
|
||
<div><img src="images/gffd_dioanchi.jpg" alt="电池组" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">电池组</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="prefab-6" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">软件模拟</span>力学分析</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;line-height:1.8;">在Grasshopper环境中使用Karamba3D插件对钢框架结构体系进行分析。分析结果显示，在标准荷载组合下，所有构件的应力比均小于0.6，位移变形也小于规范限值L/250。结构的薄弱环节主要集中在屋顶大跨度梁和基础地梁处。据此，我对这些区域的节点进行了加强设计，例如增加辅助梁，并适当调整了个别地梁的位置。对优化后的结构模型再次分析可得出，方案安全余量充足，证明了该轻钢结构体系能够胜任当地极端环境下的安全保障任务。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/lxfx_jianmo.png" alt="力学模型" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">力学模型</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/lxfx_weiyitu.png" alt="位移分析" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">位移分析</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/lxfx_yinglitu.png" alt="应力分析" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">应力分析</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/lxfx_wewiyidianchi.jpg" alt="位移分析电池组" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">位移分析电池组</div></div>
|
||
<div><img src="images/lxfx_yinglidianchi.jpg" alt="应力分析电池组" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">应力分析电池组</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== 网络辅助设计 ========== -->
|
||
<section id="web assisted design" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>网络辅助设计</h2>
|
||
</div>
|
||
|
||
<div id="web-1" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">网络辅助设计</span>网页生成</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;line-height:1.8;">在本次方案中，使用AI辅助网页生成，促进设计成果的信息化、网络化。主要使用软件为Open Code，通过在提示栏输入指令自动生成代码，对网页进行编辑。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/wangye_daima.png" alt="网页代码" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">网页代码</div></div>
|
||
<div><img src="images/wangye_caozuo.png" alt="指令输入栏" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">指令输入栏</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="web-2" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">网络辅助设计</span>git仓库协同</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;line-height:1.8;">本次设计使用Gitea仓库进行协同设计，以便组内工作信息及时更新，提高工作效率。同时，进度git仓库可保存工作进度，便于统筹工作安排。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/git1.png" alt="git仓库界面" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">git仓库界面</div></div>
|
||
<div style="margin-bottom:20px;"><img src="images/git2.png" alt="git仓库界面" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">git仓库界面</div></div>
|
||
<div><img src="images/git3.png" alt="git仓库界面" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">git仓库界面</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="web-3" class="sub-section">
|
||
<div class="sub-section-header"><h3><span class="badge">网络辅助设计</span>辅助方案深化</h3></div>
|
||
<div style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-top:0;border-radius:0 0 10px 10px;">
|
||
<p style="text-align:center;font-size:1.1rem;color:#555;margin:0 0 20px;line-height:1.8;">在方案设计过程中，对AI辅助方案优化技术进行了探索。通过使用GPT-image等图像生成式AI，输入藏式建筑、材质、拼贴风格参考图样例，可生成相应图片，为效果图风格提供参考。</p>
|
||
<div style="margin-bottom:20px;"><img src="images/fangan_1.png" alt="GPT-image生成图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">GPT-image生成图</div></div>
|
||
<div><img src="images/fangan_2.png" alt="GPT-image生成图" style="width:100%;height:auto;display:block;border-radius:6px;"><div style="text-align:center;padding:8px 0 0;font-size:1.1rem;color:#555;">GPT-image生成图</div></div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== 成图 ========== -->
|
||
<section id="final drawings" class="section-block">
|
||
<div class="section-block-inner">
|
||
<div class="section-block-header">
|
||
<h2>成图</h2>
|
||
</div>
|
||
<div class="section-card" style="padding:24px;background:#fff;border:1px solid rgba(113,123,139,0.12);border-radius:10px;">
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_11.jpg" alt="成图1" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_22.jpg" alt="成图2" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_33.jpg" alt="成图3" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_44.jpg" alt="成图4" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_55.jpg" alt="成图5" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_66.jpg" alt="成图6" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div style="margin-bottom:20px;"><img src="images/chengtu_77.jpg" alt="成图7" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
<div><img src="images/chengtu_88.jpg" alt="成图8" style="width:100%;height:auto;display:block;border-radius:6px;"></div>
|
||
</div>
|
||
<div class="back-top"><a href="#home page">↑ 返回顶部</a></div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ========== Footer ========== -->
|
||
<footer>
|
||
<div class="container">
|
||
© 2026 雪域阳光方舟 | 高海拔极端环境乡村医疗服务基站BIM设计与智能建造研究
|
||
</div>
|
||
</footer>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
|
||
|
||
<!-- Auto-close navbar on anchor click -->
|
||
<script>
|
||
document.querySelectorAll('.navbar-nav a[href^="#"]').forEach(function(link) {
|
||
link.addEventListener('click', function() {
|
||
var btn = document.querySelector('.navbar-toggler');
|
||
var nav = document.getElementById('mainNavbar');
|
||
if (btn && nav && nav.classList.contains('show')) {
|
||
btn.click();
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
|
||
<!-- Lightbox overlay -->
|
||
<div class="lightbox-overlay" id="lightbox">
|
||
<span class="lightbox-close" id="lightboxClose">×</span>
|
||
<img class="lightbox-img" id="lightboxImg" src="" alt="">
|
||
</div>
|
||
|
||
<script>
|
||
(function() {
|
||
var overlay = document.getElementById('lightbox');
|
||
var imgEl = document.getElementById('lightboxImg');
|
||
var close = document.getElementById('lightboxClose');
|
||
|
||
function open(src) {
|
||
imgEl.src = src;
|
||
overlay.classList.add('active');
|
||
document.body.style.overflow = 'hidden';
|
||
imgEl.onload = function() {
|
||
if (imgEl.naturalHeight > window.innerHeight * 0.9 ||
|
||
imgEl.naturalWidth > window.innerWidth * 0.9) {
|
||
overlay.classList.add('has-scroll');
|
||
} else {
|
||
overlay.classList.remove('has-scroll');
|
||
}
|
||
};
|
||
}
|
||
|
||
function closeLightbox() {
|
||
overlay.classList.remove('active');
|
||
overlay.classList.remove('has-scroll');
|
||
document.body.style.overflow = '';
|
||
imgEl.src = '';
|
||
}
|
||
|
||
document.querySelectorAll('.section-card img, .sub-section img, .section-block img').forEach(function(img) {
|
||
if (img.closest('.navbar') || img.closest('.hero')) return;
|
||
img.style.cursor = 'pointer';
|
||
img.addEventListener('click', function(e) {
|
||
e.stopPropagation();
|
||
open(this.src);
|
||
});
|
||
});
|
||
|
||
overlay.addEventListener('click', function(e) {
|
||
if (e.target === overlay || e.target === close) {
|
||
closeLightbox();
|
||
}
|
||
});
|
||
|
||
document.addEventListener('keydown', function(e) {
|
||
if (e.key === 'Escape' && overlay.classList.contains('active')) {
|
||
closeLightbox();
|
||
}
|
||
});
|
||
})();
|
||
</script>
|
||
</body>
|
||
</html> |