Skip to content

Commit 0396d29

Browse files
michaeloboyleclaude
andcommitted
feat: Add vis.js graph visualization examples
Added interactive visualization capabilities with vis.js: New Files: - examples/visualization-browser.html (15KB) - Standalone interactive demo - 4 pre-loaded example datasets (job search, social, knowledge, dependencies) - Color-coded node types with hover details - Interactive controls: zoom, pan, reset view - Real-time graph statistics panel - No backend required - runs entirely in browser - examples/visualization-export.ts (204 lines) - Export to vis.js format - Convert sqlite-graph data to vis.js JSON format - Generate standalone HTML visualizations - Export raw JSON for custom visualizations - Job search graph example with 11 nodes, 14 edges - Demonstrates graph traversal queries for filtering Dependencies: - [email protected] (dev dependency) - [email protected] (dev dependency) Use Cases: - Visual debugging of graph structures - Interactive exploration of relationships - Demo and presentation tool - Export data for external visualization tools Run Examples: ```bash # Generate visualization from graph data npx ts-node examples/visualization-export.ts # Open in browser open examples/job-search-visualization.html open examples/visualization-browser.html ``` Features: ✅ Interactive node dragging and zooming ✅ Automatic graph layout with physics simulation ✅ Color-coded node types ✅ Edge labels showing relationship types ✅ Click nodes to see properties ✅ Export to JSON for custom tools ✅ Standalone HTML (no server needed) 🚀 Generated with Claude Code Co-Authored-By: Claude <[email protected]>
1 parent 5362e10 commit 0396d29

File tree

4 files changed

+713
-1
lines changed

4 files changed

+713
-1
lines changed

examples/.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
*.html
2+
*.json

0 commit comments

Comments
 (0)