提交您的產品 
Ai應用
Ai資訊
AI生圖
AI生視頻
開源AI應用平臺
iCraft Editor
iCraft Editor簡介
iCraft Editor 是一款網頁版 3D 架構圖編輯工具，主打用三維空間展示復雜系統架構，幫開發者、架構師、產品經理等更直觀地理解并溝通系統結構。相比傳統 2D 圖表，它的可視化效果更強，交互體驗更好，是設計復雜系統的好幫手。
iCraft Editor核心功能
便捷的 3D 設計工具：iCraft Editor 提供豐富的 3D 模型庫（包含服務器、數據庫、網絡設備等常用組件）和示例模板，支持 2D 圖表一鍵轉 3D，能幫用戶快速開始設計。編輯器有網格自動吸附、元素自動堆疊功能，連線更方便，能節省大量設計時間。
沉浸式 3D 呈現：通過 3D 全景技術，用戶可以自由旋轉、縮放、拖拽模型，從不同角度查看架構細節；支持動畫效果（比如管道流動、物體動態），能讓設計理念更生動；子場景無縫切換功能能把復雜設計拆成多個層次（像前端、后端、基礎設施），讓信息展示更有條理。
數字孿生與實時同步：iCraft Editor 提供 Web 渲染組件（JavaScript SDK），能輕松嵌入網頁應用，通過 SDK 控制 3D 元素狀態（比如高亮異常節點）；支持實時數據同步，可以把系統里的服務器 CPU 使用率、網絡流量等數據映射到 3D 架構圖上，直觀展示系統運行狀態，方便快速發現異常。
強大的編輯與擴展能力：iCraft Editor支持導入 GLB、glTF、OBJ 等多種 3D 文件格式，用戶可以上傳自定義模型（比如企業 logo、專用設備），擴展設計資源；提供網格自動吸附、元素自動堆疊等功能，能提升繪圖準確度和效率。
iCraft Editor使用場景
軟件架構設計：幫架構師清晰展示系統各組件及相互關系，方便團隊理解溝通。
系統部署維護：讓運維人員直觀了解服務器、網絡設備等的部署和運行狀態。
培訓交流：通過生動的 3D 架構圖和動畫，讓學員更容易理解復雜概念。
工業設計：適合工業設計師使用，提供精準 3D 建模工具。
電子商務：電商用戶能創建吸引人的 3D 產品展示。
教育演示：教育工作者可以制作生動的 3D 教學材料。
iCraft Editor使用方法
在線使用
訪問官網：直接打開 iCraft Editor 官網：https://icraft.design/，不用安裝軟件。
創建項目：在iCraft Editor官網新建項目或打開已有項目。
添加元素：用工具欄里的工具添加 3D 模型（比如服務器、網絡設備）。
調整布局：通過拖拽、旋轉操作調整元素位置和方向，還能設置大小、顏色等屬性。
添加連接線：根據元素關系添加連接線，表示它們的連接。
添加文字說明：給元素添加文字，方便觀眾理解。
保存導出：設計完成后，可以保存到云端，也能導出為 .iplayer 文件，用于嵌入其他項目或離線查看。
本地使用
準備環境：確保系統安裝了 Node.js 和 Git。
克隆項目：用命令 git clone https://github.com/gantFDT/icraft.git把項目下載到本地。
安裝依賴：進入項目文件夾，運行 npm install安裝所需依賴。
啟動項目：在項目文件夾里運行 npm start啟動項目，然后用瀏覽器打開 http://localhost:3000查看。
編輯保存：在本地編輯器里設計，完成后保存項目。
嵌套子場景的使用
進入子場景：選一個元素，點擊懸浮工具條上的子場景按鈕，進入該元素的子場景。
編輯子場景：在子場景里添加元素、調整位置、連線等，直到滿足需求。
返回主場景：子場景編輯完成后，返回主場景繼續調整整體架構圖。
集成到其他項目
安裝前端組件：如果要把 iCraft Editor 制作的 3D 場景嵌入 React 項目，運行命令 pnpm install @icraft/player-react --save安裝組件庫。
集成代碼：在項目里用對應代碼集成 3D 場景。
import { ICraftPlayer } from "@icraft/player-react";
export default function MyScene() {
return <ICraftPlayer src='your-scene.iplayer' />;
}其中 your-scene.iplayer 是從 iCraft Editor 中導出的 3D 場景文件。
iCraft Editor項目地址：https://github.com/gantFDT/icraft
