一些经典的3D编辑器开源项目

掘金前端

答案answer

2025年11月27日 08:56

前言

给大家分享一下个人在探索开发three.js编辑器项目期间发现的一些比较不错的3D编辑器类型的开源项目，如果你也正打算做类似相关的项目，那么这些开源项目会是一个不错的参考借鉴

以下排名不分先后🙏🏻

项目一：Astral3D

描述：基于Vue3 + THREE.JS 免费开源的三维引擎及配套编辑器，包含BIM轻量化、CAD解析预览、粒子系统、插件系统等功能。

特点：强大的3D场景内容元素的编辑和保存功能和丰富多样的3D元素内容，同时支持BIM和CAD等工业建模文件的加载渲染

注意⚠️：项目是Apache-2.0 license 的开源协议，项目作者本人也声明了项目可用于个人学习，如有商用需要向作者申请商用授权

界面：

在线地址：editor.astraljs.com/#/

Github: github.com/mlt131220/A…

项目二：thebrowserlab

描述：一个「运行在浏览器里的 3D 编辑器 + 创意编码 (creative-coding) 环境」

特点：支持加载视频、文本、图片、粒子等内容并提供了丰富的编辑表单参数可视化编辑配置，同时还支持在线代码的脚本内容写入设置3D场景内容。

注意⚠️：项目使用 MIT 授权 (MIT license)，意味着你可以自由地 fork、修改、商用 (遵守 MIT 即可)

界面：

在线地址：thebrowserlab.com/

Github: github.com/icurtis1/th…

项目三：threepipe

描述：一个基于 Three.js 构建的现代 3D 框架

特点：项目基于了Three.js进行了二次封装，提供了不少高级功能，使其适合从简单 3D 模型预览到复杂交互 / 渲染应用，通过简单的API 使用就可以快速创建复杂的3D模型预览器，模型编辑器等内容。

注意⚠️：既然是封装好的框架，在享受使用的便利时，新的学习成本也是不可避免的，项目使用 Apache-2.0-1协议，商用也许需要授权，不过毕竟是歪果仁开发的，即使未授权也难以知晓

界面：

在线地址：editor.threepipe.org/

Github: github.com/repalash/th…

项目四：ShadowEditor

描述：基于Three.js、Go语言和MongoDB的跨平台的3D场景编辑器，支持桌面版和Web版。

特点：跨平台的支持 Windows / Linux / Mac，在桌面 (desktop) 和浏览器 (web) 中都能运行，前后端一体的项目

注意⚠️：使用 MIT 许可证的项目，可以自由用于学习、实验或商业用途。从界面不难看出，应该是属于上古时期的项目了，three.js版本也是107的。作者也推出了商业版的，如有需要也可以试用一下商业版的

界面：

在线地址：www.hylab.cn/shadowedito…

Github: gitee.com/tengge1/Sha…

项目五：three-editor

描述：一个基于 Three.js 的可视化 / 低代码 3D 编辑器 / 内核／框架。它的目标是降低使用 Three.js 的门槛，让构建 Web 3D 场景更简单、更迅速

特点：提供了一整套“可视化 + 配置 + 编辑 + 渲染”的能力，使得即使不深入了解 Three.js，也能快速构建 3D 场景 / 项目，：如果你只是想在网页中展示某个 3D 模型、场景或交互，而不想编写大量 Three.js boilerplate，three-editor 能极大降低门槛

注意⚠️：因为场景内容都是封装处理好的，提供的可编辑参数内容配置并不多，如果你的自定义需求很多的话使用这个项目前需要谨慎考虑一下

界面：

在线地址：z2586300277.github.io/threejs-edi…

Github: github.com/z2586300277…

项目六：scene-editor

描述：vis-three/scene-editor 是基于 vis-three 框架构建的 —— vis-three 本身是一个封装自 Three.js 的前端 3D 开发框架，用于简化 Web3D 开发

特点：基于vis-three 衍生开发的一个3D编辑器提供了一套较为完整的 Web 3D 场景编辑功能 — 目标是让你即使对 3D 或 Three.js 不熟，也能比较轻松地 “拖／配／编辑” 出一个 3D 场景

注意⚠️：仓库地址的代码是Vue3项目编译打包后的，作者并没有直接提供Vue3项目的源代码，如果有二次开发需求，无法直接性修改源代码

界面：

在线地址：z2586300277.github.io/threejs-edi…

Github: github.com/Shiotsukika…

Gitee:gitee.com/vis-three/s…

项目七： three.js官方编辑器

描述：Three.js（著名的 WebGL / Web 3D 渲染库）自带 / 官方提供的可视化编辑器，接触过three.js的应该都知道吧

特点：3D编辑器的鼻祖了也是唯一一个能和three.js最新版本保持随时同步的编辑器，很多现有的商业项目和开源项目的功能，或多或少都参考了这个项目去实现的

注意⚠️：使用原生js 去实现的，二次开发和扩展功能成本较大

界面：

在线地址：threejs.org/editor/

Github: github.com/mrdoob/thre…

项目八： threejs-3dmodel-edit

描述：一个基于 Three.js + Vue 3 + TypeScript + Pinia 的前端 3D 模型编辑器 / 可视化编辑平台

特点：是一个比较完整、现代、易用的 Web-based 3D 模型编辑器 — 它把 Three.js 的功能通过 Vue / TS / Pinia 封装起来，让非专业 3D 建模背景的人也能比较容易地加载 /编辑 /导出 /展示 3D 模型。基于企业级项目代码开发的标准规范，如果你正在开发自己的第一个企业级Three.js 项目那么这个项目的代码设计思路将会是一个不错的参考

注意⚠️：作者本人的3D开源项目，毛遂自荐一下，哈哈哈哈

界面：