DEV Community

Nemo
Nemo

Posted on

How I used AI to build a lightweight open-source 3D Earth with CesiumJS

Hi Dev Community! 👋

I've been working on an open-source project called Locus-Earth recently. It's a lightweight, browser-based interactive 3D Earth built with CesiumJS.

Instead of just dropping a link, I want to share some features and the development process behind it.

✨ What's new in the recent update?

  • Multi-basemap Switching: Sentinel-2, Blue Marble, night lights, TianDiTu, Tencent Maps, etc.
  • Interactive Tools: Distance/Area measurement (snapped to terrain), markers, and browser-local favorites (import/export supported).
  • Location Search: Just type a place name to fly there.
  • Scene Integration: Auto high-precision city models when entering Denver, Washington D.C., Sydney, etc. Street View appears when entering mainland China!
  • UI/UX: Day/night lighting, white model toggle, dark/light theme, compass, draggable floating toolbar (adapted for mobile).

🚀 Tech Stack & Acknowledgements

Category Details
Engine CesiumJS 1.118
Architecture Native ES Modules, Zero build step
Form PWA (Service Worker + Manifest)
AI Assistance DeepSeek, GitHub Copilot, Tencent Hunyuan

Data Sources: Cesium ion, OpenStreetMap, Natural Earth, Tianditu, Tencent Maps.

Special Thanks: Tencent Street View uses a community-maintained third-party viewer, qq-map, to open panoramas (not an official Tencent service). The coordinate transformation logic can be found in js/coord-transform.js (two-way conversion between WGS-84 and GCJ-02).


🔗 Links

  • GitHub Repo: ZhuNemo/locus-earth (MIT License) (Note: Since the website runs on Cesium ion's free tier, the demo has a limited monthly quota. If it goes down, please run it locally or check the screenshots in the repo!)

Any feedback or contributions are highly appreciated! 😊

Top comments (0)