Astral3D：Vue3 + Three.js 打造的免费开源 Web 3D 编辑器，支持 BIM/CAD/30+ 格式

Astral3D: A Free Open-Source Web 3D Editor in Vue3 and Three.js, with BIM, CAD and 30+ Formats

Tech-News #3D编辑器#Three.js#Vue3#BIM#CAD#WebGL#开源#Mycelium
更新于
🇨🇳 中文

by Mycelium Protocol

浏览器里跑一个 3D 编辑器，支持 BIM 模型、CAD 图纸、30+ 文件格式、粒子系统、动画编辑器——这听起来像是桌面软件的功能列表，但 Astral3D 用 Vue3 + Three.js 把它做成了开源 Web 应用。

2.4K stars，Apache-2.0，在线 Demo 可以直接体验：editor.astraljs.com。

它解决什么问题

建筑、工业、城市数字化场景里，3D 模型的 Web 端预览和编辑一直是痛点：

  • BIM 模型（Revit .rvt、.ifc）体积大，格式闭源，浏览器里跑需要转换和轻量化处理
  • CAD 图纸（.dwg、.dxf）需要专门的解析器
  • 多格式协同：GLTF、OBJ、FBX、GLB 各有差异，统一一套编辑器来处理很难

Astral3D 在 Three.js 基础上封装了这些能力，提供了一个完整的 Web 编辑环境，不需要安装任何桌面软件。

核心能力

30+ 模型格式支持

一个编辑器处理所有主流格式：

GLTF / GLB / OBJ / FBX / STL / DAE / 3DS / USDZ
RVT / IFC（BIM）
DWG / DXF（CAD）
PCD（点云）
……30+ 种

BIM 轻量化展示

Revit（.rvt）和 IFC 格式的 BIM 模型在 Web 端通常体积巨大、渲染慢。Astral3D 做了轻量化处理，实现在线预览和基本属性查看，不需要装 Revit 或专用 BIM 软件。

CAD 图纸解析（DWG/DXF）

直接在浏览器里解析 CAD 图纸并预览，支持 DWG 和 DXF 两种格式。不依赖 AutoCAD，纯 Web 端完成。

场景分包存储与加载

大型场景按区域分包，按需加载——解决了一次性加载整个复杂场景时的性能瓶颈。

动画编辑器

内置时间轴动画编辑，支持对场景中的物体设置动画关键帧。

扩展能力

Astral3D 的架构是可扩展的：

能力说明
插件系统自定义功能模块，官方和社区插件生态
脚本运行时在编辑器内运行自定义脚本逻辑
粒子系统可视化粒子效果配置
天气系统场景天气效果（雨、雪、雾等）
云存储集成资产和场景数据的云端存储
资源中心统一管理模型、材质、贴图等资产

即将到来

路线图上已有的计划：

  • 🚧 物理引擎支持：Three.js 场景内的刚体/碰撞模拟
  • 🚧 WebGPU 支持：下一代图形 API，性能大幅提升
  • 🚧 数据组件：API 和 WebSocket 数据源直连 3D 场景
  • 🚧 低代码数据大屏：面向可视化大屏场景
  • 🚧 WebSocket 多人协作：实时协同编辑

技术栈

层技术
3D 引擎Three.js r176
前端框架Vue 3.5.22
UI 组件Naive UI 2.43.1
CSS 方案UnoCSS 0.46.5
后端（可选）Java（astral-service）

快速上手

git clone https://github.com/mlt131220/Astral3D.git
cd Astral3D

# Node.js ≥ 23.11.x + PNPM
pnpm install
pnpm run sdk:build  # 先构建 SDK
pnpm run editor:dev # 启动编辑器开发服务

生产构建：

pnpm run editor:build

在线直接用：editor.astraljs.com

关于许可证

Apache-2.0，但附有补充条款：

  • ✅ 允许个人学习和二次开发
  • ⚠️ 使用需要版权声明
  • ⚠️ 商业用途需要授权（联系杭州星孪数字科技）
  • ❌ 禁止用于与杭州星孪数字科技有竞争性的业务

用于商业产品前注意确认授权。

为什么值得关注

Web 3D 编辑能力的覆盖范围是 Astral3D 的核心优势。大多数开源 3D Web 项目要么只做通用 3D（不处理 BIM/CAD 特殊格式），要么只做 BIM 展示（不提供完整的编辑器 UX）。Astral3D 把两者合在一套编辑器里，并叠加了粒子、天气、动画、插件扩展——这个组合在 Web 端是稀缺的。

WebGPU 支持在路上。当 WebGPU 成熟后，浏览器端渲染大型 BIM 模型的性能上限会大幅提升，Astral3D 这类基础设施的价值会进一步凸显。

2.4K stars，485 forks，持续更新中（最近更新 2026-08-04）。国内作者，有 QQ 群（1040320579）和中文社区。

仓库：github.com/mlt131220/Astral3D · 在线体验：editor.astraljs.com · 文档：editor-doc.astraljs.com

Mycelium Protocol — 追踪 AI 系统的底层演化

关于 Mycelium

菌丝协议。持续追踪 AI 工具、系统和实验的内容节点。

🇬🇧 English

Astral3D: Free Open-Source Web 3D Editor Built on Vue3 + Three.js — BIM, CAD, 30+ Formats

by Mycelium Protocol

A 3D editor running in the browser, supporting BIM models, CAD drawings, 30+ file formats, a particle system, and an animation editor — that sounds like a desktop software feature list. Astral3D makes it an open-source web application with Vue3 + Three.js. 2.4K stars, Apache-2.0, live demo at editor.astraljs.com.

The Problem It Solves

In architecture, industrial, and urban digitization contexts, web-based 3D model viewing and editing has long been painful:

  • BIM models (Revit .rvt, .ifc) are large, use closed formats, and require conversion and lightweighting to render in a browser
  • CAD drawings (.dwg, .dxf) need dedicated parsers
  • Multi-format compatibility: GLTF, OBJ, FBX, GLB each have their quirks; building a unified editor for all is hard

Astral3D wraps these capabilities over Three.js into a complete web editing environment — no desktop software installation required.

Core Capabilities

30+ model formats in one editor:

GLTF / GLB / OBJ / FBX / STL / DAE / 3DS / USDZ
RVT / IFC (BIM)
DWG / DXF (CAD)
PCD (point cloud)
...and 30+ total

BIM lightweighting: Revit (.rvt) and IFC files are typically huge and slow to render on the web. Astral3D applies lightweighting to enable in-browser preview and basic property inspection — no Revit or dedicated BIM software needed.

CAD parsing (DWG/DXF): Parse and preview CAD drawings directly in the browser, both DWG and DXF. No AutoCAD dependency, pure web.

Scene chunked loading: Large scenes are partitioned and loaded on demand, solving the performance bottleneck of loading entire complex scenes at once.

Animation editor: Built-in timeline animation with keyframe support for scene objects.

Extension Capabilities

FeatureDescription
Plugin systemCustom function modules, official and community plugin ecosystem
Script runtimeRun custom scripting logic within the editor
Particle systemVisual particle effect configuration
Weather systemScene weather effects (rain, snow, fog, etc.)
Cloud storage integrationCloud-backed asset and scene data
Resource centerUnified management of models, materials, and textures

On the Roadmap

  • 🚧 Physics engine: Rigid body / collision simulation inside Three.js scenes
  • 🚧 WebGPU support: Next-generation graphics API for significantly better performance
  • 🚧 Data components: API and WebSocket data sources wired directly to 3D scenes
  • 🚧 Low-code data dashboard: Targeted at visualization display screens
  • 🚧 WebSocket multi-user collaboration: Real-time collaborative editing

Tech Stack

LayerTech
3D engineThree.js r176
FrontendVue 3.5.22
UI componentsNaive UI 2.43.1
CSSUnoCSS 0.46.5
Backend (optional)Java (astral-service)

Quick Start

git clone https://github.com/mlt131220/Astral3D.git
cd Astral3D

# Node.js ≥ 23.11.x + PNPM
pnpm install
pnpm run sdk:build   # build SDK first
pnpm run editor:dev  # start editor dev server

Or use it directly online: editor.astraljs.com

License Note

Apache-2.0 with supplementary terms: commercial use requires authorization from 杭州星孪数字科技 (Hangzhou Xingluan Digital Technology). Verify before embedding in a commercial product.

Why This Matters

Coverage is Astral3D’s core differentiator. Most open-source 3D web projects either cover general 3D (without BIM/CAD special formats) or focus on BIM display (without a full editor UX). Astral3D combines both in one editor, and stacks particle effects, weather, animation, and plugin extensibility on top — that combination is rare on the web.

WebGPU support is incoming. When WebGPU matures, the performance ceiling for rendering large BIM models in the browser rises sharply, and infrastructure like Astral3D becomes significantly more valuable.

2.4K stars, 485 forks, actively maintained (last update 2026-08-04).

Repository: github.com/mlt131220/Astral3D · Live demo: editor.astraljs.com · Docs: editor-doc.astraljs.com

Mycelium Protocol — tracking the deep evolution of AI systems

© 2026 Mycelium Protocol. All rights reserved.

相关文章

Tech-News

浏览器里的全格式 3D 查看器：kovacsv/Online3DViewer，18 种格式，文件从不离开你的设备
Tech-News

浏览器里的 3A 特效工厂：纯 Three.js 打造 10 种游戏技能，938 个参数全部可实时调节
Tech-News

img2threejs：给AI一张图，拿回一个可动的Three.js 3D代码

💬 评论与讨论

使用 GitHub 账号登录后发表评论

关于本站 · 免责声明

🍄 Mushroom Research Blog 是非营利、免费公开的个人科技观察博客与公众号 XStack18，不接受商业合作、不代表任何企业或机构立场，也不谋求商业利益。我们以个人视角客观中立地记录和分析 AI、Web3 等领域的最新模型发布与技术动态——不止转述新闻标题或二手信息，而是给出有独立思考的深入分析，希望帮更多人获得有价值的一手科技认知。

⚠️ 文中介绍的开源代码与模型，仅供学习交流与技术借鉴。它们大多仍处于早期阶段，有待进一步研究和验证，请勿直接用于工作或生产环境；如需采用，请先自行充分测试，并核实其许可证与安全性。
Open-source code and models featured here are shared for learning and reference only. Most are early-stage and still need further study and verification — please don't use them directly in your work or in production. Test them thoroughly and check their licenses and security first.

  1. 本站文章均为作者基于公开信息的个人研究与观点整理，不代表文中提及的任何公司、产品、模型的官方立场，未与其构成商业关联或合作关系。
  2. 科技行业信息更新极快，我们尽力保证内容准确、及时，但不对完整性、实时性做绝对保证，具体请以相关企业/项目官方公告为准。
  3. 文中引用的第三方商标、产品名称、图片、数据等版权归原权利人所有，我们会尽量注明来源；如你认为存在版权疑问或侵权，请通过下方邮箱联系我们，收到通知后会尽快核实处理（更正、加注来源或删除）。
  4. 文章内容仅为技术科普与个人观点，不构成投资、法律或其他专业建议，据此进行任何决策的后果需自行判断和承担。

📮 侵权 / 勘误 / 合作咨询：[email protected]