How to Create a Globe and Add Cities using Three.js

A coding session where you’ll learn how to create a globe and add cities to it with Three.js.

By Yuri Artiukh in Videos on April 5, 2021

In this ALL YOUR HTML coding session you’ll learn how to create the globe and add cities to it using Three.js.

This coding session was streamed live on April 4, 2021.

Check out the live demo.

Support: https://www.patreon.com/allyourhtml

Setup: https://gist.github.com/akella/a19954…

Yuri Artiukh

Yuriy is a developer from Kyiv, Ukraine. Leading a small frontend agency riverco.de, also speaking at conferences, and open for freelance projects. Curious about CSS and shaders. Loves to learn every day.

city globe planet three-js webgl

The
New
Collective

🎨✨💻 Stay ahead of the curve with handpicked, high-quality frontend development and design news, picked freshly every single day. No fluff, no filler—just the most relevant insights, inspiring reads, and updates to keep you in the know.

Prefer a weekly digest in your inbox? No problem, we got you covered. Just subscribe here.

Master JavaScript Animation with GSAP – Perfect for Beginners!

Get full, free access to 34 video lessons, step-by-step projects, and hands-on demos. Enroll for free →

Yuri Artiukh

Creating an ASCII Shader Using OGL

Trigonometry in CSS and JavaScript: Getting Creative with Trigonometric Functions

Reaction-Diffusion Compute Shader in WebGPU

The New Collective

Master JavaScript Animation with GSAP – Perfect for Beginners!

The
New
Collective