Initial commit: Pixel-ADSB flight tracker
Retro SNES-style side-view ADS-B aircraft tracker with pixel art sprites, animated celestial bodies, weather visualization, and directional views. Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
root
190
CONFIG.md
Normal file
190
CONFIG.md
Normal file
@@ -0,0 +1,190 @@
|
||||
# Pixel View Configuration Guide
|
||||
|
||||
This guide explains how to configure Pixel View for your ADS-B receiver setup.
|
||||
|
||||
## Configuration File
|
||||
|
||||
Edit `config.json` to customize your installation:
|
||||
|
||||
```json
|
||||
{
|
||||
"receivers": "AUTO",
|
||||
"receiver_port": 30003,
|
||||
"location": {
|
||||
"name": "My Location",
|
||||
"lat": 0.0,
|
||||
"lon": 0.0
|
||||
},
|
||||
"web_port": 2001
|
||||
}
|
||||
```
|
||||
|
||||
**Important:** You must set your `location.lat` and `location.lon` to your actual receiver coordinates for weather data and aircraft positioning to work correctly.
|
||||
|
||||
### Configuration Options
|
||||
|
||||
| Option | Type | Description |
|
||||
|--------|------|-------------|
|
||||
| `receivers` | string or array | `"AUTO"` to scan network, or IP address(es) of ADS-B receiver(s) |
|
||||
| `receiver_port` | number | Port for SBS/BaseStation data (default: 30003) |
|
||||
| `location.name` | string | Display name shown on screen (e.g., "Seattle, WA") |
|
||||
| `location.lat` | number | Latitude of your receiver location |
|
||||
| `location.lon` | number | Longitude of your receiver location |
|
||||
| `web_port` | number | Port for the web interface (default: 2001) |
|
||||
|
||||
### Receiver Configuration Examples
|
||||
|
||||
**Auto-scan network (default):**
|
||||
```json
|
||||
"receivers": "AUTO"
|
||||
```
|
||||
|
||||
**Single receiver:**
|
||||
```json
|
||||
"receivers": "192.168.1.100"
|
||||
```
|
||||
|
||||
**Multiple receivers:**
|
||||
```json
|
||||
"receivers": ["192.168.1.100", "192.168.1.101"]
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Background Images
|
||||
|
||||
Pixel View uses directional background images to show the horizon view from your receiver location. You should customize these to match your actual surroundings.
|
||||
|
||||
### Image Files
|
||||
|
||||
| File | Direction | Description |
|
||||
|------|-----------|-------------|
|
||||
| `north.png` | North (0°) | View looking north from your location |
|
||||
| `east.png` | East (90°) | View looking east from your location |
|
||||
| `south.png` | South (180°) | View looking south from your location |
|
||||
| `west.png` | West (270°) | View looking west from your location |
|
||||
|
||||
### Image Requirements
|
||||
|
||||
- **Resolution:** 1536 x 1024 pixels (recommended)
|
||||
- **Format:** PNG with transparency support
|
||||
- **Aspect ratio:** 3:2 (width:height)
|
||||
- **Style:** Pixel art style for best visual consistency
|
||||
|
||||
### Image Composition
|
||||
|
||||
Each background image should include:
|
||||
|
||||
1. **Sky area** (top ~60%): Should be transparent or very light to blend with the dynamic sky gradient
|
||||
2. **Horizon line**: Where the sky meets the ground/landscape
|
||||
3. **Ground/landscape** (bottom ~40%): Your local terrain features
|
||||
|
||||
```
|
||||
┌─────────────────────────────┐
|
||||
│ │
|
||||
│ Transparent/Sky │ ← Dynamic sky renders here
|
||||
│ (alpha = 0 or light) │
|
||||
│ │
|
||||
├─────────────────────────────┤ ← Horizon line
|
||||
│ │
|
||||
│ Ground/Landscape │ ← Your local scenery
|
||||
│ (mountains, buildings, │
|
||||
│ trees, desert, etc.) │
|
||||
│ │
|
||||
└─────────────────────────────┘
|
||||
```
|
||||
|
||||
### Creating Custom Backgrounds
|
||||
|
||||
**Option 1: Pixel Art (Recommended)**
|
||||
- Use a pixel art editor (Aseprite, Piskel, GIMP)
|
||||
- Create at 384x256 or 768x512, then scale up 4x or 2x
|
||||
- Keep colors limited for retro aesthetic
|
||||
- Use the existing backgrounds as templates
|
||||
|
||||
**Option 2: Photo-based**
|
||||
- Take photos looking N/E/S/W from your receiver location
|
||||
- Apply a pixel art filter or posterize effect
|
||||
- Reduce to limited color palette
|
||||
- Resize to 1536x1024
|
||||
|
||||
**Option 3: Simplified Silhouettes**
|
||||
- Create simple horizon silhouettes of local landmarks
|
||||
- Mountains, buildings, trees as flat shapes
|
||||
- Works well with limited artistic skills
|
||||
|
||||
### Tips for Good Backgrounds
|
||||
|
||||
1. **Consistency**: Use the same color palette across all 4 directions
|
||||
2. **Horizon height**: Keep the horizon at roughly the same vertical position
|
||||
3. **Landmarks**: Include recognizable local features (mountains, towers, etc.)
|
||||
4. **Weather**: The sky portion should be transparent so the dynamic weather shows through
|
||||
5. **Testing**: View each direction in the app to ensure smooth rotation
|
||||
|
||||
### Example Color Palettes
|
||||
|
||||
**Desert/Southwest:**
|
||||
```
|
||||
Ground tones: #d4a868, #b8884c, #a87840
|
||||
Rock/mountain: #8c7c68, #6c5c4c
|
||||
Vegetation: #54a844, #3c7c30
|
||||
```
|
||||
|
||||
**Forest/Pacific Northwest:**
|
||||
```
|
||||
Ground tones: #3c5c3c, #4c6c4c, #2c4c2c
|
||||
Trees: #2c5c2c, #1c4c1c, #3c6c3c
|
||||
Mountains: #5c6c7c, #7c8c9c, #fcfcfc (snow)
|
||||
```
|
||||
|
||||
**Urban/City:**
|
||||
```
|
||||
Buildings: #4c5c6c, #5c6c7c, #6c7c8c
|
||||
Windows: #fcd444, #fcfc9c
|
||||
Ground: #3c3c3c, #4c4c4c
|
||||
```
|
||||
|
||||
**Coastal:**
|
||||
```
|
||||
Sand: #e4d4a8, #d4c498
|
||||
Water: #5c94fc, #4c84ec
|
||||
Cliffs: #8c7c68, #9c8c78
|
||||
```
|
||||
|
||||
Sky should always be transparent (#00000000) to allow the dynamic sky gradient to show through.
|
||||
|
||||
---
|
||||
|
||||
## Other Sprite Assets
|
||||
|
||||
These are optional to customize:
|
||||
|
||||
| File | Size | Description |
|
||||
|------|------|-------------|
|
||||
| `sun.png` | 64x64 | Sun sprite |
|
||||
| `moon_6_phases.png` | 192x128 | Moon phases (3x2 grid) |
|
||||
| `happycloud.png` | 96x64 | Clear weather cloud |
|
||||
| `raincloud.png` | 96x64 | Rain/storm cloud |
|
||||
|
||||
### Aircraft Sprites
|
||||
|
||||
| File | Description |
|
||||
|------|-------------|
|
||||
| `smallProp.png` | Small propeller aircraft (Cessna) |
|
||||
| `regionalJet.png` | Regional jets (CRJ, ERJ) |
|
||||
| `narrowBody.png` | Narrow body jets (737, A320) |
|
||||
| `wideBody.png` | Wide body jets (777, 787) |
|
||||
| `heavy.png` | Heavy/jumbo jets (747, A380) |
|
||||
| `helicopter.png` | Helicopters |
|
||||
|
||||
All aircraft sprites should face **right (east)** - the code flips them automatically for westbound flights.
|
||||
|
||||
---
|
||||
|
||||
## Quick Start Checklist
|
||||
|
||||
1. [ ] Edit `config.json` with your receiver IP (or leave as AUTO)
|
||||
2. [ ] Set your location name, latitude, and longitude
|
||||
3. [ ] Replace `north.png`, `east.png`, `south.png`, `west.png` with your local views
|
||||
4. [ ] Start the server: `python3 server.py`
|
||||
5. [ ] Open browser to `http://your-server-ip:2001`
|
||||
Reference in New Issue
Block a user