Context Graph VS Code Extension

Visualize and explore your Python codebase with interactive dependency graphs—right inside VS Code.

What is Context Graph?

Context Graph helps you visualize and explore your project's dependency graph directly within VS Code. Understand codebase's structure, relationships between modules, identify potential issues, and navigate your project more efficiently. Currently supports Python projects and targeted metrics, with more languages and features coming soon.

Key Features

• Automatic Dependency Graphs:
  • Parse Python projects to extract modules, classes, functions, and their relationships (imports, calls, inheritance).
  • Visualize your codebase as an interactive graph.
• Graph Analytics:
  • Centrality analysis (degree, betweenness, closeness, PageRank, HITS).
  • Clustering and similarity analysis for code structure insights.
  • Shortest path and dependency tracing between symbols.
• Interactive Visualization:
  • D3.js-powered, animated force-directed layout.
  • Pan, zoom, drag, and select nodes/edges.
  • Hover for symbol previews, click for details.
  • Filter and focus on specific node types or clusters.
• Seamless Navigation:
  • Jump to code directly from the graph.
  • Open files and symbols in VS Code with a click.
• Real-Time Updates:
  • Graphs update as your code changes.
• Works with Any Python Project:
  • Analyze any folder or workspace—no configuration required.

How to Use

1. Install the Extension:
   • Find "Context Graph" in the VS Code Marketplace or install from a VSIX file.
2. Open a Python Project:
   • Open any folder or workspace containing Python code.
3. Generate a Dependency Graph:
   • Open Context Graph view from the activity bar or bottom panel.
   • Use the "Generate Graph" button in the sidebar
   • Or Right-click a folder in the Explorer and select "Generate Dependency Graph".
   • Or use the Command Palette (Ctrl+Shift+P or Cmd+Shift+P) and search for Context Graph commands.
4. Explore the Graph:
   • Use the sidebar or panel to view and interact with your code’s structure.
   • Click nodes to see details, run analytics, and jump to code.

Why Use Context Graph?

• Quickly understand unfamiliar codebases
• Discover hidden dependencies and architecture issues
• Improve code navigation and onboarding
• Analyze and refactor large projects with confidence