思维星球图谱可视化工具

English | 简体中文

一个用于MCP Knowledge Graph Memory Server生成的 json lines 文件可视化工具

功能特点

数据可视化

• 基于D3.js实现的力导向图布局
• 节点和关系的可视化展示
• 支持节点拖拽和画布缩放
• 自动适应窗口大小

搜索功能

• 实时搜索节点
• 支持节点名称、类型和观察记录的多字段匹配
• 搜索结果预览和快速定位
• 节点高亮显示

节点详情

• 侧边栏展示节点详细信息
• 显示相关观察记录
• 高亮相关连接

暗色主题

• 精心设计的深色界面
• 柔和的配色方案
• 良好的可读性

技术栈

• HTML5
• CSS3
• JavaScript (ES6+)
• D3.js (可视化库)

快速开始

1. 克隆仓库

git clone https://github.com/yourusername/mind-sphere-graph.git
cd mind-sphere-graph

2. 打开项目

• 使用浏览器直接打开 index.html 文件
• 或者使用本地服务器运行项目，例如：

python -m http.server 8000

然后访问 http://localhost:8000

数据格式

项目使用JSON Lines格式的数据文件，每行包含一个独立的JSON对象。支持两种类型的数据：

实体（Entity）

{
    "type": "entity",
    "name": "节点名称",
    "entityType": "节点类型",
    "observations": ["观察记录1", "观察记录2"]
}

关系（Relation）

{
    "type": "relation",
    "from": "源节点名称",
    "to": "目标节点名称",
    "relationType": "关系类型"
}

使用说明

1. 数据导入

   • 点击"上传JSON文件"按钮
   • 选择符合格式的JSON Lines文件
   • 等待数据加载和图谱生成

2. 图谱交互

   • 拖拽节点调整位置
   • 使用鼠标滚轮或触控板进行缩放
   • 点击节点查看详细信息
   • 拖动画布调整视角

3. 搜索功能

   • 在顶部搜索框输入关键词
   • 实时显示匹配的节点列表
   • 点击搜索结果定位到目标节点
   • 按Enter键快速定位当前选中节点

浏览器兼容性

• Chrome (推荐)
• Firefox
• Safari
• Edge

贡献指南

欢迎提交问题和改进建议！

1. Fork 项目
2. 创建新的特性分支 (git checkout -b feature/AmazingFeature)
3. 提交更改 (git commit -m 'Add some AmazingFeature')
4. 推送到分支 (git push origin feature/AmazingFeature)
5. 打开一个 Pull Request

许可证

MIT License

项目结构

mind-sphere-graph/
├── index.html          # 主页面
├── style.css          # 样式文件
├── script.js          # 主要逻辑
└── README.md          # 项目文档

致谢

• knowledge-graph-memory-server
• D3.js - 数据可视化库