https://github.com/anku55/py_visualer
🔍 Interactive visualization tool that transforms Python codebases into beautiful, force-directed graphs. 🎨 Color-coded nodes show files, classes, functions, and imports with smart tooltips and real-time exploration. 📊 Analyze code complexity, maintainability, and documentation with an easy-to-use web interface powered by Flask and D3.js.
https://github.com/anku55/py_visualer
d3js flask javascript python website
Last synced: 2 months ago
JSON representation
🔍 Interactive visualization tool that transforms Python codebases into beautiful, force-directed graphs. 🎨 Color-coded nodes show files, classes, functions, and imports with smart tooltips and real-time exploration. 📊 Analyze code complexity, maintainability, and documentation with an easy-to-use web interface powered by Flask and D3.js.
- Host: GitHub
- URL: https://github.com/anku55/py_visualer
- Owner: Anku55
- License: mit
- Created: 2025-04-10T13:49:22.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-04-10T13:52:03.000Z (about 1 year ago)
- Last Synced: 2025-04-10T14:53:54.926Z (about 1 year ago)
- Topics: d3js, flask, javascript, python, website
- Language: Python
- Homepage:
- Size: 8.98 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Python Code Structure Visualizer 🔍
[](https://www.python.org/downloads/)
[](https://flask.palletsprojects.com/)
[](https://d3js.org/)
[](https://getbootstrap.com/)
[](LICENSE)
[](https://docs.python.org/3/library/venv.html)
An interactive visualization tool for Python codebases that creates beautiful, force-directed graphs showing the relationships between files, classes, functions, and imports.
## 🎥 Demo
*Interactive visualization of a Python codebase showing files, classes, and their relationships*
## ✨ Features
### 📊 Visualization
- **Interactive Graph** - Drag, zoom, and explore your code structure
- **Color-Coded Nodes** 🎨
- 🔷 Files (Blue)
- 🟢 Classes (Green)
- 🟡 Functions (Yellow)
- 🟠 Methods (Orange)
- ⚪ Imports (Gray)
### 🔄 Dynamic Updates
- **Real-time Cache Status** - Visual feedback in the navigation bar
- **Auto-clearing Visualizations** - Previous graphs are automatically removed
- **Manual Cache Clear** - Press `Ctrl + F5` to force clear the cache and refresh
### 🛠️ Analysis Features
- **Code Complexity** - Analyzes and displays code complexity metrics
- **Maintainability Index** - Shows code maintainability scores
- **Documentation Analysis** - Extracts and displays documentation info
### 🎯 Interactive Elements
- **Smart Tooltips** - Hover over nodes to see detailed information
- **Connection Highlighting** - See related nodes and connections on hover
- **Collapsible Sidebar** - Easy access to controls and legend
- **Zoom Controls** - Scroll to zoom, drag to pan
## 🚀 Getting Started
### Prerequisites
```bash
Python 3.8 or higher
pip (Python package manager)
```
### Installation
1. Clone the repository:
```bash
git clone https://github.com/Anku55/py_visualer.git
cd py_visualer
```
2. Set up a virtual environment:
```bash
# On Windows
python -m venv venv
.\venv\Scripts\activate
# On macOS/Linux
python3 -m venv venv
source venv/bin/activate
```
3. Install dependencies:
```bash
pip install -r requirements.txt
```
4. Run the application:
```bash
python app.py
```
5. Open in browser:
```
http://localhost:5000
```
### 🔒 Virtual Environment Tips
- **Creating New Environment**:
```bash
python -m venv venv # Creates a new virtual environment named 'venv'
```
- **Activation Commands**:
- Windows (PowerShell): `.\venv\Scripts\activate`
- Windows (Command Prompt): `venv\Scripts\activate.bat`
- macOS/Linux: `source venv/bin/activate`
- **Deactivation**:
```bash
deactivate # Use this command when you're done
```
- **Requirements**:
```bash
# After installing new packages, update requirements.txt:
pip freeze > requirements.txt
```
## 💡 Usage Tips
### 📁 File Upload
1. Click "Choose File" to select a Python file or ZIP containing Python files
2. Click "Analyze Code" to generate the visualization
### 🔍 Navigation
- **Zoom**: Use mouse wheel or trackpad
- **Pan**: Click and drag on empty space
- **Move Nodes**: Click and drag nodes
- **View Details**: Hover over nodes for tooltips
- **Clear Cache**: Press `Ctrl + F5` for a fresh start
### 🎨 Visualization Controls
- **Sidebar**: Hover on the left edge to access controls
- **Legend**: View node and connection types
- **Status Updates**: Watch the cache status in the navigation bar
## 🔧 Troubleshooting
### Common Issues
- **Visualization Not Updating**:
- Press `Ctrl + F5` to clear cache
- Check the cache status message in the navigation bar
- **Large Files**:
- Allow time for processing
- Watch the status indicators for progress
## 🤝 Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
## 📄 License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## 🙏 Acknowledgments
- D3.js for the visualization framework
- Flask for the backend server
- Bootstrap for the UI components