更新README文档

- 更新可视化编辑功能描述,突出Markdown编辑器特性
- 详细说明Markdown渲染引擎技术栈(Marked.js + Prism.js + KaTeX)
- 添加富媒体内容支持说明(图片、表格、数学公式等)
- 更新操作流程,包含图片预览和SVG导出功能
- 增加Markdown渲染引擎专门章节
- 完善快捷键操作说明,包含图片预览功能
- 更新项目优化部分,强调技术栈统一性
This commit is contained in:
lixinran 2025-10-11 13:49:03 +08:00
parent df89a448a4
commit 1c838a9aeb
1 changed files with 27 additions and 12 deletions

View File

@ -15,8 +15,10 @@
- **拖拽操作**: 支持节点拖拽、移动、编辑 - **拖拽操作**: 支持节点拖拽、移动、编辑
- **实时保存**: 自动保存编辑内容到数据库 - **实时保存**: 自动保存编辑内容到数据库
- **缩放控制**: 支持思维导图缩放和居中显示 - **缩放控制**: 支持思维导图缩放和居中显示
- **Markdown支持**: 节点内容支持Markdown语法渲染 - **Markdown编辑器**: 基于Marked.js + Prism.js + KaTeX的现代化markdown渲染引擎
- **表格渲染**: 支持Markdown表格在思维导图中的显示 - **富媒体内容**: 支持图片、表格、数学公式、代码高亮等多种内容类型
- **图片预览**: 支持双击或右键预览图片细节
- **SVG导出**: 高质量矢量图导出,支持富媒体内容
### 💾 数据管理 ### 💾 数据管理
- **云端存储**: 思维导图数据持久化存储 - **云端存储**: 思维导图数据持久化存储
@ -44,15 +46,25 @@
- **思维导图**: MindElixir 3.0.0 (自定义增强版本) - **思维导图**: MindElixir 3.0.0 (自定义增强版本)
- **文件处理**: mammoth.js (DOCX), pdfjs-dist (PDF) - **文件处理**: mammoth.js (DOCX), pdfjs-dist (PDF)
- **HTTP客户端**: Axios 1.5.0 - **HTTP客户端**: Axios 1.5.0
- **Markdown处理**: marked 16.2.1 + 自定义渲染器 - **Markdown引擎**: Marked.js 16.2.1 + 自定义渲染器
- **数学公式**: KaTeX 0.16.22 - **数学公式**: KaTeX 0.16.22 (LaTeX表达式支持)
- **代码高亮**: PrismJS 1.30.0 - **代码高亮**: PrismJS 1.30.0 (多语言语法着色)
- **富媒体渲染**: 统一的dangerouslySetInnerHTML机制
### AI内容分析 ### AI内容分析
- **TypeScript**: 类型安全的Markdown转JSON转换 - **TypeScript**: 类型安全的Markdown转JSON转换
- **流式处理**: 支持大文档的流式AI分析 - **流式处理**: 支持大文档的流式AI分析
- **多模型支持**: 支持多种AI模型切换 - **多模型支持**: 支持多种AI模型切换
### Markdown渲染引擎
- **核心引擎**: Marked.js 16.2.1 - 快速、轻量的markdown解析器
- **语法高亮**: PrismJS 1.30.0 - 支持JavaScript、CSS、JSON、Python、SQL等
- **数学公式**: KaTeX 0.16.22 - 完整的LaTeX数学表达式支持
- **自定义渲染**: 针对思维导图优化的图片、表格渲染器
- **统一机制**: 所有富媒体内容使用dangerouslySetInnerHTML统一渲染
- **响应式设计**: 图片、表格等元素自适应容器大小
- **交互功能**: 图片预览、hover效果、SVG导出支持
## 🚀 快速开始 ## 🚀 快速开始
### 环境要求 ### 环境要求
@ -159,7 +171,7 @@ MindMap/
│ │ ├── lib/ # 第三方库 │ │ ├── lib/ # 第三方库
│ │ │ └── mind-elixir/ # MindElixir库项目使用版本 │ │ │ └── mind-elixir/ # MindElixir库项目使用版本
│ │ ├── utils/ # 工具函数 │ │ ├── utils/ # 工具函数
│ │ │ └── markdownRenderer.js # Markdown渲染 │ │ │ └── markdownRenderer.js # Markdown渲染引擎(Marked.js + Prism.js + KaTeX)
│ │ ├── App.vue # 主应用组件 │ │ ├── App.vue # 主应用组件
│ │ └── main.js # 应用入口 │ │ └── main.js # 应用入口
│ ├── test-*.html # 功能测试文件 │ ├── test-*.html # 功能测试文件
@ -371,16 +383,17 @@ server {
### 基本操作流程 ### 基本操作流程
1. **上传文档**在AI侧边栏中上传DOCX、PDF、TXT或MD文件 1. **上传文档**在AI侧边栏中上传DOCX、PDF、TXT或MD文件
2. **AI分析**系统自动调用AI服务分析文档结构 2. **AI分析**系统自动调用AI服务分析文档结构,识别图片、表格等富媒体内容
3. **生成思维导图**AI将文档转换为结构化的思维导图 3. **生成思维导图**AI将文档转换为结构化的思维导图,支持图片、表格、数学公式等
4. **编辑调整**:在可视化界面中拖拽、编辑节点 4. **编辑调整**:在可视化界面中拖拽、编辑节点,支持富媒体内容预览
5. **保存分享**:思维导图自动保存到数据库 5. **导出分享**支持SVG矢量图导出和JSON数据交换
### 快捷键操作 ### 快捷键操作
- `Ctrl + 滚轮`:缩放思维导图 - `Ctrl + 滚轮`:缩放思维导图
- `双击节点`:编辑节点内容 - `双击节点`:编辑节点内容
- `右键节点`:显示操作菜单 - `双击图片节点`:预览图片细节
- `右键节点`:显示操作菜单(包含图片预览选项)
- `拖拽节点`:移动节点位置 - `拖拽节点`:移动节点位置
- `Ctrl + E`:展开/折叠节点 - `Ctrl + E`:展开/折叠节点
- `Alt + F`:聚焦/取消聚焦节点 - `Alt + F`:聚焦/取消聚焦节点
@ -407,7 +420,9 @@ MIT License - 详见 [LICENSE](LICENSE) 文件
- ✅ **删除冗余文件**: 移除了重复的测试文件和调试文件 - ✅ **删除冗余文件**: 移除了重复的测试文件和调试文件
- ✅ **保留核心功能**: 保留了所有必要的测试和调试工具 - ✅ **保留核心功能**: 保留了所有必要的测试和调试工具
- ✅ **优化项目结构**: 清晰分离了开发版本和生产版本 - ✅ **优化项目结构**: 清晰分离了开发版本和生产版本
- ✅ **MindElixir增强**: 集成了自定义的Markdown和表格渲染功能 - ✅ **MindElixir增强**: 集成了自定义的Markdown渲染引擎
- ✅ **富媒体支持**: 统一的图片、表格、数学公式渲染机制
- ✅ **技术栈统一**: 所有富媒体内容使用相同的markdown编辑器
### 文件结构优化 ### 文件结构优化
- **保留**: `../mind-elixir-core-master/` - 完整的源码和文档(平级目录) - **保留**: `../mind-elixir-core-master/` - 完整的源码和文档(平级目录)