This repository contains a simple Three.js application that renders a 3D globe. It displays feature outlines on a sphere, surrounded by a starfield, and offers simple user interaction (orbit controls).
- Interactive 3D Globe: Rotate and zoom the globe using orbit controls.
- Country Outlines: Visualizes feature borders using GeoJSON data.
- Starfield Background: Enhances the visual experience with a starfield effect.
Watch the tutorial on YouTube
-
Clone the repository
git clone ttps://github.com/bobbyroe/3d-globe-with-threejs.git
-
Navigate to the project directory
cd 3d-globe-with-threejs
-
Set up a local server
Install
live-server
globally:npm install -g live-server
Or use it via
npx
:npx live-server --port=8080
-
Run the server
live-server --port=8080
This will serve the files in the current directory at
http://localhost:8080
. -
Open the application in your browser
Navigate to
http://localhost:8080
to view the globe visualization.
- GeoJSON Data: Country outlines are sourced from Natural Earth GeoJSON.
- Additional Datasets: For more datasets, visit Natural Earth Data.
This project is licensed under the MIT License.
- Three.js: threejs.org
- Natural Earth Data: naturalearthdata.com