Earth
An Earth exploration application inspired by Google Earth
Install / Use
/learn @rajtoshranjan/EarthREADME
Earth
This project is an Earth exploration application inspired by Google Earth, built using Maplibre, React, and Tailwind CSS. While it draws inspiration from Google Earth's design and functionality, it includes unique custom-made features and improvements. This application offers a visually engaging way for users to explore and interact with Earth's geography and landmarks.

Note: Although inspired by Google Earth, this project includes significant differences in both design and functionality, providing a distinct user experience.
Table of Contents
Features
- Interactive 3D Map: Explore a 3D representation of Earth's surface.
- Zoom and Pan: Zoom in and out and pan across the map.
- Search: Search a place by name.
- Measurement: Measurement of vector geometry (length, area, etc.)
- Layers: Add custom raster and vector layers
- Vector Digitization, Editing and Export
- State Persistence: This application stores data such as layers, component states, etc in local storage.
Technologies Used
- Vite: A fast build tool for modern web development.
- React: A JavaScript library for building user interfaces.
- Tailwind CSS: A utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90 that can be composed to build any design, directly in your markup.
- Maplibre GL JS: An open-source TypeScript library for publishing maps.
Getting Started
To get started with the Earth, follow these steps:
Installation
- Clone the repository:
git clone https://github.com/rajtoshranjan/earth.git - Navigate to the project directory:
cd earth - Install dependencies:
npm iornpm ci
Usage
- Create a
.env.developmentfile in theenv-filesdirectory, using theenv-files/.env.samplefile as a reference for all required environment variables. - Start the development server:
npm run dev - Open your web browser and go to
http://localhost:5173
Related Skills
bluebubbles
336.9kUse when you need to send or manage iMessages via BlueBubbles (recommended iMessage integration). Calls go through the generic message tool with channel="bluebubbles".
node-connect
336.9kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
slack
336.9kUse when you need to control Slack from OpenClaw via the slack tool, including reacting to messages or pinning/unpinning items in Slack channels or DMs.
frontend-design
83.0kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
