MeasureXR 📐✨

A high-precision, interactive WebXR Augmented Reality Spatial Measurement Tool built with Three.js, WebXR Device API, and vanilla web technologies.

---

🚀 Overview

MeasureXR transforms any AR-supported mobile device into a versatile spatial measurement instrument. Using computer vision hit-testing and WebXR plane detection, MeasureXR allows users to place anchor points in real-world space to compute distances, polygon surface areas, vertical heights, and 3D bounding box dimensions in real-time.

---

🌟 Key Features

• 📏 Distance Measurement: Multi-point polyline distance calculation with real-time live preview.
• 📐 Polygon Area Calculation: Surface plane measurement with automatic triangulation and polygon closure.
• ↕️ Vertical Height Tracking: Ground-to-elevation perpendicular height computation.
• 📦 3D Object Bounding Box: Spatial volume and boundary dimensioning for objects.
• 🏷️ Dynamic 3D Spatial Labels: CSS2DRenderer annotations floating in 3D space with distance readouts.
• 🎯 Smart Reticle & Snapping: Surface-locked targeting reticle with visual radar scanning and vertex snapping.
• 🔄 Real-Time Unit Conversions: Instant metric to imperial conversion (Meters, Feet, Inches).
• 📸 AR Snapshot Capture: Shutter flash animation with photo capture and instant download.
• 📱 Glassmorphic Cyber HUD: Ultra-responsive, mobile-first interface with intuitive contextual prompts.

---

🛠️ Tech Stack

• Three.js (0.160.0) - 3D scene graph, geometry, and rendering pipeline
• WebXR Device API - Immersive AR session management and hit-testing
• CSS2DRenderer - High-resolution DOM-based spatial HUD labels in 3D space
• HTML5 / CSS3 / ES6 Modules - Lightweight, zero-dependency architecture

---

📋 Prerequisites & Compatibility

• AR-Compatible Device:
  • Android device with Google Play Services for AR (ARCore) installed.
  • Browser: Google Chrome (v79+).
• Secure Context Required:
  • WebXR requires HTTPS (or localhost) to access camera and motion sensors.

---

💻 Running Locally

1. Clone the repository:

   git clone https://github.com/Mithun1075/MeasureXR.git
   cd MeasureXR

2. Start a local HTTPS development server: Since WebXR requires HTTPS, you can use tools like mkcert, live-server, or Vite / Python:

   # Using Node.js npx live-server with SSL or Vite:
   npx http-server -S -C cert.pem -K key.pem
   
   # Or test over USB debugging on Chrome (chrome://inspect):
   python3 -m http.server 8000

   (For USB debugging, forward port 8000 in Chrome DevTools to test on your phone over http://localhost:8000)

---

📄 License

This project is licensed under the MIT License.