A modern full-stack web application for 3D photogrammetry processing using COLMAP for Structure-from-Motion reconstruction, with a Flask backend and Next.js frontend.
3D-photogrammetry/
├── app.py # Main Flask backend application
├── colmap_wrapper.py # COLMAP integration wrapper
├── image_preprocessor.py # Image preprocessing utilities
├── model_processor.py # 3D model processing utilities
├── test_colmap_integration.py # Test script for COLMAP functionality
├── requirements.txt # Python dependencies
├── README.md # Project documentation
├── DEPLOYMENT_GUIDE.md # Deployment instructions
├── uploads/ # Directory for uploaded images
├── outputs/ # Directory for processed results
├── logs/ # Application log files
├── static/ # Static backend files
├── templates/ # Flask HTML templates
└── frontend/ # Next.js frontend application
├── src/
│ ├── app/ # Next.js app router pages
│ ├── components/ # React components
│ ├── hooks/ # Custom React hooks
│ ├── lib/ # API utilities and helpers
│ └── types/ # TypeScript type definitions
├── package.json # Frontend dependencies
├── tailwind.config.js # Tailwind CSS configuration
└── tsconfig.json # TypeScript configuration
- Multiple File Upload: Secure multi-image upload with session-based organization
- File Validation: Comprehensive image validation (JPG, PNG, JPEG) with security checks
- Session Management: Unique session IDs for organizing related uploads
- COLMAP Integration: Complete Structure-from-Motion pipeline using COLMAP
- 3D Reconstruction: Sparse and dense 3D reconstruction from images
- Progress Tracking: Real-time progress monitoring for long-running processes
- RESTful API: JSON-based API endpoints with detailed responses
- CORS Support: Cross-Origin Resource Sharing for frontend integration
- Error Handling: Robust error handling and detailed logging
- Modern UI: React-based interface with Tailwind CSS styling
- 3D Model Viewer: Three.js integration for viewing generated 3D models
- Drag & Drop Upload: Intuitive file upload with progress tracking
- Real-time Status: Live updates on processing progress
- Responsive Design: Works on desktop and mobile devices
- Error Handling: User-friendly error messages and notifications
GET /
- Welcome message and API overviewGET /health
- Health check endpoint with system statusPOST /upload
- Upload multiple images with session managementPOST /process
- Start COLMAP 3D reconstruction processingGET /status/<session_id>
- Get processing status (uploaded/processing/complete/error)GET /download/<session_id>
- Download processed 3D models
POST /upload
- Content-Type:
multipart/form-data
- Field Name:
files
(supports multiple files) - Supported Formats: JPG, JPEG, PNG
- Max Request Size: 200MB total (sufficient for multiple high-resolution images)
- Security: File signature validation and size checks
Request Example:
curl -X POST http://localhost:5000/upload \
-F "files=@image1.jpg" \
-F "files=@image2.png" \
-F "files=@image3.jpeg"
Response Example:
{
"session_id": "550e8400-e29b-41d4-a716-446655440000",
"upload_status": "success",
"files_uploaded": 3,
"files_failed": 0,
"total_files": 3,
"total_size": 2457600,
"uploaded_files": [
{
"filename": "20250529_120000_image1.jpg",
"original_name": "image1.jpg",
"size": 1024000
}
]
}
POST /process
- Content-Type:
application/json
- Required:
session_id
- Optional Parameters:
enable_dense_reconstruction
(boolean, default: false) - Dense reconstruction requires CUDAenable_meshing
(boolean, default: false)max_image_size
(integer, default: 1920)matcher_type
(string, default: "exhaustive", options: "exhaustive", "sequential")
Request Example:
curl -X POST http://localhost:5000/process \
-H "Content-Type: application/json" \
-d '{
"session_id": "550e8400-e29b-41d4-a716-446655440000",
"enable_dense_reconstruction": false,
"max_image_size": 1920,
"matcher_type": "exhaustive"
}'
Response Example:
{
"message": "Processing started",
"session_id": "550e8400-e29b-41d4-a716-446655440000",
"status": "processing",
"input_files_count": 5,
"processing_parameters": {
"enable_dense_reconstruction": false,
"enable_meshing": false,
"max_image_size": 1920,
"matcher_type": "exhaustive"
},
"status_endpoint": "/status/550e8400-e29b-41d4-a716-446655440000"
}
GET /status/<session_id>
- Purpose: Get processing status with simple status values
- Status Values:
"uploaded"
,"processing"
,"complete"
,"error"
- Returns: Current status, messages, error details, and output files when complete
Response Example (Processing):
{
"session_id": "550e8400-e29b-41d4-a716-446655440000",
"status": "processing",
"message": "COLMAP processing started",
"start_time": "2025-05-28T12:00:00",
"end_time": null,
"error": null,
"output_files": [],
"detailed_progress": {
"stage": "sparse_reconstruction",
"progress_percent": 45.0,
"stage_message": "Performing sparse 3D reconstruction"
}
}
Response Example (Complete):
{
"session_id": "550e8400-e29b-41d4-a716-446655440000",
"status": "complete",
"message": "Processing completed successfully with downloadable models",
"start_time": "2025-05-28T12:00:00",
"end_time": "2025-05-28T12:04:15",
"error": null,
"output_files": [
{
"type": "sparse_model",
"path": "outputs/colmap_session_.../sparse_model.ply",
"size": 1024000
}
],
"model_processing_results": {
"compressed_archive": "outputs/colmap_session_.../model_.zip",
"session_id": "550e8400-e29b-41d4-a716-446655440000"
}
}
GET /download/<session_id>
- Purpose: Download processed 3D models as compressed archive
- Returns: ZIP file containing all generated 3D models and metadata
- Supported Formats: PLY (point cloud), OBJ (mesh if generated)
Response Example:
# Downloads a ZIP file containing all processed models
curl -O -J http://localhost:5000/download/SESSION_ID
# Results in: 3d_model_SESSION_ID.zip
The application integrates COLMAP to provide a complete Structure-from-Motion (SfM) pipeline:
-
Feature Extraction:
- Detects and describes keypoints in each image using SIFT features
- Configurable image size and feature parameters
- Progress: 10-25%
-
Feature Matching:
- Matches features between image pairs
- Supports exhaustive and sequential matching strategies
- Progress: 25-45%
-
Sparse Reconstruction:
- Estimates camera poses and creates sparse 3D point cloud
- Bundle adjustment for optimization
- Progress: 45-100% (when dense reconstruction is disabled)
-
Dense Reconstruction (Optional, requires CUDA):
- Creates dense point cloud using multi-view stereo
- Significantly improves detail but requires GPU hardware
- Progress: 70-90%
-
Mesh Generation (Optional):
- Generates mesh from dense point cloud using Poisson reconstruction
- Creates textured 3D model
- Progress: 90-100%
Sparse Reconstruction (Always Generated):
sparse_model.ply
: 3D point cloud in PLY formatcameras.bin
: Camera intrinsic parametersimages.bin
: Camera poses and image informationpoints3D.bin
: 3D point coordinates and visibility
Dense Reconstruction (Optional, requires CUDA):
fused.ply
: Dense 3D point cloud in PLY format
Mesh (Optional, experimental):
mesh.ply
: 3D mesh in PLY format
- Image Size: Maximum dimension for processing (trade-off between quality and speed)
- Matcher Type:
exhaustive
: Matches all image pairs (best quality, slower)sequential
: Matches consecutive images (faster, suitable for ordered sequences)
- Dense Reconstruction: Enable for detailed point clouds (requires CUDA/GPU)
- Meshing: Enable for 3D mesh generation (experimental, requires dense reconstruction)
-
Install COLMAP:
macOS (using Homebrew):
brew install colmap
Ubuntu/Debian:
sudo apt-get install colmap
Windows:
- Download pre-built binaries from https://demuc.de/colmap/
- Or build from source following COLMAP installation guide
Verify Installation:
colmap -h
-
Install Python Dependencies:
pip install -r requirements.txt
-
Run the Backend:
python app.py
-
Access the Backend API:
- Main API:
http://localhost:5000/
- Health Check:
http://localhost:5000/health
- Main API:
-
Test COLMAP Integration:
python test_colmap_integration.py
-
Navigate to Frontend Directory:
cd frontend
-
Install Dependencies:
npm install
-
Run Development Server:
npm run dev
-
Access the Frontend:
- Frontend Application:
http://localhost:3000
- Frontend Application:
-
Build Frontend:
cd frontend npm run build
-
Start Production Servers:
# Backend python app.py # Frontend (in another terminal) cd frontend npm start
- Max Request Size: 200MB total (supports multiple high-resolution images)
- Allowed File Types: JPG, JPEG, PNG (validated by file signature)
- Upload Directory:
uploads/
(organized by session ID) - Output Directory:
outputs/
- Log Files:
logs/app.log
- CORS: Enabled for all origins
- Session Management: UUID-based unique session directories
- API Base URL: Configurable in
.env.local
- Build Tool: Next.js with TypeScript
- Styling: Tailwind CSS
- 3D Rendering: Three.js with React Three Fiber
- Flask: Web framework
- Flask-CORS: Cross-Origin Resource Sharing support
- OpenCV: Computer vision library for image processing
- NumPy: Numerical computing
- Pillow: Python Imaging Library for image manipulation
- Werkzeug: WSGI utilities
- Next.js: React framework
- React: UI library
- TypeScript: Type-safe JavaScript
- Tailwind CSS: Utility-first CSS framework
- Three.js: 3D graphics library
- @react-three/fiber: React renderer for Three.js
- @react-three/drei: Useful helpers for React Three Fiber
- COLMAP: Structure-from-Motion and Multi-View Stereo pipeline
- Version: 3.11+ recommended
- Installation: See COLMAP installation guide
- Features: Feature extraction, matching, sparse/dense reconstruction
Uploaded files are organized in session-based directories:
uploads/
├── 550e8400-e29b-41d4-a716-446655440000/
│ ├── 20250528_120000_image1.jpg
│ ├── 20250528_120001_image2.png
│ └── 20250528_120002_image3.jpeg
└── another-session-id/
└── uploaded files...
outputs/
├── colmap_session_550e8400.../
│ ├── sparse_model.ply
│ ├── model_550e8400...zip
│ ├── sparse/0/
│ └── images/
└── colmap_session_another.../
└── processing results...
- File Type Validation: Extension and MIME type checking
- File Signature Verification: Binary signature validation
- Size Limits: Per-request size limits (200MB total)
- Secure Filenames: Sanitized and timestamped filenames
- Session Isolation: Files organized in unique session directories
- Input Sanitization: All user inputs are validated and sanitized
The application logs to both console and file (logs/app.log
) with structured logging including:
- Request processing
- File uploads and processing
- COLMAP pipeline execution
- Error tracking and debugging
- Health check status
- Performance metrics
- 200: Success
- 202: Processing started (async operations)
- 400: Bad request (invalid parameters)
- 404: Endpoint or session not found
- 413: Request entity too large
- 500: Internal server error
- File validation errors: Invalid file type or corrupted files
- COLMAP processing errors: Feature extraction or reconstruction failures
- Session management errors: Invalid or expired session IDs
- Resource errors: Insufficient disk space or memory
- Dense reconstruction requires CUDA: For GPU-accelerated dense reconstruction
- Sparse reconstruction works without GPU: Core functionality available on any system
- Automatic fallback: Application gracefully handles missing CUDA
- Image size: Smaller images process faster but with lower detail
- Matcher type: Sequential matching is faster for ordered image sequences
- Dense reconstruction: Only enable if you have CUDA and need maximum detail
- File formats: JPEG files are smaller and faster to upload than PNG
- COLMAP not found: Ensure COLMAP is installed and in PATH
- CUDA errors: Disable dense reconstruction if no GPU available
- File upload failures: Check file size limits and formats
- Processing failures: Verify images have sufficient overlap and features
Enable debug logging by setting environment variable:
export FLASK_DEBUG=1
python app.py