Creating NASA Black Marble in ThreeJS: A Step-by-Step Guide

The Nasa Black Marble in ThreeJS project is a visualization of the Earth at night created using ThreeJS. The Nasa Black Marble is a dataset produced by NASA that shows the lights on the Earth’s surface at night. It provides a stunning view of the Earth as seen from space at night, with cities and urban areas clearly visible due to the artificial lighting.

To create this visualization in ThreeJS, I started by setting up the HTML structure for the project. I included the necessary HTML tags and linked the ThreeJS library and the ThreeGLTFLoader library using the script tags.

Next, I defined the JavaScript functions to initialize the scene, camera, and renderer. I also added an ambient light to the scene to illuminate the model that will be loaded. I used the GLTFLoader to load the Nasa Black Marble model in GLB format and added it to the scene.

I also added event listeners to handle the window resize event and to update the camera and renderer accordingly.

Finally, I defined the animation function to render the scene and camera in a loop using requestAnimationFrame.

With this setup, the Nasa Black Marble in ThreeJS project is now ready to be viewed in a web browser. The visualization provides a captivating look at the Earth at night and highlights the beauty of the Nasa Black Marble dataset. This project showcases the power and versatility of ThreeJS in creating immersive and visually stunning 3D visualizations.