🧊 TvT.js
English | 简体中文
An AI-Collaborative Open-Source Web 3D Ecosystem
From requirements and Spec-driven AI development to image-to-3D generation, scene editing, and plugin-based delivery, TvT.js helps turn 3D ideas into real projects instead of one-off demos.
TvT.js is an open-source Web 3D engineering ecosystem by ICEGL. Built on Three.js, Vue 3, TresJS, and Fes.js, it is designed for digital twins, industrial visualization, online 3D editors, and plugin-based project delivery. It is permanently open-source and free for commercial use.
Requirement → Spec Constraints → AI-Assisted Implementation → Scene Validation → Plugin or Source-Code Delivery
Project Info
If this project helps you, please click the "Star⭐" button in the upper-right corner. Your support is what keeps this project moving forward. Thank you!
Since mid-October 2025, the project has fully upgraded its core dependencies, including Vue 3, Tres V5, Fes V4, Cientos V4, and Three.js (r17x → r18x).
If you are upgrading from
tvt.jsV4, please refer to the migration guide: icegl.cn/ask/article/22769
Legacy V4 branch: tres-v4_fes-v3
🤖 AI Collaboration: From a Requirement to a Deliverable 3D Project
AI is now part of two connected workflows in TvT.js: 3D content creation and engineering development. It can help generate models and scene concepts, while also supporting requirements analysis, plugin implementation, and ongoing changes. Scene configuration, plugin contracts, and versioned Specs connect these workflows so that people and AI can work from the same project context.
| Where AI Participates | TvT.js Practice | Outcome |
|---|---|---|
| Requirements and architecture | The openspec/ baseline captures framework rules, plugin contracts, runtime modes, and integration boundaries; larger changes can be described through proposal, spec, design, and tasks documents |
Traceable requirements, verifiable behavior, and bounded changes |
| Engineering collaboration | The tvt-js-plugin-builder AI skill captures conventions for plugin directories, routes, assets, dependencies, and cross-platform integrations |
AI implements within project conventions instead of producing disposable code |
| 3D content creation | The open-source Tencent Hunyuan3D workflow can be deployed locally to generate 3D models from images and bring them into TvT.js | 3D assets that remain editable and ready for scene integration |
| Scene authoring | The zone scene editor can work with AI-generated assets and continues to explore MCP + LLM text-to-scene generation | A path from natural language or generated assets to editable visual scenes |
| Reuse and delivery | A shared plugin contract, dynamic component service, scene configuration, and source export workflow | AI-assisted results that remain reviewable, reusable, maintainable, and deliverable |
This is more than adding an AI button beside a 3D framework. Specs define what the result must satisfy; AI skills explain how work should be completed in this repository; plugins and editors then carry generated results into a maintainable delivery workflow.
- Explore the AI Collaboration and Spec Workflow
- View the TvT.js OpenSpec Baseline
- View the TvT.js Plugin Development AI Skill
- Try Hunyuan3D Image-to-3D
- Open the Zone Scene Editor
Capability boundaries: Image-to-3D requires a separately deployed model service, model weights, and suitable hardware. MCP + LLM text-to-scene generation remains an area of ongoing exploration. AI can accelerate generation, modification, and review, but business meaning, visual quality, performance budgets, licensing boundaries, and final releases still require human judgment.
🇨🇳 Web 3D Visualization Framework for Domestic / Xinchuang Environments 🚩
For full localization and compatibility details, see the documentation: Details
- Support for domestic hardware platforms
- Support for domestic operating systems and browsers
- Domestic-friendly development and deployment environments
- You can confidently use tvt.js as the frontend foundation for localized 3D visualization projects and digital twin platforms.
- Built on a fully open-source dependency stack, with independent software intellectual property and software copyright registration, open-source and free for commercial use.
Technical Foundations & Ecosystem @ThreeJS @Vue3.x @TresJS @FesJS
Built by ICEGL. Permanently open-source, free for commercial use, and continuously evolving. Star ⭐ the project to follow an open Web 3D ecosystem built for the AI era.
The project is built on four open-source foundations. Plugins, editors, dynamic components, and an AI collaboration workflow extend this foundation from rendering into project delivery:
| Ecosystem | Description |
|---|---|
| 🎲 ThreeJS | |
| A widely used JavaScript 3D library for browser rendering. | |
| 🍀 Vue3.x | |
| A modern frontend framework that is approachable, high-performance, and flexible across many Web use cases. | |
| ⚡ TresJS | |
| A declarative Vue 3 way to build Three.js-powered 3D applications on the frontend. | |
| 🌈 Fes.js | |
| Provides the routing, layouts, data models, permissions, internationalization, and API conventions needed to deliver production applications. |
✨ Dynamic Component Publishing & Loading Service: 🌏 dcser.icegl.cn
A dynamic component publishing and loading service built around the TvT.js ecosystem for flexible modular application delivery. Component requirements can use Specs to define registration formats, parameter contracts, previews, and editor compatibility, allowing both human-built and AI-assisted components to be published independently, loaded remotely, configured, and evolved over time.
🏕 Preview: 🌏 opensource.icegl.cn
- If needed, you can also use the GitHub Pages mirror: 🌏 https://hawk86104.github.io
- Full-case WeChat Mini Program ecosystem: 🌏 Open in WeChat
- Scan the QR code to browse the full Mini Program demo set:
Featured Online Cases
[Online 3D Scene Editor](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index)
Free source export + secondary development
[](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index)
[Smart Server Room](https://www.icegl.cn/tvtstore/zoneMachinRoom)
Project-ready output from the editor
[](https://www.icegl.cn/tvtstore/zoneMachinRoom)
[Tech Stack Topology](https://opensource.icegl.cn/#/plugins/zoneFreeScene/freeTvtStack)
Project-ready output from the editor
[](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index?sceneConfig=freeTvtStack)
[Hunyuan World](https://opensource.icegl.cn/#/plugins/zoneFreeScene/freeHYworld)
Project-ready output from the editor
[](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index?sceneConfig=freeHYworld)
[Refining Smart Factory Visualization](https://www.icegl.cn/tvtstore/zoneRefiningIndustry)
Project-ready output from the editor
[](https://oss.icegl.cn/p/zoneRefiningIndustry/#/plugins/zoneRefiningIndustry/index)
[Smart Office Space](https://www.icegl.cn/tvtstore/zoneOfficeFloor)
Project-ready output from the editor
[](https://oss.icegl.cn/p/zoneOfficeFloor/#/plugins/zoneOfficeFloor/index)
[UAV Fleet Visualization](https://www.icegl.cn/tvtstore/zoneLowAltitudeUAV.html)
Project-ready output from the editor
[](https://www.icegl.cn/tvtstore/zoneLowAltitudeUAV.html)
[Low-Poly Refinery](https://opensource.icegl.cn/#/#zoneFreeScene)
Free case
[](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index?sceneConfig=freeRefiningIndustry)
[Low-Poly Server Room](https://www.icegl.cn/tvtstore/zonePixelLowMachinRoom)
Project-ready output from the editor
[](https://oss.icegl.cn/p/zonePixelLowMachinRoom/#/plugins/zonePixelLowMachinRoom/index)
[Plastic Products Factory 3D](https://www.icegl.cn/tvtstore/zonePlasticProducts)
Project-ready output from the editor
[](https://oss.icegl.cn/p/zonePlasticProducts/#/plugins/zonePlasticProducts/secondaryCoding)
[Smart Warehouse Management](https://www.icegl.cn/tvtstore/zoneSmartWarehouse)
Project-ready output from the editor
[](https://oss.icegl.cn/p/zoneSmartWarehouse/#/plugins/zoneSmartWarehouse/secondaryCoding)
[Ocean Shipping Visualization](https://opensource.icegl.cn/#/#zoneFreeScene)
Free case
[](https://zone3deditor.icegl.cn/#/plugins/zone3Deditor/index?sceneConfig=freeShipSea)
[Financial Report Analysis 3D Chart](https://txwikichart.icegl.cn/#/plugins/txWikiChart/columnar)
Project-ready output from the editor
[](https://txwikichart.icegl.cn/#/plugins/txWikiChart/columnar)
[Paramecium Animation Editor](https://animationeditor.icegl.cn/#/plugins/animationEditor/index)
Online animation editor
[](https://animationeditor.icegl.cn/#/plugins/animationEditor/index)
[Map Space Editor](https://www.icegl.cn/tvtstore/gisPlaneEditor)
A GIS editor for projected-map scenes
[](https://gisplaneeditor.icegl.cn/#/plugins/gisPlaneEditor/index)
[Multi-Set Oblique Photography 3D](https://gisplaneeditor.icegl.cn/#/plugins/gisPlaneEditor/index?sceneConfig=多套倾斜摄影3D)
Project-ready output from the editor
[](https://gisplaneeditor.icegl.cn/#/plugins/gisPlaneEditor/preview?sceneConfig=多套倾斜摄影3D)
Tech stack topology example with full project source: Source file
You can reopen this scene in the online editor and export the source again for secondary development: Open in zone3Deditor
Because the project is updated and rebuilt frequently, please clear your browser cache if you encounter access or asset-loading issues.
More demos are available on the preview site.
If you like the project, please support it with a quick three-step combo: Follow 💛 Like ⭐ Fork 👣
✅ Quick Start
Node.js >= 20.18 is recommended.
| Step | Command / Action | Description |
|---|---|---|
| 1 | git clone this repository, or download it directly |
Get the project source code |
| 2 | cd into the project root |
Enter the project directory |
| 3 | yarn |
Install dependencies |
| 4 | yarn pre.dev |
Debug the preview workspace |
| 5 | yarn dev |
Debug your own project workspace |
| 6 | yarn pre.build |
Build the preview workspace |
| 7 | yarn build |
Build your own project workspace |
| 8 | yarn pre.dev.one |
Preview only one specific example or plugin |
| 9 | yarn pre.build.one |
Build one specific example or plugin, keeping only configured dependency plugin assets and removing the rest |
| 10 | yarn both |
Run dev and pre.dev at the same time so you can develop your project while comparing against examples and plugins |
📖 Documentation
User Guide: 🌏 docs.icegl.cn
Recommended starting point: 🤖 AI Collaboration and Spec Workflow. It covers image-to-3D generation, the OpenSpec baseline, the AI plugin development skill, and a workflow in which requirements become constraints before implementation moves toward delivery.
[3D Editor: [📊 Native editor + plugin generator]](https://docs.icegl.cn/docs/three-vue-tres/editor/threeeditor.html)
[UI Editor: [📊 GoView export + config import component]](https://docs.icegl.cn/docs/three-vue-tres/editor/goview.html)
[](https://docs.icegl.cn/docs/three-vue-tres/editor/threeeditor.html)
[](https://docs.icegl.cn/docs/three-vue-tres/editor/goview.html)
[uniapp Mini Program Ecosystem: [One codebase across platforms]](https://docs.icegl.cn/docs/three-vue-tres/frontend/uniapp.html)
[qiankun Micro Frontend: [Integrate quickly into your existing project]](https://docs.icegl.cn/docs/three-vue-tres/qiankun/introduction.html)
[](https://docs.icegl.cn/docs/three-vue-tres/frontend/uniapp.html)
[](https://docs.icegl.cn/docs/three-vue-tres/qiankun/introduction.html)
🧩 Rich Plugin Marketplace: 🌏 tvtstore
🌏 www.icegl.cn/tvtstore brings together a wide range of project scenarios and capabilities. Plugins are a core part of the ICE community ecosystem and provide an engineering boundary between AI-assisted development, online editors, and project delivery. Complete applications, reusable components, AI-assisted features, and source exported from scene editors are all distributed through the marketplace as plugins.
[Plugin Marketplace](https://www.icegl.cn/tvtstore)
[Become an Author and Join Us](https://www.icegl.cn/p/tvtdeveloper)
[](https://www.icegl.cn/tvtstore)
[](https://www.icegl.cn/p/tvtdeveloper)
❓ Feedback & Support
If you run into any issues while using the project, feel free to reach out through the channels below.
Q&A Community: ICE Graphics Community icegl.cn
Community Contributors and Experts: Ask the experts
You are also welcome to join our WeChat and QQ groups. Some groups may already be full, but we are always happy to connect and discuss WebGL together.
WeChat Mini Program Ecosystem
WeChat Group
[QQ Group: 795714357](https://qm.qq.com/q/34V4hTtvbq)
Official Account: ICE Graphics Community
[](https://qm.qq.com/q/34V4hTtvbq)
⭐ Star History
™️ Copyright Information
This project is open-sourced under the Apache License 2.0, is free to use permanently, and supports commercial use.
If you use this project commercially, please comply with the Apache License 2.0 and retain the author attribution and technical support statement.
-
Secondary Development and Copyright Notice
When building on top of this project, including but not limited to feature extensions, UI modifications, or custom adaptations, you must not remove, alter, or hide the copyright notice, author statement, or project source attribution in the header of TvT.js source files, whether your use is commercial or non-commercial.
-
Allowed Commercial Use and Restrictions
You may use this project as the foundation for commercial solutions that are primarily based on your own independently developed core features or products, including paid services and software products.
You may not simply re-open-source this project with only minor changes and charge for it, or package an almost unmodified version as a paid product for sale.
-
Third-Party Components
Copyright and license information for third-party source code and binary files included in this project are marked separately. Please comply with their respective open-source licenses.
Copyright © 2022-2026 by 🧊icegl (https://www.icegl.cn)
All rights reserved.