🌐 Globe Net Mapper

A visual network traceroute tool that displays the path of your network requests on a 3D rotating globe with a stunning hacker aesthetic (green neon theme).

✨ Features

• 🌍 3D Interactive Globe - Beautiful WebGL-powered Earth visualization with auto-rotation
• 🔍 Live Traceroute - Real-time network path tracing using Linux traceroute command
• 📍 IP Geolocation - Automatic location mapping of each network hop
• 💚 Hacker Aesthetic - Dark theme with neon green colors, scanlines, and matrix rain background
• 📊 Statistics Panel - Real-time hop count, total distance, and latency metrics
• 🎯 Animated Arcs - Watch your network path animate across the globe
• 🖱️ Interactive Nodes - Click on any hop point to see detailed information (IP, location, latency, ISP)
• 📱 Responsive Design - Works on desktop and mobile devices

---

🛠️ How It Was Built

Architecture

The application follows a client-server architecture:

1. Backend (Node.js + Express)

   • Executes Linux traceroute command to discover network hops
   • Falls back to tracepath if traceroute is unavailable
   • Parses command output to extract IP addresses and round-trip times
   • Uses ip-api.com for free IP geolocation (no API key needed)
   • Serves the frontend static files

2. Frontend (Vanilla HTML/CSS/JS)

   • Uses Globe.GL library for 3D WebGL globe rendering
   • Matrix rain canvas animation in the background
   • Custom CSS with neon glow effects, scanlines, and animations
   • Asynchronous hop visualization with animated arcs
   • Interactive tooltip dialogs for node details

Technology Stack

Component	Technology
3D Visualization	Globe.GL + Three.js
Backend Server	Node.js + Express
Network Tracing	Linux traceroute / tracepath
IP Geolocation	ip-api.com (free)
Fonts	JetBrains Mono, Orbitron
Styling	Vanilla CSS

---

🚀 Installation & Running

Prerequisites

• Node.js 18 or higher
• Linux/macOS with traceroute or tracepath installed
• Modern web browser with WebGL support

Quick Start

# Clone the repository
git clone https://github.com/uzairdeveloper223/globe-net-mapper.git
cd globe-net-mapper

# Install dependencies
npm install

# Start the server
npm start

# Open in browser
# Navigate to http://localhost:3000

Installing Traceroute (if not installed)

Ubuntu/Debian:

sudo apt install traceroute

Fedora/RHEL:

sudo dnf install traceroute

Arch Linux:

sudo pacman -S traceroute

---

⚙️ Configuration & Customization

Things You Can Edit

1. Server Port

Edit server.js line 5:

const PORT = process.env.PORT || 3000;  // Change to your preferred port

2. Globe Appearance

Edit public/app.js in the initGlobe() function:

• Globe texture: Change globeImageUrl (use any equirectangular projection image)
• Atmosphere color: Modify atmosphereColor('#00ff00') to any hex color
• Arc colors: Edit arcColor(() => ['#00ff00', '#39ff14'])
• Point size: Adjust pointRadius(0.5)

3. Color Theme

Edit public/styles.css CSS variables at the top:

:root {
    --neon-green: #00ff00;        /* Main neon color */
    --neon-green-bright: #39ff14; /* Bright accent */
    --bg-darkest: #000000;        /* Background color */
    /* ... more variables */
}

4. Quick Target Domains

Edit public/index.html to add your own quick buttons:

<button class="quick-btn" data-domain="example.com">Example</button>

5. Traceroute Options

Edit server.js traceroute spawn arguments:

spawn('traceroute', ['-n', '-m', '20', '-w', '2', domain])
// -n: numeric only (no DNS)
// -m 20: max 20 hops
// -w 2: 2 second timeout per hop

---

📁 Project Structure

globe_net_map/
├── server.js           # Express backend + traceroute execution
├── package.json        # Dependencies and scripts
├── README.md           # This file
├── LICENSE             # GPL v3 License
└── public/
    ├── index.html      # Main HTML structure
    ├── styles.css      # Hacker theme CSS (~850 lines)
    └── app.js          # Globe.GL + frontend logic (~550 lines)

---

🐛 Troubleshooting

Issue	Solution
"Traceroute failed" error	Install traceroute or tracepath package
No geolocation data	Private IPs (192.168.x.x, 10.x.x.x) can't be geolocated
Globe not loading	Check browser WebGL support at get.webgl.org
Slow trace	Adjust timeout with -w flag in server.js

---

📜 License

This project is licensed under the GNU General Public License v3.0 - see the LICENSE file for details.

Globe Net Mapper - Network Traceroute Visualizer
Copyright (C) 2025 Uzair Developer

This program is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.

---

👤 Author

Uzair Developer

• GitHub: @uzairdeveloper223
• Email: contact@uzair.is-a.dev

---

🙏 Credits & Acknowledgments

• Globe.GL - Vasturiano's incredible 3D globe library
• Three.js - WebGL rendering engine
• ip-api.com - Free IP geolocation API
• JetBrains Mono - Monospace font
• Orbitron - Display font

---

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the project
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

---

Made with 💚 and lots of 0x00FF00