VisualDiffX — Satellite Change Detection Engine
A professional satellite change detection web engine performing client-side computer vision (luminance maps, morphological filters, Connected Component Labeling) inside the browser with synchronized pan/zoom viewports.
About the Project
VisualDiffX is a professional-grade satellite change detection engine. It loads before-and-after image pairs into memory, extracts raw pixel data buffers, and calculates absolute change maps on-the-fly. It runs specialized morphological operations and graph traversals to draw bounding boxes around changes, exporting combined inspection sheets and batch ZIP packages directly from the web client.
Geospatial Detection Pipeline
The client-side computer vision pipeline processes raw pixels step-by-step to isolate structural changes:
Select Images
Before & After Pairs
Diff Mask
Grayscale Pixel Sub
Filter Noise
Morphological Closing/Opening
CCL Labeling
BFS Bounding Boxes
Export
Single Sheet / Batch ZIP
Key Features & Comparison Modes
Packed with interactive geospatial analytics utilities:
Comparison Viewports: Toggle between Side-by-Side (3-Pane comparison), Split Slider (draggable vertical reveal divider), Opacity Cross-Fade, and raw Difference Masks.
Synchronized Pan & Zoom: Linked mouse wheel and drag-to-pan handlers that update all viewports concurrently to keep zoom positions locked.
Single-Sheet Report Generator: Combines Before, After, and Changes viewports with metadata header telemetry (Change Density, Component Count) into a single JPEG export.
Batch Archive (JSZip): Bundles processed change maps and binary files into a single ZIP archive client-side.
Tech Stack & Libraries
Utilizes Next.js App Router for static pre-rendering combined with high-performance canvas math:
Frontend: Next.js (React 19), TypeScript, Tailwind CSS v4, Lucide Icons
Image Processing: HTML5 Canvas API (Pixel manipulation, custom morphological shaders in TS)
Client Archiving: JSZip (for dynamic ZIP generation in the browser)
Performance: Passive event listeners to prevent browser page-scroll jacking during interactive zoom/pan operations
Project Demo
Project Note
🛰️ Browser-Based Geospatial Change Detection Unlike traditional change detection platforms that rely on heavy server processing or complex local Python configurations, VisualDiffX runs full computer vision algorithms directly in the browser via HTML5 Canvas buffers, guaranteeing 100% user privacy and offline functionality.