WebCAD 是一个基于 Web 的 CAD 图纸在线渲染和编辑系统,支持 DXF/DWG 文件的上传、解析、可视化和编辑。
- Python 3.11
- FastAPI - 现代化的 Python Web 框架
- ezdxf - DXF 文件解析库
- uvicorn - ASGI 服务器
- React 19 - UI 框架
- TypeScript - 类型安全
- Vite - 构建工具
- Ant Design 6 - UI 组件库
- Zustand - 状态管理
- ✅ DXF/DWG 文件上传
- ✅ CAD 图纸在线渲染
- ✅ 图层管理(显示/隐藏、锁定/解锁)
- ✅ 设备模板管理
- ✅ 图元属性查看和编辑
- ✅ 块定义管理
- ✅ 实时渲染进度显示
WebCAD/
├── backend/ # 后端服务
│ ├── app/
│ │ ├── api/ # API 路由
│ │ │ └── routes/ # 路由模块
│ │ │ ├── files.py # 文件上传
│ │ │ ├── dxf.py # DXF 解析
│ │ │ └── devices.py # 设备管理
│ │ ├── core/ # 核心功能
│ │ │ ├── dxf_parser.py # DXF 解析器
│ │ │ └── dwg_converter.py # DWG 转换器
│ │ ├── models/ # 数据模型
│ │ │ ├── document.py # 文档模型
│ │ │ ├── entities.py # 图元模型
│ │ │ └── layers.py # 图层模型
│ │ ├── services/ # 业务逻辑
│ │ │ ├── dxf_service.py # DXF 服务
│ │ │ └── file_service.py # 文件服务
│ │ ├── config.py # 配置文件
│ │ └── main.py # 应用入口
│ ├── requirements.txt # Python 依赖
│ └── Dockerfile # 后端容器配置
│
├── frontend/ # 前端应用
│ ├── src/
│ │ ├── components/ # React 组件
│ │ │ ├── Canvas/ # 画布渲染
│ │ │ ├── Panels/ # 侧边面板
│ │ │ ├── Toolbar/ # 工具栏
│ │ │ ├── StatusBar/ # 状态栏
│ │ │ └── LoadingOverlay/ # 加载提示
│ │ ├── core/ # 渲染引擎
│ │ ├── services/ # API 服务
│ │ ├── stores/ # 状态管理
│ │ ├── types/ # TypeScript 类型定义
│ │ ├── utils/ # 工具函数
│ │ └── App.tsx # 主应用组件
│ ├── package.json # 前端依赖
│ └── Dockerfile # 前端容器配置
│
├── uploads/ # 上传文件存储目录
├── samples/ # 示例文件
├── docker-compose.yml # Docker Compose 配置
└── README.md # 项目文档
- 克隆项目
git clone <repository-url>
cd WebCAD- 配置环境变量(可选)
# 创建 .env 文件
cat > .env << EOF
# 后端API地址(格式: http://服务器IP:端口/api)
API_BASE=http://localhost:10103/api
# 墙体识别API地址(可选)
WALL_DETECT_API=
EOF- 启动服务
docker-compose up -d- 访问应用
- 前端: http://localhost:10102
- 后端API: http://localhost:10103
- API文档: http://localhost:10103/docs
- 创建虚拟环境
python3 -m venv .venv
source .venv/bin/activate # Windows: .venv\Scripts\activate- 安装依赖
cd backend
pip install -r requirements.txt- 启动后端服务
cd ..
uvicorn backend.app.main:app --reload --port 10103- 安装依赖
cd frontend
npm install- 启动开发服务器
npm run dev- 构建生产版本
npm run buildPOST /api/files/upload- 上传文件GET /api/files/{file_id}- 获取文件信息DELETE /api/files/{file_id}- 删除文件
GET /api/dxf/{file_id}/parse- 解析 DXF 文件GET /api/dxf/{file_id}/layers- 获取图层列表GET /api/dxf/{file_id}/blocks- 获取块定义列表
GET /api/devices/templates- 获取设备模板列表POST /api/devices/templates- 创建设备模板PUT /api/devices/templates/{template_id}- 更新设备模板DELETE /api/devices/templates/{template_id}- 删除设备模板
完整的 API 文档请访问: http://localhost:10103/docs
配置文件: backend/app/config.py
class Settings(BaseModel):
app_name: str = "WebCAD"
debug: bool = True
upload_dir: str = "uploads"
max_file_size: int = 50 * 1024 * 1024 # 50MB
allowed_extensions: set = {".dxf", ".dwg"}
oda_converter_path: str = "/Applications/ODAFileConverter.app/Contents/MacOS/ODAFileConverter"前端支持通过环境变量配置后端地址:
API_BASE- 后端 API 地址WALL_DETECT_API- 墙体识别 API 地址(可选)
Docker 部署时,这些配置会在运行时动态注入到 window.__API_BASE__ 和 window.__WALL_DETECT_API__。
- 前端: 10102
- 后端: 10103
可以通过修改 docker-compose.yml 中的端口映射来更改。
- 上传的文件存储在
./uploads目录 - 示例文件存放在
./samples目录
- 后端遵循 PEP 8 规范
- 前端使用 ESLint 和 TypeScript 严格模式
最近的提交记录:
eaea8021 支持从环境变量读取API地址,优化Docker配置
f72bd270 优化
b23ff478 优化
27a25693 添加 Docker 支持,包括 Dockerfile 和 docker-compose.yml
7d014ad8 修复异常加载数据
A: 当前最大文件限制为 50MB,可以在 backend/app/config.py 中修改 max_file_size 配置。
A: 目前支持 DXF 和 DWG 格式。DWG 文件需要安装 ODA File Converter 进行转换。
A: 使用 Docker Compose 部署最为简单,确保配置正确的环境变量和端口映射即可。
[待补充]
欢迎提交 Issue 和 Pull Request!
[待补充]