An interactive visualization of approximately 690,000 GitHub repositories arranged in a galaxy-like pattern. Each dot represents a repository, and their colors indicate size and popularity. Repositories are clustered based on their relationships and shared stargazers.
- Galaxy Visualization: Explore hundreds of thousands of repositories in an interactive galaxy view
- Search: Find specific repositories using fuzzy search
- Repository Details: View real-time repository information including stars, forks, language, topics, and description
- Connections: See relationships between repositories based on shared stargazers
- Filtering: Filter repositories by language, stars, forks, and connections
- Navigation: Click on connected repositories to explore related projects
- Responsive Design: Works on desktop and mobile devices
- React 19 - UI framework
- MapLibre GL - Map rendering and visualization
- Vite - Build tool and development server
- GitHub API - Real-time repository data
- Vector Tiles - Efficient rendering of large-scale geospatial data
- DOT Graph Format - Repository connection data
- Clone the repository:
git clone <repository-url>
cd map-of-github- Install dependencies:
npm installStart the development server:
npm run devThe application will be available at http://localhost:5173
npm run dev- Start development servernpm run start- Start development server with host accessnpm run build- Build for productionnpm run preview- Preview production buildnpm run lint- Run ESLint
Build the application for production:
npm run buildThe output will be in the dist directory, ready to be deployed to any static hosting service.
map-of-github/
├── public/ # Static assets
│ ├── public/ # Favicon files
│ └── fonts/ # Custom fonts
├── src/
│ ├── components/ # React components
│ │ ├── FilterPanel.jsx
│ │ ├── InfoModal.jsx
│ │ ├── InfoPanel.jsx
│ │ └── SearchPanel.jsx
│ ├── App.jsx # Main application component
│ ├── main.jsx # Application entry point
│ └── index.css # Global styles
├── index.html # HTML template
├── vite.config.js # Vite configuration
└── package.json # Dependencies and scripts
The visualization is built upon a dataset derived from GitHub activity events between February 2011 and May 2025, capturing approximately 500 million star events. The process involved:
- Star Relationships: Extracted from GitHub activity events on Google BigQuery
- Jaccard Similarity: Computed between repositories based on shared stargazers
- Clustering: Applied Leiden clustering to group similar repositories, resulting in over 1,500 clusters with ~690,000 projects
- Layout: Used force-directed layouts to compute positions of nodes within clusters and global cluster arrangement
- Rendering: MapLibre GL renders vector tiles generated from this data
- Repository positions are loaded from vector tiles for efficient rendering
- Real-time repository statistics are fetched from the GitHub API
- Connection data is stored in DOT graph format and loaded on-demand
- The galaxy aesthetic is achieved through color schemes, glow effects, and visual styling
- Explore: Click on any repository dot to see its details and connections
- Search: Use the search bar to find specific repositories
- Filter: Click the filter button to filter repositories by various criteria
- Navigate: Click linked repositories in the info panel to explore related projects
- Zoom: Use mouse wheel or touch gestures to zoom in/out
Modern browsers that support:
- ES6+ JavaScript
- WebGL (for MapLibre GL)
- CSS Grid and Flexbox
MIT License - see LICENSE file for details
Created by @suryanewa
Built using data processed from GitHub activity events. The visualization leverages MapLibre GL for efficient rendering of large-scale geospatial data.