260 lines
10 KiB
HTML
260 lines
10 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>TRELLIS.2 3D生成模型</title>
|
||
<style>
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
||
background: #0a0a0a; color: #e0e0e0;
|
||
min-height: 100vh; padding: 2rem;
|
||
}
|
||
.container { max-width: 1200px; margin: 0 auto; }
|
||
h1 {
|
||
font-size: 2.5rem; font-weight: 700;
|
||
background: linear-gradient(135deg, #60a5fa, #a78bfa);
|
||
-webkit-background-clip: text; -webkit-text-fill-color: transparent;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.subtitle { color: #888; font-size: 1.1rem; margin-bottom: 2rem; }
|
||
.badge-row { display: flex; gap: 0.5rem; margin-bottom: 2rem; flex-wrap: wrap; }
|
||
.badge {
|
||
display: inline-block; padding: 0.3rem 0.8rem; border-radius: 20px;
|
||
font-size: 0.8rem; font-weight: 600;
|
||
}
|
||
.badge-ms { background: #1a3a5c; color: #60a5fa; }
|
||
.badge-open { background: #1a3c2a; color: #4ade80; }
|
||
.badge-gpu { background: #3c1a1a; color: #f87171; }
|
||
.badge-mit { background: #3c2e1a; color: #fbbf24; }
|
||
|
||
.card {
|
||
background: #141414; border: 1px solid #222; border-radius: 12px;
|
||
padding: 2rem; margin-bottom: 1.5rem;
|
||
}
|
||
.card h2 { color: #60a5fa; margin-bottom: 1rem; font-size: 1.3rem; }
|
||
.card p, .card li { line-height: 1.8; color: #aaa; }
|
||
.card ul { list-style: none; padding: 0; }
|
||
.card ul li::before { content: ""; margin-right: 0.5rem; }
|
||
|
||
.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 1.5rem; }
|
||
|
||
table { width: 100%; border-collapse: collapse; margin-top: 0.5rem; }
|
||
th, td { text-align: left; padding: 0.7rem 1rem; border-bottom: 1px solid #222; }
|
||
th { color: #60a5fa; font-weight: 600; font-size: 0.9rem; }
|
||
td { color: #aaa; font-size: 0.9rem; }
|
||
|
||
.highlight { color: #4ade80; font-weight: 600; }
|
||
.warn { color: #f87171; font-weight: 600; }
|
||
|
||
.code-block {
|
||
background: #1a1a2e; border: 1px solid #2a2a4e; border-radius: 8px;
|
||
padding: 1.2rem; margin-top: 1rem; overflow-x: auto;
|
||
font-family: "SF Mono", "Fira Code", monospace; font-size: 0.85rem;
|
||
color: #c4b5fd; line-height: 1.6;
|
||
}
|
||
.code-comment { color: #555; }
|
||
|
||
.pipeline {
|
||
display: flex; align-items: center; gap: 0; margin: 1.5rem 0;
|
||
flex-wrap: wrap; justify-content: center;
|
||
}
|
||
.pipeline-step {
|
||
background: #1a1a2e; border: 1px solid #2a2a4e; border-radius: 10px;
|
||
padding: 1rem 1.5rem; text-align: center; min-width: 140px;
|
||
}
|
||
.pipeline-step .icon { font-size: 1.8rem; margin-bottom: 0.3rem; }
|
||
.pipeline-step .label { font-size: 0.85rem; color: #a78bfa; font-weight: 600; }
|
||
.pipeline-step .desc { font-size: 0.75rem; color: #666; margin-top: 0.2rem; }
|
||
.pipeline-arrow { color: #333; font-size: 1.5rem; padding: 0 0.3rem; }
|
||
|
||
.links { display: flex; gap: 1rem; margin-top: 1.5rem; flex-wrap: wrap; }
|
||
.links a {
|
||
display: inline-flex; align-items: center; gap: 0.4rem;
|
||
padding: 0.6rem 1.2rem; border-radius: 8px; text-decoration: none;
|
||
font-size: 0.9rem; font-weight: 600; transition: opacity 0.2s;
|
||
}
|
||
.links a:hover { opacity: 0.8; }
|
||
.link-gh { background: #1a1a2e; color: #c4b5fd; border: 1px solid #2a2a4e; }
|
||
.link-hf { background: #1a2e1a; color: #4ade80; border: 1px solid #2a4e2a; }
|
||
.link-paper { background: #2e1a1a; color: #fca5a5; border: 1px solid #4e2a2a; }
|
||
.link-demo { background: #1a2a3c; color: #60a5fa; border: 1px solid #2a3a5c; }
|
||
|
||
.verdict {
|
||
background: linear-gradient(135deg, #1a1a2e, #141414);
|
||
border: 1px solid #a78bfa33; border-radius: 12px;
|
||
padding: 2rem; margin-top: 1.5rem; text-align: center;
|
||
}
|
||
.verdict h2 { color: #a78bfa; margin-bottom: 0.5rem; }
|
||
.verdict p { color: #888; max-width: 600px; margin: 0 auto; }
|
||
|
||
footer { text-align: center; color: #333; margin-top: 3rem; font-size: 0.8rem; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<h1>TRELLIS.2 — 3D 生成模型</h1>
|
||
<p class="subtitle">微软开源 | 单张图片生成生产级 3D 资产 | 40 亿参数</p>
|
||
|
||
<div class="badge-row">
|
||
<span class="badge badge-ms">Microsoft Research</span>
|
||
<span class="badge badge-open">4B 参数</span>
|
||
<span class="badge badge-gpu">需 24GB+ GPU</span>
|
||
<span class="badge badge-mit">MIT 开源</span>
|
||
</div>
|
||
|
||
<!-- 生成流程 -->
|
||
<div class="card">
|
||
<h2>生成流程</h2>
|
||
<div class="pipeline">
|
||
<div class="pipeline-step">
|
||
<div class="icon">🖼</div>
|
||
<div class="label">输入图片</div>
|
||
<div class="desc">单张 RGB 照片</div>
|
||
</div>
|
||
<div class="pipeline-arrow">→</div>
|
||
<div class="pipeline-step">
|
||
<div class="icon">🧠</div>
|
||
<div class="label">Flow Transformer</div>
|
||
<div class="desc">40亿参数推理</div>
|
||
</div>
|
||
<div class="pipeline-arrow">→</div>
|
||
<div class="pipeline-step">
|
||
<div class="icon">🧊</div>
|
||
<div class="label">O-Voxel</div>
|
||
<div class="desc">稀疏体素生成</div>
|
||
</div>
|
||
<div class="pipeline-arrow">→</div>
|
||
<div class="pipeline-step">
|
||
<div class="icon">💎</div>
|
||
<div class="label">3D 模型</div>
|
||
<div class="desc">GLB + PBR 材质</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="grid">
|
||
<!-- 核心创新 -->
|
||
<div class="card">
|
||
<h2>核心创新：O-Voxel</h2>
|
||
<p>传统 3D 生成依赖 SDF（符号距离场）或 Flexicubes，只能处理封闭的流形网格。TRELLIS.2 发明了 <span class="highlight">O-Voxel（无场稀疏体素）</span>，突破性地支持：</p>
|
||
<ul>
|
||
<li>任意拓扑结构（开放曲面、非流形几何）</li>
|
||
<li>锐利几何特征保留</li>
|
||
<li>完整 PBR 材质（含透明度和金属度）</li>
|
||
<li>1536³ 体素 → 仅 9.6K 隐空间 token（16× 压缩）</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- 性能数据 -->
|
||
<div class="card">
|
||
<h2>推理性能（H100 GPU）</h2>
|
||
<table>
|
||
<tr><th>分辨率</th><th>耗时</th><th>适用场景</th></tr>
|
||
<tr><td>512³</td><td class="highlight">~3 秒</td><td>快速预览</td></tr>
|
||
<tr><td>1024³</td><td class="highlight">~17 秒</td><td>标准生产</td></tr>
|
||
<tr><td>1536³</td><td>~60 秒</td><td>高精度</td></tr>
|
||
</table>
|
||
<table style="margin-top: 1rem;">
|
||
<tr><th>指标</th><th>数值</th></tr>
|
||
<tr><td>模型参数</td><td>40 亿</td></tr>
|
||
<tr><td>输出格式</td><td>GLB（含 WebP 纹理）</td></tr>
|
||
<tr><td>纹理分辨率</td><td>最高 4096 × 4096</td></tr>
|
||
</table>
|
||
</div>
|
||
|
||
<!-- 对比传统方法 -->
|
||
<div class="card">
|
||
<h2>vs 传统方法</h2>
|
||
<table>
|
||
<tr><th>维度</th><th>传统方法</th><th>TRELLIS.2</th></tr>
|
||
<tr><td>几何表示</td><td class="warn">仅封闭网格</td><td class="highlight">任意拓扑</td></tr>
|
||
<tr><td>材质</td><td class="warn">单一颜色</td><td class="highlight">完整 PBR</td></tr>
|
||
<tr><td>透明度</td><td class="warn">不支持</td><td class="highlight">原生支持</td></tr>
|
||
<tr><td>生成方式</td><td class="warn">迭代优化（分钟级）</td><td class="highlight">直接生成（秒级）</td></tr>
|
||
<tr><td>拓扑错误</td><td class="warn">常见</td><td class="highlight">极少</td></tr>
|
||
</table>
|
||
</div>
|
||
|
||
<!-- 硬件要求 -->
|
||
<div class="card">
|
||
<h2>硬件要求</h2>
|
||
<table>
|
||
<tr><th>项目</th><th>最低要求</th></tr>
|
||
<tr><td>GPU</td><td class="warn">24GB+ 显存（A100 / H100）</td></tr>
|
||
<tr><td>系统</td><td>Linux（仅验证平台）</td></tr>
|
||
<tr><td>CUDA</td><td>12.4+</td></tr>
|
||
<tr><td>Python</td><td>3.8+</td></tr>
|
||
</table>
|
||
<p style="margin-top: 1rem; color: #f87171; font-size: 0.9rem;">
|
||
⚠ MacBook M2 Max 无法原生运行（无 CUDA），需要 GPU 云服务器或在线 Demo
|
||
</p>
|
||
</div>
|
||
|
||
<!-- 已知局限 -->
|
||
<div class="card">
|
||
<h2>已知局限</h2>
|
||
<ul>
|
||
<li>生成网格可能有小孔洞，需后处理修补</li>
|
||
<li>未经 RLHF 对齐，输出风格随训练数据分布变化</li>
|
||
<li>仅在 Linux + NVIDIA GPU 上测试</li>
|
||
<li>复杂场景（多物体）效果不如单物体</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- 代码示例 -->
|
||
<div class="card">
|
||
<h2>使用代码</h2>
|
||
<div class="code-block">
|
||
<span class="code-comment"># 安装</span>
|
||
pip install trellis2
|
||
|
||
<span class="code-comment"># 推理</span>
|
||
import torch
|
||
from trellis2.pipelines import Trellis2ImageTo3DPipeline
|
||
from PIL import Image
|
||
|
||
pipeline = Trellis2ImageTo3DPipeline.from_pretrained(
|
||
"microsoft/TRELLIS.2-4B"
|
||
)
|
||
pipeline.cuda()
|
||
|
||
image = Image.open("photo.png")
|
||
mesh = pipeline.run(image)[0]
|
||
|
||
<span class="code-comment"># 导出 GLB</span>
|
||
import o_voxel
|
||
glb = o_voxel.postprocess.to_glb(
|
||
vertices=mesh.vertices,
|
||
faces=mesh.faces,
|
||
attr_volume=mesh.attrs,
|
||
voxel_size=mesh.voxel_size,
|
||
texture_size=4096
|
||
)
|
||
glb.export("output.glb")
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 评价 -->
|
||
<div class="verdict">
|
||
<h2>评价：真正的技术突破</h2>
|
||
<p>O-Voxel 是 3D 生成领域的根本性创新，解决了困扰行业多年的拓扑限制问题。MIT 开源 + 完整论文 + 可复现代码，不是噱头。当前主要限制是硬件门槛（需 NVIDIA GPU），MacBook 暂时无法本地运行。</p>
|
||
</div>
|
||
|
||
<!-- 链接 -->
|
||
<div class="links">
|
||
<a href="https://github.com/microsoft/TRELLIS.2" target="_blank" class="link-gh">GitHub 源码</a>
|
||
<a href="https://huggingface.co/microsoft/TRELLIS.2-4B" target="_blank" class="link-hf">HuggingFace 模型</a>
|
||
<a href="https://arxiv.org/abs/2512.14692" target="_blank" class="link-paper">arXiv 论文</a>
|
||
<a href="https://microsoft.github.io/TRELLIS.2/" target="_blank" class="link-demo">官方主页</a>
|
||
</div>
|
||
|
||
<footer>
|
||
研究项目 · 立项日期 2026-03-31 · 源码已克隆至 ./source/
|
||
</footer>
|
||
</div>
|
||
</body>
|
||
</html>
|