A web-based application that visualizes your VRChat friend network using interactive D3.js graphs. Easily scan your VRChat photos, generate metadata, and explore connections between players through an intuitive and dynamic interface.
Only photos taken while VRCX is running are supported. In addition, only photos taken with the screenshot helper
enabled in VRCX can be used.
- Interactive Network Graph: Visualize connections between VRChat players with dynamic force-directed graphs.
- Search Functionality: Easily search for players by name and highlight their connections.
- Responsive Design: Accessible and functional across various screen sizes.
- Share and Download: Download your network visualization as an SVG or share directly to Twitter using tmpfiles.org.
- Date Range-based Data Filter: Filter your images by date range using an intuitive slider.
- EXE Installation Package: (New) Install the application as a standalone Windows program with typical installer features (default installation folder, desktop and start menu shortcuts).
For users who prefer a traditional desktop installation, a standalone EXE package is available.
-
Download the Installer:
- Visit the GitHub Releases page and download the latest installer (EXE).
-
Run the Installer:
- Double-click the installer.
- Follow the on-screen instructions to install the application (default installation directory is typically
C:\Program Files\VRChatFriendShipVisualizer
). - During installation, you can change the installation directory if desired.
- The installer will automatically create desktop and Start Menu shortcuts.
-
Run the Application:
- After installation, launch the app either from the desktop shortcut or from the Start Menu.
- The application will run as a standalone desktop application with an embedded Express server and all features intact.
Before you begin, ensure you have met the following requirements:
- Node.js: Install Node.js (v14 or later) from Node.js official website.
- npm: Node.js installation includes npm. Verify installation by running:
node -v npm -v
-
Clone the Repository:
git clone https://github.com/refiaa/VRChatFriendShipVisualizer.git
-
Navigate to the Project Directory:
cd VRChatFriendShipVisualizer
-
Install Dependencies:
npm install
-
Run the Application:
npm run dev
- The development server will start on the configured port (default is 3000).
- Open your browser and navigate to http://localhost:3000 to view the application.
-
Prepare VRChat Images:
- By default, the application uses your VRChat image folder located at:
C:\Users\{YourUsername}\Pictures\VRChat
- To change the directory, use the directory configuration option in the app UI.
- By default, the application uses your VRChat image folder located at:
-
Metadata Generation:
- Metadata is generated from your VRChat photos and stored in the
metadata
folder located inside your VRChat folder:C:\Users\{YourUsername}\Pictures\VRChat\metadata
- Metadata is generated from your VRChat photos and stored in the
-
Start the Application:
- For Node.js version, run
npm run dev
and navigate to http://localhost:3000. - For the EXE version, simply launch the installed application.
- For Node.js version, run
-
Update Visualization:
- Place your VRChat photos in the designated folder or configure a new directory.
- Click on Update Visualization to generate the friend network graph.
-
Additional Features:
- Use the search functionality to highlight specific nodes.
- Filter data by date range using the slider.
- Export the visualization as an SVG or share via Twitter.
- D3.js: Used for dynamic, interactive network graph visualizations.
- Express.js: Provides a RESTful API and serves the web application.
- Electron: Packages the application as a standalone desktop app.
- Additional Libraries: form-data, fs-extra, node-fetch, and others as listed in package.json.
This executable package has been scanned on VirusTotal and is reported clean by most antivirus engines. Minor detections (e.g., Bkav Pro) are known false positives common with Electron applications.
See CHANGELOG.md for a list of notable changes and updates.
This project is licensed under the MIT License.