# node_editor

**Repository Path**: smart-os/node_editor

## Basic Information

- **Project Name**: node_editor
- **Description**: base节点编辑器，拥有vue2以及vue3版本
- **Primary Language**: JavaScript
- **License**: Apache-2.0
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-04-09
- **Last Updated**: 2025-04-15

## Categories & Tags

**Categories**: Uncategorized

**Tags**: JavaScript, Vue

## README

# Node Tree 项目集合

这是一个包含多个基于Vue的可视化编辑器项目集合，每个子项目都专注于不同的可视化编辑场景。

## 项目概览

### Node Editor（Vue 2版本）
- 基于Vue 2.7构建的可视化节点编辑器
- 支持节点创建、连接、拖拽等基础功能
- 适用于构建流程图、数据流图等可视化应用
- 提供画布缩放、平移等控制功能

### Node Editor V3（Vue 3版本）
- 基于Vue 3 Composition API的升级版节点编辑器
- 使用Vite构建，集成Pinia状态管理
- 支持实时数据流计算与验证
- 包含完整的单元测试

### Mind Map（思维导图）
- 基于Vue 3的思维导图应用
- 支持节点创建、编辑和拖拽
- 提供子主题添加功能
- 包含画布缩放和平移功能

### Blueprint Editor（蓝图编辑器）
- 基于Vue 3和Vite的蓝图编辑器
- 专注于可视化编程场景
- 使用最新的`<script setup>`语法

## 技术栈概述

- **Vue生态**：横跨Vue 2.7和Vue 3，展示了不同版本的实现方案
- **构建工具**：使用Vite和Vue CLI
- **状态管理**：集成Pinia（在V3版本中）
- **可视化渲染**：使用SVG进行节点渲染
- **测试工具**：集成Vitest进行单元测试

## 快速开始

每个项目都可以通过以下步骤运行：

```bash
# 安装依赖
npm install

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build
```

## 项目特点

- **模块化设计**：每个项目都是独立的模块，可以单独使用和开发
- **渐进式升级**：从Vue 2到Vue 3的演进，展示了不同的实现方案
- **场景覆盖**：涵盖了节点编辑、思维导图、蓝图编程等多个可视化场景
- **技术创新**：采用最新的前端技术栈，保持代码的现代性和可维护性