Compare commits
5 Commits
6dcc5a19b9
...
python-leg
| Author | SHA1 | Date | |
|---|---|---|---|
| 833dead43c | |||
| 1d8375af02 | |||
| acfd9b8f7b | |||
| 81e078e92a | |||
| e392b449cc |
@@ -46,7 +46,10 @@
|
||||
"Bash(pkill:*)",
|
||||
"Bash(pip3 list:*)",
|
||||
"Bash(chmod:*)",
|
||||
"Bash(pyinstaller:*)"
|
||||
"Bash(pyinstaller:*)",
|
||||
"Bash(npm i:*)",
|
||||
"Bash(npm uninstall:*)",
|
||||
"Bash(npm rebuild:*)"
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
1513
RFCP-RUST-MIGRATION-PLAN.md
Normal file
1513
RFCP-RUST-MIGRATION-PLAN.md
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,352 +0,0 @@
|
||||
# UMTC Wiki v2.0 — MEGA TASK: Integration & Polish
|
||||
|
||||
Read UMTC-Wiki-v2.0-REFACTOR.md and UMTC-Wiki-v2.0-ROADMAP.md for full context.
|
||||
|
||||
This is a comprehensive task covering all remaining fixes and integration work.
|
||||
Take your time, think hard, work through each section systematically.
|
||||
Report after completing each major section.
|
||||
|
||||
---
|
||||
|
||||
## SECTION A: Fix Critical Tauri 404 Bug
|
||||
|
||||
The sidebar loads the full content tree correctly but clicking ANY article shows 404.
|
||||
|
||||
### Debug steps:
|
||||
1. In `frontend/src/lib/api.ts` — find where getPage is called with a slug
|
||||
Add `console.log('[WIKI] getPage called with slug:', slug)`
|
||||
|
||||
2. In `frontend/src/lib/utils/backend.ts` — in the tauriGetPage function
|
||||
Add `console.log('[WIKI] Tauri invoke get_page with:', slug)`
|
||||
|
||||
3. In `desktop/src-tauri/src/commands/content.rs` — in the get_page handler
|
||||
Add `eprintln!("[WIKI] get_page received slug: {}", slug)`
|
||||
Add `eprintln!("[WIKI] trying path: {:?}", resolved_path)`
|
||||
|
||||
4. Check the Sidebar.svelte component — what href/slug does it generate when user clicks?
|
||||
The web version uses `/api/pages/{slug}` — in desktop mode it should invoke with just the slug part.
|
||||
|
||||
5. Common mismatches to check:
|
||||
- Leading slash: sidebar sends `/lte/bbu` but Rust expects `lte/bbu`
|
||||
- File extension: Rust looks for `lte/bbu.md` but file is `lte/bbu/index.md`
|
||||
- URL encoding: Ukrainian characters in slugs
|
||||
- The SvelteKit catch-all route `[...slug]` may pass the slug differently
|
||||
|
||||
6. Fix the mismatch. Test navigation to at least 10 different pages including:
|
||||
- Root sections (lte/, ran/, mikrotik/)
|
||||
- Nested pages (lte/bbu, ran/srsenb-config)
|
||||
- Glossary terms (glossary/prb)
|
||||
- Deep nesting if any
|
||||
|
||||
---
|
||||
|
||||
## SECTION B: Fix Web Deployment
|
||||
|
||||
The web version must keep working. Test and fix:
|
||||
|
||||
1. Check that `backend/content.py` imports work:
|
||||
- `from wiki_frontmatter import ArticleFrontmatter`
|
||||
- `from wikilinks import WikiLinksExtension`
|
||||
- `from backlinks import BacklinksIndex`
|
||||
- `from admonitions import AdmonitionsExtension`
|
||||
|
||||
If any import fails, fix the module.
|
||||
|
||||
2. Add the admonitions extension to the markdown pipeline in content.py
|
||||
(wikilinks was already integrated, verify admonitions too)
|
||||
|
||||
3. Make sure the backlinks API endpoint in main.py works:
|
||||
- GET /api/pages/{slug:path}/backlinks
|
||||
- Should return { "slug": "...", "backlinks": [...], "count": N }
|
||||
|
||||
4. Add grade/status/category to the page API response:
|
||||
- GET /api/pages/{slug} should now include grade, status, category fields
|
||||
|
||||
5. Create a simple test script `scripts/test_web.py`:
|
||||
```python
|
||||
# Test that backend starts and key endpoints work
|
||||
import requests
|
||||
BASE = "http://localhost:8000"
|
||||
|
||||
# Test navigation
|
||||
r = requests.get(f"{BASE}/api/navigation")
|
||||
assert r.status_code == 200
|
||||
nav = r.json()
|
||||
print(f"Navigation: {len(nav)} sections")
|
||||
|
||||
# Test page load
|
||||
r = requests.get(f"{BASE}/api/pages/index")
|
||||
assert r.status_code == 200
|
||||
print(f"Home page: {r.json().get('title', 'OK')}")
|
||||
|
||||
# Test search
|
||||
r = requests.get(f"{BASE}/api/search?q=LTE")
|
||||
assert r.status_code == 200
|
||||
print(f"Search 'LTE': {len(r.json())} results")
|
||||
|
||||
# Test backlinks
|
||||
r = requests.get(f"{BASE}/api/pages/glossary/enb/backlinks")
|
||||
print(f"Backlinks for eNB: {r.status_code}")
|
||||
|
||||
print("\nAll tests passed!")
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## SECTION C: Frontend Wiki Components — Full Integration
|
||||
|
||||
### C.1: Article Grade Badge on Pages
|
||||
|
||||
In the wiki page view (`frontend/src/routes/[...slug]/+page.svelte` or equivalent):
|
||||
- Import ArticleGrade component
|
||||
- Display the grade badge next to the page title
|
||||
- The grade comes from the page API response (field: `grade`)
|
||||
- If no grade, don't show badge
|
||||
- Style: small badge inline with title, not a separate block
|
||||
|
||||
### C.2: Breadcrumbs Component
|
||||
|
||||
Create/update `frontend/src/lib/components/wiki/Breadcrumbs.svelte`:
|
||||
```svelte
|
||||
<!-- Example: Головна > LTE > BBU Setup -->
|
||||
<nav class="breadcrumbs">
|
||||
<a href="/">Головна</a>
|
||||
<span class="separator">/</span>
|
||||
<a href="/lte">LTE</a>
|
||||
<span class="separator">/</span>
|
||||
<span class="current">BBU Setup</span>
|
||||
</nav>
|
||||
```
|
||||
- Generate from current page slug
|
||||
- Each segment is a link except the last
|
||||
- Use titles from navigation tree if available, otherwise humanize slug
|
||||
- Works in both web and desktop mode
|
||||
- Integrate into the page layout — show above article title
|
||||
|
||||
### C.3: Admonition CSS
|
||||
|
||||
Add styles for admonition boxes to the global CSS or a component:
|
||||
```css
|
||||
.admonition {
|
||||
border-left: 4px solid;
|
||||
border-radius: 4px;
|
||||
padding: 12px 16px;
|
||||
margin: 16px 0;
|
||||
}
|
||||
.admonition-note { border-color: #3b82f6; background: rgba(59,130,246,0.1); }
|
||||
.admonition-warning { border-color: #f59e0b; background: rgba(245,158,11,0.1); }
|
||||
.admonition-tip { border-color: #10b981; background: rgba(16,185,129,0.1); }
|
||||
.admonition-danger { border-color: #ef4444; background: rgba(239,68,68,0.1); }
|
||||
|
||||
/* Dark mode */
|
||||
:global(.dark) .admonition-note { background: rgba(59,130,246,0.15); }
|
||||
:global(.dark) .admonition-warning { background: rgba(245,158,11,0.15); }
|
||||
:global(.dark) .admonition-tip { background: rgba(16,185,129,0.15); }
|
||||
:global(.dark) .admonition-danger { background: rgba(239,68,68,0.15); }
|
||||
|
||||
.admonition-title {
|
||||
font-weight: 600;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.admonition-icon {
|
||||
margin-right: 8px;
|
||||
}
|
||||
```
|
||||
|
||||
### C.4: Wiki-Link CSS
|
||||
|
||||
Add styles for wiki-links:
|
||||
```css
|
||||
.wiki-link {
|
||||
color: #3b82f6;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px dotted #3b82f6;
|
||||
}
|
||||
.wiki-link:hover {
|
||||
border-bottom-style: solid;
|
||||
}
|
||||
.red-link {
|
||||
color: #ef4444;
|
||||
border-bottom-color: #ef4444;
|
||||
}
|
||||
.red-link:hover::after {
|
||||
content: " (сторінку не знайдено)";
|
||||
font-size: 0.75em;
|
||||
color: #9ca3af;
|
||||
}
|
||||
```
|
||||
|
||||
### C.5: Backlinks Panel Integration
|
||||
|
||||
In the page view, after the article content:
|
||||
- Show BacklinksPanel component
|
||||
- Pass current page slug
|
||||
- Works in both web (API) and desktop (Tauri IPC)
|
||||
- Only show if there are backlinks (don't show empty panel)
|
||||
|
||||
### C.6: Table of Contents (sidebar)
|
||||
|
||||
If the page has headings, generate a table of contents:
|
||||
- Extract h2/h3 from rendered HTML or use TOC data from backend
|
||||
- Show as a floating sidebar on wide screens (>1200px)
|
||||
- Collapsible on smaller screens
|
||||
- Highlight current section on scroll (intersection observer)
|
||||
- Works in both modes
|
||||
|
||||
---
|
||||
|
||||
## SECTION D: Search Integration for Desktop
|
||||
|
||||
1. Test Tantivy search in Tauri:
|
||||
- The search command should be wired to the Search component
|
||||
- Type in search bar → results appear
|
||||
- Cyrillic text should work (test: "мережа", "антена", "LTE")
|
||||
|
||||
2. If search doesn't work, debug:
|
||||
- Is the search index built on startup? Check Rust logs
|
||||
- Are content files found? Check content path resolution
|
||||
- Is the query reaching the search command?
|
||||
|
||||
3. Search results should show:
|
||||
- Page title
|
||||
- Brief excerpt (first 150 chars of content)
|
||||
- Click navigates to page
|
||||
|
||||
4. Keyboard shortcut: Ctrl+K should focus the search bar (already exists in web, verify in desktop)
|
||||
|
||||
---
|
||||
|
||||
## SECTION E: Content Quality Pass
|
||||
|
||||
### E.1: Content Audit Script
|
||||
|
||||
Create `scripts/analyze_content.py`:
|
||||
- Scan all .md files in content/
|
||||
- For each file report: has_frontmatter, word_count, has_code_blocks, grade, broken_wiki_links
|
||||
- Summary: total articles, by grade, articles needing work
|
||||
- Print actionable output
|
||||
|
||||
### E.2: Add More Glossary Terms (20 more)
|
||||
|
||||
Create glossary entries with proper frontmatter (grade: B, category: glossary):
|
||||
|
||||
**Radio/RF terms:**
|
||||
- SGW (Serving Gateway)
|
||||
- PGW (PDN Gateway)
|
||||
- HSS (Home Subscriber Server)
|
||||
- RSRP (Reference Signal Received Power)
|
||||
- RSRQ (Reference Signal Received Quality)
|
||||
- SINR (Signal to Interference plus Noise Ratio)
|
||||
- EARFCN (E-UTRA Absolute Radio Frequency Channel Number)
|
||||
- OFDM (Orthogonal Frequency Division Multiplexing)
|
||||
- MIMO (Multiple Input Multiple Output)
|
||||
- QoS (Quality of Service)
|
||||
|
||||
**Infrastructure terms:**
|
||||
- WireGuard
|
||||
- MikroTik
|
||||
- Mesh Network
|
||||
- VLAN (Virtual LAN)
|
||||
- BGP (Border Gateway Protocol)
|
||||
- mTLS (Mutual TLS)
|
||||
- Caddy (Web Server)
|
||||
|
||||
**Protocol terms:**
|
||||
- S1AP (S1 Application Protocol)
|
||||
- GTP (GPRS Tunnelling Protocol)
|
||||
- SCTP (Stream Control Transmission Protocol)
|
||||
|
||||
Each glossary term should:
|
||||
- Have title in English with Ukrainian description
|
||||
- Use [[wiki-links]] to cross-reference other terms
|
||||
- Include: what it is, why it matters for UMTC, key parameters
|
||||
- Be 100-300 words
|
||||
|
||||
### E.3: Upgrade 5 Key Articles to Grade B
|
||||
|
||||
Pick the 5 most important articles and upgrade them:
|
||||
- Add proper frontmatter with all fields
|
||||
- Add :::note and :::warning admonitions where useful
|
||||
- Add [[wiki-links]] to glossary terms
|
||||
- Add "Див. також" (See also) section with related articles
|
||||
- Verify technical accuracy
|
||||
- Set grade: B
|
||||
|
||||
Good candidates:
|
||||
- Main LTE overview
|
||||
- srsENB configuration
|
||||
- WireGuard setup
|
||||
- Open5GS overview
|
||||
- MikroTik basics
|
||||
|
||||
---
|
||||
|
||||
## SECTION F: Desktop App Polish
|
||||
|
||||
### F.1: Window Title
|
||||
|
||||
Show current page title in the window title bar:
|
||||
`UMTC Wiki — {Page Title}`
|
||||
|
||||
### F.2: Keyboard Navigation
|
||||
|
||||
- Arrow keys in sidebar to navigate
|
||||
- Enter to open selected item
|
||||
- Backspace to go back
|
||||
- Ctrl+K for search (verify)
|
||||
|
||||
### F.3: Error Handling
|
||||
|
||||
- If page not found, show a friendly Ukrainian message instead of generic 404
|
||||
- If content directory is missing, show setup instructions
|
||||
- If search index fails to build, log error but don't crash
|
||||
|
||||
### F.4: About Dialog
|
||||
|
||||
Add a simple about/info accessible from a gear icon or Help menu:
|
||||
- UMTC Wiki v2.0
|
||||
- Built with Tauri + SvelteKit + Rust
|
||||
- Content articles count
|
||||
- "Офлайн документація для УМТЗ"
|
||||
|
||||
---
|
||||
|
||||
## SECTION G: Production Builds
|
||||
|
||||
### G.1: Web Docker Build Test
|
||||
|
||||
Update docker-compose.yml if needed to include new backend modules.
|
||||
Make sure Dockerfile copies:
|
||||
- backend/wiki_frontmatter.py
|
||||
- backend/wikilinks.py
|
||||
- backend/backlinks.py
|
||||
- backend/admonitions.py
|
||||
- All content/ files
|
||||
|
||||
### G.2: Tauri Production Build
|
||||
|
||||
Run `npx tauri build` and fix any remaining compilation errors.
|
||||
Report the output binary size and location.
|
||||
|
||||
---
|
||||
|
||||
## Order of Operations
|
||||
|
||||
Do these in order — each section builds on the previous:
|
||||
|
||||
1. **SECTION A** — Fix 404 bug (CRITICAL, everything depends on this)
|
||||
2. **SECTION B** — Verify web backend
|
||||
3. **SECTION C** — Frontend components
|
||||
4. **SECTION D** — Search
|
||||
5. **SECTION E** — Content
|
||||
6. **SECTION F** — Desktop polish
|
||||
7. **SECTION G** — Production builds
|
||||
|
||||
Report after each section with:
|
||||
- What was done
|
||||
- What files were changed
|
||||
- Any issues found
|
||||
- Ready for next section?
|
||||
|
||||
Think hard about edge cases. Don't break existing functionality.
|
||||
Good luck! 🚀
|
||||
@@ -268,6 +268,358 @@ async def get_buildings(
|
||||
}
|
||||
|
||||
|
||||
@router.post("/link-budget")
|
||||
async def calculate_link_budget(request: dict):
|
||||
"""Calculate point-to-point link budget.
|
||||
|
||||
Body: {
|
||||
"tx_lat": 48.46, "tx_lon": 35.04,
|
||||
"tx_power_dbm": 43, "tx_gain_dbi": 18, "tx_cable_loss_db": 2,
|
||||
"tx_height_m": 30,
|
||||
"rx_lat": 48.50, "rx_lon": 35.10,
|
||||
"rx_gain_dbi": 0, "rx_cable_loss_db": 0, "rx_sensitivity_dbm": -100,
|
||||
"rx_height_m": 1.5,
|
||||
"frequency_mhz": 1800
|
||||
}
|
||||
"""
|
||||
import math
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
# Extract parameters with defaults
|
||||
tx_lat = request.get("tx_lat", 48.46)
|
||||
tx_lon = request.get("tx_lon", 35.04)
|
||||
tx_power_dbm = request.get("tx_power_dbm", 43)
|
||||
tx_gain_dbi = request.get("tx_gain_dbi", 18)
|
||||
tx_cable_loss_db = request.get("tx_cable_loss_db", 2)
|
||||
tx_height_m = request.get("tx_height_m", 30)
|
||||
|
||||
rx_lat = request.get("rx_lat", 48.50)
|
||||
rx_lon = request.get("rx_lon", 35.10)
|
||||
rx_gain_dbi = request.get("rx_gain_dbi", 0)
|
||||
rx_cable_loss_db = request.get("rx_cable_loss_db", 0)
|
||||
rx_sensitivity_dbm = request.get("rx_sensitivity_dbm", -100)
|
||||
rx_height_m = request.get("rx_height_m", 1.5)
|
||||
|
||||
freq = request.get("frequency_mhz", 1800)
|
||||
|
||||
# Calculate distance
|
||||
distance_m = terrain_service.haversine_distance(tx_lat, tx_lon, rx_lat, rx_lon)
|
||||
distance_km = distance_m / 1000
|
||||
|
||||
# Get elevations
|
||||
tx_elev = await terrain_service.get_elevation(tx_lat, tx_lon)
|
||||
rx_elev = await terrain_service.get_elevation(rx_lat, rx_lon)
|
||||
|
||||
# EIRP
|
||||
eirp_dbm = tx_power_dbm + tx_gain_dbi - tx_cable_loss_db
|
||||
|
||||
# Free space path loss
|
||||
if distance_km > 0:
|
||||
fspl_db = 20 * math.log10(distance_km) + 20 * math.log10(freq) + 32.45
|
||||
else:
|
||||
fspl_db = 0
|
||||
|
||||
# Terrain profile for LOS check
|
||||
profile = await terrain_service.get_elevation_profile(
|
||||
tx_lat, tx_lon, rx_lat, rx_lon, num_points=100
|
||||
)
|
||||
|
||||
# LOS check - does terrain block line of sight?
|
||||
tx_total_height = tx_elev + tx_height_m
|
||||
rx_total_height = rx_elev + rx_height_m
|
||||
|
||||
terrain_loss_db = 0.0
|
||||
los_clear = True
|
||||
obstructions = []
|
||||
|
||||
for i, point in enumerate(profile):
|
||||
if i == 0 or i == len(profile) - 1:
|
||||
continue
|
||||
# Linear interpolation of LOS line at this point
|
||||
fraction = i / (len(profile) - 1)
|
||||
los_height = tx_total_height + fraction * (rx_total_height - tx_total_height)
|
||||
if point["elevation"] > los_height:
|
||||
los_clear = False
|
||||
obstruction_height = point["elevation"] - los_height
|
||||
obstructions.append({
|
||||
"distance_m": point["distance"],
|
||||
"height_above_los_m": round(obstruction_height, 1),
|
||||
})
|
||||
# Knife-edge diffraction estimate: ~6dB per major obstruction
|
||||
terrain_loss_db += min(6.0, obstruction_height * 0.3)
|
||||
|
||||
# Cap terrain loss at reasonable max
|
||||
terrain_loss_db = min(terrain_loss_db, 40.0)
|
||||
|
||||
total_path_loss = fspl_db + terrain_loss_db
|
||||
|
||||
# Received power
|
||||
rx_power_dbm = eirp_dbm - total_path_loss + rx_gain_dbi - rx_cable_loss_db
|
||||
|
||||
# Link margin
|
||||
margin_db = rx_power_dbm - rx_sensitivity_dbm
|
||||
|
||||
return {
|
||||
"distance_km": round(distance_km, 2),
|
||||
"distance_m": round(distance_m, 1),
|
||||
"tx_elevation_m": round(tx_elev, 1),
|
||||
"rx_elevation_m": round(rx_elev, 1),
|
||||
"eirp_dbm": round(eirp_dbm, 1),
|
||||
"fspl_db": round(fspl_db, 1),
|
||||
"terrain_loss_db": round(terrain_loss_db, 1),
|
||||
"total_path_loss_db": round(total_path_loss, 1),
|
||||
"los_clear": los_clear,
|
||||
"obstructions": obstructions,
|
||||
"rx_power_dbm": round(rx_power_dbm, 1),
|
||||
"margin_db": round(margin_db, 1),
|
||||
"status": "OK" if margin_db >= 0 else "FAIL",
|
||||
"link_budget": {
|
||||
"tx_power_dbm": tx_power_dbm,
|
||||
"tx_gain_dbi": tx_gain_dbi,
|
||||
"tx_cable_loss_db": tx_cable_loss_db,
|
||||
"rx_gain_dbi": rx_gain_dbi,
|
||||
"rx_cable_loss_db": rx_cable_loss_db,
|
||||
"rx_sensitivity_dbm": rx_sensitivity_dbm,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
@router.post("/fresnel-profile")
|
||||
async def fresnel_profile(request: dict):
|
||||
"""Calculate terrain profile with Fresnel zone boundaries.
|
||||
|
||||
Body: {
|
||||
"tx_lat": 48.46, "tx_lon": 35.04, "tx_height_m": 30,
|
||||
"rx_lat": 48.50, "rx_lon": 35.10, "rx_height_m": 1.5,
|
||||
"frequency_mhz": 1800,
|
||||
"num_points": 100
|
||||
}
|
||||
"""
|
||||
import math
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
tx_lat = request.get("tx_lat", 48.46)
|
||||
tx_lon = request.get("tx_lon", 35.04)
|
||||
rx_lat = request.get("rx_lat", 48.50)
|
||||
rx_lon = request.get("rx_lon", 35.10)
|
||||
tx_height = request.get("tx_height_m", 30)
|
||||
rx_height = request.get("rx_height_m", 1.5)
|
||||
freq = request.get("frequency_mhz", 1800)
|
||||
num_points = request.get("num_points", 100)
|
||||
|
||||
# Get terrain profile
|
||||
profile = await terrain_service.get_elevation_profile(
|
||||
tx_lat, tx_lon, rx_lat, rx_lon, num_points
|
||||
)
|
||||
|
||||
if not profile:
|
||||
return {"error": "Could not generate terrain profile"}
|
||||
|
||||
total_distance = profile[-1]["distance"] if profile else 0
|
||||
|
||||
# Get endpoint elevations
|
||||
tx_elev = profile[0]["elevation"]
|
||||
rx_elev = profile[-1]["elevation"]
|
||||
tx_total = tx_elev + tx_height
|
||||
rx_total = rx_elev + rx_height
|
||||
|
||||
wavelength = 300.0 / freq # meters
|
||||
|
||||
# Calculate Fresnel zone at each profile point
|
||||
fresnel_data = []
|
||||
los_blocked = False
|
||||
fresnel_blocked = False
|
||||
worst_clearance = float('inf')
|
||||
fresnel_intrusion_count = 0
|
||||
|
||||
for i, point in enumerate(profile):
|
||||
d1 = point["distance"] # distance from tx
|
||||
d2 = total_distance - d1 # distance to rx
|
||||
|
||||
# LOS height at this point (linear interpolation)
|
||||
if total_distance > 0:
|
||||
fraction = d1 / total_distance
|
||||
else:
|
||||
fraction = 0
|
||||
los_height = tx_total + fraction * (rx_total - tx_total)
|
||||
|
||||
# First Fresnel zone radius
|
||||
if d1 > 0 and d2 > 0 and total_distance > 0:
|
||||
f1_radius = math.sqrt((1 * wavelength * d1 * d2) / total_distance)
|
||||
else:
|
||||
f1_radius = 0
|
||||
|
||||
# Fresnel zone boundaries (height above sea level)
|
||||
fresnel_top = los_height + f1_radius
|
||||
fresnel_bottom = los_height - f1_radius
|
||||
|
||||
# Clearance: how much space between terrain and Fresnel bottom
|
||||
clearance = fresnel_bottom - point["elevation"]
|
||||
|
||||
if clearance < worst_clearance:
|
||||
worst_clearance = clearance
|
||||
|
||||
if point["elevation"] > los_height:
|
||||
los_blocked = True
|
||||
if point["elevation"] > fresnel_bottom:
|
||||
fresnel_blocked = True
|
||||
fresnel_intrusion_count += 1
|
||||
|
||||
fresnel_data.append({
|
||||
"distance": round(point["distance"], 1),
|
||||
"lat": point["lat"],
|
||||
"lon": point["lon"],
|
||||
"terrain_elevation": round(point["elevation"], 1),
|
||||
"los_height": round(los_height, 1),
|
||||
"fresnel_top": round(fresnel_top, 1),
|
||||
"fresnel_bottom": round(fresnel_bottom, 1),
|
||||
"f1_radius": round(f1_radius, 1),
|
||||
"clearance": round(clearance, 1),
|
||||
})
|
||||
|
||||
# Calculate Fresnel clearance percentage
|
||||
fresnel_clear_pct = round(100 * (1 - fresnel_intrusion_count / len(profile)), 1) if profile else 100
|
||||
|
||||
# Estimate additional loss due to Fresnel obstruction
|
||||
if los_blocked:
|
||||
estimated_loss_db = 10 + abs(worst_clearance) * 0.5 # rough estimate
|
||||
elif fresnel_blocked:
|
||||
estimated_loss_db = 3 + (100 - fresnel_clear_pct) * 0.06 # 3-6 dB typical
|
||||
else:
|
||||
estimated_loss_db = 0
|
||||
|
||||
return {
|
||||
"profile": fresnel_data,
|
||||
"total_distance_m": round(total_distance, 1),
|
||||
"tx_elevation": round(tx_elev, 1),
|
||||
"rx_elevation": round(rx_elev, 1),
|
||||
"frequency_mhz": freq,
|
||||
"wavelength_m": round(wavelength, 4),
|
||||
"los_clear": not los_blocked,
|
||||
"fresnel_clear": not fresnel_blocked,
|
||||
"fresnel_clear_pct": fresnel_clear_pct,
|
||||
"worst_clearance_m": round(worst_clearance, 1),
|
||||
"estimated_loss_db": round(estimated_loss_db, 1),
|
||||
"recommendation": (
|
||||
"Clear — excellent link" if not fresnel_blocked
|
||||
else "Fresnel zone partially blocked — expect 3-6 dB additional loss"
|
||||
if not los_blocked
|
||||
else "LOS blocked — significant diffraction loss expected"
|
||||
),
|
||||
}
|
||||
|
||||
|
||||
@router.post("/interference")
|
||||
async def calculate_interference(request: CoverageRequest):
|
||||
"""Calculate C/I (carrier-to-interference) ratio for multi-site scenario.
|
||||
|
||||
Uses the same request format as /calculate but returns interference analysis
|
||||
instead of raw coverage. Requires 2+ sites to be meaningful.
|
||||
|
||||
Returns for each grid point:
|
||||
- C/I ratio (carrier to interference) in dB
|
||||
- Best server index
|
||||
- Best server RSRP
|
||||
"""
|
||||
import numpy as np
|
||||
from app.services.gpu_service import gpu_service
|
||||
|
||||
if len(request.sites) < 2:
|
||||
raise HTTPException(400, "At least 2 sites required for interference analysis")
|
||||
|
||||
if len(request.sites) > 10:
|
||||
raise HTTPException(400, "Maximum 10 sites per request")
|
||||
|
||||
# First calculate coverage for all sites
|
||||
start_time = time.time()
|
||||
cancel_token = CancellationToken()
|
||||
|
||||
try:
|
||||
# Calculate coverage for each site individually
|
||||
site_results = []
|
||||
for site in request.sites:
|
||||
points = await asyncio.wait_for(
|
||||
coverage_service.calculate_coverage(
|
||||
site,
|
||||
request.settings,
|
||||
cancel_token,
|
||||
),
|
||||
timeout=120.0, # 2 min per site
|
||||
)
|
||||
site_results.append(points)
|
||||
|
||||
except asyncio.TimeoutError:
|
||||
cancel_token.cancel()
|
||||
raise HTTPException(408, "Calculation timeout")
|
||||
|
||||
computation_time = time.time() - start_time
|
||||
|
||||
# Build coordinate -> RSRP mapping for each site
|
||||
# We need to align the grids (same points for all sites)
|
||||
coord_set = set()
|
||||
for points in site_results:
|
||||
for p in points:
|
||||
coord_set.add((round(p.lat, 6), round(p.lon, 6)))
|
||||
|
||||
coord_list = sorted(coord_set)
|
||||
|
||||
# Build RSRP arrays aligned to coord_list
|
||||
rsrp_grids = []
|
||||
frequencies = []
|
||||
for idx, (site, points) in enumerate(zip(request.sites, site_results)):
|
||||
# Map coordinates to RSRP
|
||||
point_map = {(round(p.lat, 6), round(p.lon, 6)): p.rsrp for p in points}
|
||||
rsrp_array = np.array([
|
||||
point_map.get(coord, -150) # -150 dBm = no coverage
|
||||
for coord in coord_list
|
||||
], dtype=np.float64)
|
||||
rsrp_grids.append(rsrp_array)
|
||||
frequencies.append(site.frequency)
|
||||
|
||||
# Calculate C/I using GPU service
|
||||
ci_ratio, best_server_idx, best_rsrp = gpu_service.calculate_interference_vectorized(
|
||||
rsrp_grids, frequencies
|
||||
)
|
||||
|
||||
# Build result points with C/I data
|
||||
ci_points = []
|
||||
for i, (lat, lon) in enumerate(coord_list):
|
||||
ci_points.append({
|
||||
"lat": lat,
|
||||
"lon": lon,
|
||||
"ci_ratio_db": round(float(ci_ratio[i]), 1),
|
||||
"best_server_idx": int(best_server_idx[i]),
|
||||
"best_server_rsrp": round(float(best_rsrp[i]), 1),
|
||||
})
|
||||
|
||||
# Calculate statistics
|
||||
ci_values = [p["ci_ratio_db"] for p in ci_points]
|
||||
stats = {
|
||||
"min_ci_db": round(min(ci_values), 1) if ci_values else 0,
|
||||
"max_ci_db": round(max(ci_values), 1) if ci_values else 0,
|
||||
"avg_ci_db": round(sum(ci_values) / len(ci_values), 1) if ci_values else 0,
|
||||
"good_coverage_pct": round(100 * sum(1 for c in ci_values if c >= 10) / len(ci_values), 1) if ci_values else 0,
|
||||
"marginal_coverage_pct": round(100 * sum(1 for c in ci_values if 0 <= c < 10) / len(ci_values), 1) if ci_values else 0,
|
||||
"interference_dominant_pct": round(100 * sum(1 for c in ci_values if c < 0) / len(ci_values), 1) if ci_values else 0,
|
||||
}
|
||||
|
||||
# Check for frequency groups
|
||||
unique_freqs = set(frequencies)
|
||||
freq_groups = {}
|
||||
for freq in unique_freqs:
|
||||
freq_groups[freq] = sum(1 for f in frequencies if f == freq)
|
||||
|
||||
return {
|
||||
"points": ci_points,
|
||||
"count": len(ci_points),
|
||||
"stats": stats,
|
||||
"computation_time": round(computation_time, 2),
|
||||
"sites": [{"name": s.name, "frequency_mhz": s.frequency} for s in request.sites],
|
||||
"frequency_groups": freq_groups,
|
||||
"warning": None if any(c > 1 for c in freq_groups.values()) else "All sites on different frequencies - no co-channel interference",
|
||||
}
|
||||
|
||||
|
||||
def _get_active_models(settings: CoverageSettings) -> List[str]:
|
||||
"""Determine which propagation models are active"""
|
||||
models = [] # Base propagation model added by caller via select_propagation_model()
|
||||
|
||||
@@ -180,3 +180,93 @@ async def get_terrain_file(region: str):
|
||||
if os.path.exists(terrain_path):
|
||||
return FileResponse(terrain_path)
|
||||
raise HTTPException(status_code=404, detail=f"Region '{region}' not found")
|
||||
|
||||
|
||||
@router.get("/status")
|
||||
async def terrain_status():
|
||||
"""Return terrain data availability info."""
|
||||
cached_tiles = terrain_service.get_cached_tiles()
|
||||
cache_size = terrain_service.get_cache_size_mb()
|
||||
|
||||
# Categorize by resolution based on file size
|
||||
srtm1_tiles = []
|
||||
srtm3_tiles = []
|
||||
for t in cached_tiles:
|
||||
tile_path = terrain_service.terrain_path / f"{t}.hgt"
|
||||
try:
|
||||
if tile_path.stat().st_size == 3601 * 3601 * 2:
|
||||
srtm1_tiles.append(t)
|
||||
else:
|
||||
srtm3_tiles.append(t)
|
||||
except Exception:
|
||||
pass
|
||||
|
||||
return {
|
||||
"total_tiles": len(cached_tiles),
|
||||
"srtm1": {
|
||||
"count": len(srtm1_tiles),
|
||||
"resolution_m": 30,
|
||||
"tiles": sorted(srtm1_tiles),
|
||||
},
|
||||
"srtm3": {
|
||||
"count": len(srtm3_tiles),
|
||||
"resolution_m": 90,
|
||||
"tiles": sorted(srtm3_tiles),
|
||||
},
|
||||
"cache_size_mb": round(cache_size, 1),
|
||||
"memory_cached": len(terrain_service._tile_cache),
|
||||
"terra_server": "https://terra.eliah.one",
|
||||
}
|
||||
|
||||
|
||||
@router.post("/download")
|
||||
async def terrain_download(request: dict):
|
||||
"""Pre-download tiles for a region.
|
||||
|
||||
Body: {"center_lat": 48.46, "center_lon": 35.04, "radius_km": 50}
|
||||
Or: {"tiles": ["N48E034", "N48E035", "N47E034", "N47E035"]}
|
||||
"""
|
||||
if "tiles" in request:
|
||||
tile_list = request["tiles"]
|
||||
else:
|
||||
center_lat = request.get("center_lat", 48.46)
|
||||
center_lon = request.get("center_lon", 35.04)
|
||||
radius_km = request.get("radius_km", 50)
|
||||
tile_list = terrain_service.get_required_tiles(center_lat, center_lon, radius_km)
|
||||
|
||||
missing = [t for t in tile_list if not terrain_service.get_tile_path(t).exists()]
|
||||
|
||||
if not missing:
|
||||
return {"status": "ok", "message": "All tiles already cached", "count": len(tile_list)}
|
||||
|
||||
# Download missing tiles
|
||||
downloaded = []
|
||||
failed = []
|
||||
for tile_name in missing:
|
||||
success = await terrain_service.download_tile(tile_name)
|
||||
if success:
|
||||
downloaded.append(tile_name)
|
||||
else:
|
||||
failed.append(tile_name)
|
||||
|
||||
return {
|
||||
"status": "ok",
|
||||
"required": len(tile_list),
|
||||
"already_cached": len(tile_list) - len(missing),
|
||||
"downloaded": downloaded,
|
||||
"failed": failed,
|
||||
}
|
||||
|
||||
|
||||
@router.get("/index")
|
||||
async def terrain_index():
|
||||
"""Fetch tile index from terra server."""
|
||||
import httpx
|
||||
try:
|
||||
async with httpx.AsyncClient(timeout=10.0) as client:
|
||||
resp = await client.get("https://terra.eliah.one/api/index")
|
||||
if resp.status_code == 200:
|
||||
return resp.json()
|
||||
except Exception:
|
||||
pass
|
||||
return {"error": "Could not reach terra.eliah.one", "offline": True}
|
||||
|
||||
@@ -526,19 +526,33 @@ class CoverageService:
|
||||
progress_fn("Loading terrain", 0.25)
|
||||
await asyncio.sleep(0)
|
||||
t_terrain = time.time()
|
||||
|
||||
# Check for missing tiles before attempting download
|
||||
radius_km = settings.radius / 1000.0
|
||||
missing_tiles = self.terrain.get_missing_tiles(site.lat, site.lon, radius_km)
|
||||
if missing_tiles:
|
||||
_clog(f"⚠ Missing terrain tiles: {missing_tiles} - will attempt download")
|
||||
|
||||
tile_names = await self.terrain.ensure_tiles_for_bbox(
|
||||
min_lat, min_lon, max_lat, max_lon
|
||||
)
|
||||
for tn in tile_names:
|
||||
self.terrain._load_tile(tn)
|
||||
|
||||
# Check what actually loaded
|
||||
loaded_tiles = [tn for tn in tile_names if tn in self.terrain._tile_cache]
|
||||
failed_tiles = [tn for tn in tile_names if tn not in self.terrain._tile_cache]
|
||||
if failed_tiles:
|
||||
_clog(f"⚠ TERRAIN WARNING: Failed to load tiles {failed_tiles}. "
|
||||
"Coverage accuracy reduced - using flat terrain for affected areas.")
|
||||
|
||||
site_elevation = self.terrain.get_elevation_sync(site.lat, site.lon)
|
||||
|
||||
point_elevations = {}
|
||||
for lat, lon in grid:
|
||||
point_elevations[(lat, lon)] = self.terrain.get_elevation_sync(lat, lon)
|
||||
terrain_time = time.time() - t_terrain
|
||||
_clog(f"Tiles: {len(tile_names)}, site elev: {site_elevation:.0f}m, "
|
||||
_clog(f"Tiles: {len(loaded_tiles)}/{len(tile_names)} loaded, site elev: {site_elevation:.0f}m, "
|
||||
f"pre-computed {len(grid)} elevations")
|
||||
_clog(f"━━━ PHASE 2 done: {terrain_time:.1f}s ━━━")
|
||||
|
||||
@@ -581,6 +595,60 @@ class CoverageService:
|
||||
f"({len(grid)} points, model={selected_model.name}, freq={site.frequency}MHz, "
|
||||
f"env={env}, backend={'GPU' if gpu_service.available else 'CPU/NumPy'}) ━━━")
|
||||
|
||||
# ━━━ PHASE 2.6: GPU-Vectorized Terrain LOS + Diffraction ━━━
|
||||
# This replaces the per-point LOS calculation in workers
|
||||
t_batch_terrain = time.time()
|
||||
grid_elevs = np.array([point_elevations.get((lat, lon), 0.0) for lat, lon in grid])
|
||||
|
||||
if settings.use_terrain and gpu_service.available:
|
||||
_clog("━━━ PHASE 2.6: Batch terrain LOS (GPU) ━━━")
|
||||
has_los_arr, terrain_loss_arr = gpu_service.batch_terrain_los(
|
||||
site.lat, site.lon, site.height, site_elevation,
|
||||
grid_lats.get() if hasattr(grid_lats, 'get') else grid_lats,
|
||||
grid_lons.get() if hasattr(grid_lons, 'get') else grid_lons,
|
||||
grid_elevs,
|
||||
pre_distances,
|
||||
site.frequency,
|
||||
self.terrain._tile_cache,
|
||||
num_samples=30,
|
||||
)
|
||||
batch_terrain_time = time.time() - t_batch_terrain
|
||||
blocked_count = np.sum(~has_los_arr)
|
||||
_clog(f"━━━ PHASE 2.6 done: {batch_terrain_time:.2f}s "
|
||||
f"({blocked_count}/{len(grid)} blocked by terrain) ━━━")
|
||||
|
||||
# Add terrain results to precomputed dict
|
||||
for i, (lat, lon) in enumerate(grid):
|
||||
if (lat, lon) in precomputed:
|
||||
precomputed[(lat, lon)]['has_los'] = bool(has_los_arr[i])
|
||||
precomputed[(lat, lon)]['terrain_loss'] = float(terrain_loss_arr[i])
|
||||
else:
|
||||
_clog("━━━ PHASE 2.6: Skipped (terrain disabled or no GPU) ━━━")
|
||||
# Initialize with defaults
|
||||
for lat, lon in grid:
|
||||
if (lat, lon) in precomputed:
|
||||
precomputed[(lat, lon)]['has_los'] = True
|
||||
precomputed[(lat, lon)]['terrain_loss'] = 0.0
|
||||
|
||||
# ━━━ PHASE 2.7: GPU-Vectorized Antenna Pattern ━━━
|
||||
if site.azimuth is not None and site.beamwidth and gpu_service.available:
|
||||
t_batch_antenna = time.time()
|
||||
antenna_loss_arr = gpu_service.batch_antenna_pattern(
|
||||
site.lat, site.lon,
|
||||
grid_lats.get() if hasattr(grid_lats, 'get') else grid_lats,
|
||||
grid_lons.get() if hasattr(grid_lons, 'get') else grid_lons,
|
||||
site.azimuth,
|
||||
site.beamwidth,
|
||||
)
|
||||
for i, (lat, lon) in enumerate(grid):
|
||||
if (lat, lon) in precomputed:
|
||||
precomputed[(lat, lon)]['antenna_loss'] = float(antenna_loss_arr[i])
|
||||
_clog(f"━━━ PHASE 2.7: Batch antenna pattern done: {time.time() - t_batch_antenna:.2f}s ━━━")
|
||||
else:
|
||||
for lat, lon in grid:
|
||||
if (lat, lon) in precomputed:
|
||||
precomputed[(lat, lon)]['antenna_loss'] = 0.0
|
||||
|
||||
# ━━━ PHASE 3: Point calculation ━━━
|
||||
dominant_path_service._log_count = 0 # Reset diagnostic counter
|
||||
t_points = time.time()
|
||||
@@ -1117,6 +1185,9 @@ class CoverageService:
|
||||
timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
if point.rsrp >= settings.min_signal:
|
||||
points.append(point)
|
||||
@@ -1139,6 +1210,9 @@ class CoverageService:
|
||||
timing: dict,
|
||||
precomputed_distance: Optional[float] = None,
|
||||
precomputed_path_loss: Optional[float] = None,
|
||||
precomputed_has_los: Optional[bool] = None,
|
||||
precomputed_terrain_loss: Optional[float] = None,
|
||||
precomputed_antenna_loss: Optional[float] = None,
|
||||
) -> CoveragePoint:
|
||||
"""Fully synchronous point calculation. All terrain tiles must be pre-loaded."""
|
||||
|
||||
@@ -1165,29 +1239,37 @@ class CoverageService:
|
||||
)
|
||||
path_loss = model.calculate(prop_input).path_loss_db
|
||||
|
||||
# Antenna pattern
|
||||
antenna_loss = 0.0
|
||||
if site.azimuth is not None and site.beamwidth:
|
||||
# Antenna pattern (use precomputed if available)
|
||||
if precomputed_antenna_loss is not None:
|
||||
antenna_loss = precomputed_antenna_loss
|
||||
elif site.azimuth is not None and site.beamwidth:
|
||||
t0 = time.time()
|
||||
antenna_loss = self._antenna_pattern_loss(
|
||||
site.lat, site.lon, lat, lon, site.azimuth, site.beamwidth
|
||||
)
|
||||
timing["antenna"] += time.time() - t0
|
||||
else:
|
||||
antenna_loss = 0.0
|
||||
|
||||
# Terrain LOS (sync)
|
||||
terrain_loss = 0.0
|
||||
has_los = True
|
||||
if settings.use_terrain:
|
||||
# Terrain LOS (use precomputed if available)
|
||||
if precomputed_has_los is not None and precomputed_terrain_loss is not None:
|
||||
has_los = precomputed_has_los
|
||||
terrain_loss = precomputed_terrain_loss
|
||||
elif settings.use_terrain:
|
||||
t0 = time.time()
|
||||
los_result = self.los.check_line_of_sight_sync(
|
||||
site.lat, site.lon, site.height, lat, lon, 1.5
|
||||
)
|
||||
has_los = los_result["has_los"]
|
||||
terrain_loss = 0.0
|
||||
if not has_los:
|
||||
terrain_loss = self._diffraction_loss(
|
||||
los_result["clearance"], site.frequency
|
||||
)
|
||||
timing["los"] += time.time() - t0
|
||||
else:
|
||||
has_los = True
|
||||
terrain_loss = 0.0
|
||||
|
||||
# Building loss (spatial index)
|
||||
building_loss = 0.0
|
||||
|
||||
@@ -139,6 +139,436 @@ class GPUService:
|
||||
|
||||
return _to_cpu(L)
|
||||
|
||||
def batch_terrain_los(
|
||||
self,
|
||||
site_lat: float,
|
||||
site_lon: float,
|
||||
site_height: float,
|
||||
site_elevation: float,
|
||||
grid_lats: np.ndarray,
|
||||
grid_lons: np.ndarray,
|
||||
grid_elevations: np.ndarray,
|
||||
distances: np.ndarray,
|
||||
frequency_mhz: float,
|
||||
terrain_cache: dict,
|
||||
num_samples: int = 30,
|
||||
) -> tuple[np.ndarray, np.ndarray]:
|
||||
"""Batch compute terrain LOS and diffraction loss for all grid points.
|
||||
|
||||
This is the key GPU optimization — instead of sampling terrain profiles
|
||||
one point at a time, we sample ALL profiles in parallel using vectorized
|
||||
operations.
|
||||
|
||||
Args:
|
||||
site_lat, site_lon: Site coordinates
|
||||
site_height: Antenna height above ground (meters)
|
||||
site_elevation: Ground elevation at site (meters)
|
||||
grid_lats, grid_lons: All grid point coordinates
|
||||
grid_elevations: Ground elevation at each grid point
|
||||
distances: Pre-computed distances from site to each point (meters)
|
||||
frequency_mhz: Frequency for diffraction calculation
|
||||
terrain_cache: Dict[tile_name -> numpy array] from terrain_service
|
||||
num_samples: Number of samples per terrain profile
|
||||
|
||||
Returns:
|
||||
(has_los, terrain_loss) - both shape (N,)
|
||||
has_los: boolean array, True if clear line of sight
|
||||
terrain_loss: diffraction loss in dB (0 if has_los)
|
||||
"""
|
||||
_xp = gpu_manager.get_array_module()
|
||||
N = len(grid_lats)
|
||||
|
||||
if N == 0:
|
||||
return np.array([], dtype=bool), np.array([], dtype=np.float64)
|
||||
|
||||
# Convert inputs to GPU arrays
|
||||
g_lats = _xp.asarray(grid_lats, dtype=_xp.float64)
|
||||
g_lons = _xp.asarray(grid_lons, dtype=_xp.float64)
|
||||
g_elevs = _xp.asarray(grid_elevations, dtype=_xp.float64)
|
||||
g_dists = _xp.asarray(distances, dtype=_xp.float64)
|
||||
|
||||
# Heights
|
||||
tx_total = float(site_elevation + site_height)
|
||||
rx_height = 1.5 # Receiver height above ground
|
||||
|
||||
# Earth curvature constants
|
||||
EARTH_RADIUS = 6371000.0
|
||||
K_FACTOR = 4.0 / 3.0
|
||||
effective_radius = K_FACTOR * EARTH_RADIUS
|
||||
|
||||
# Sample terrain profiles for all points at once
|
||||
# Create sample positions: shape (N, num_samples)
|
||||
t = _xp.linspace(0, 1, num_samples, dtype=_xp.float64) # (S,)
|
||||
t = t.reshape(1, -1) # (1, S)
|
||||
|
||||
# Interpolate lat/lon for all sample points
|
||||
# sample_lats[i, j] = site_lat + t[j] * (grid_lats[i] - site_lat)
|
||||
dlat = g_lats.reshape(-1, 1) - site_lat # (N, 1)
|
||||
dlon = g_lons.reshape(-1, 1) - site_lon # (N, 1)
|
||||
sample_lats = site_lat + t * dlat # (N, S)
|
||||
sample_lons = site_lon + t * dlon # (N, S)
|
||||
|
||||
# Sample distances along path: shape (N, S)
|
||||
sample_dists = t * g_dists.reshape(-1, 1) # (N, S)
|
||||
|
||||
# Get terrain elevations for all samples
|
||||
# This is the tricky part - we need to look up from the tile cache
|
||||
# For GPU efficiency, we'll do this on CPU then transfer
|
||||
sample_lats_cpu = _to_cpu(sample_lats).flatten()
|
||||
sample_lons_cpu = _to_cpu(sample_lons).flatten()
|
||||
|
||||
# Batch elevation lookup from cache
|
||||
sample_elevs_cpu = self._batch_elevation_lookup(
|
||||
sample_lats_cpu, sample_lons_cpu, terrain_cache
|
||||
)
|
||||
sample_elevs = _xp.asarray(sample_elevs_cpu, dtype=_xp.float64).reshape(N, num_samples)
|
||||
|
||||
# Compute LOS line height at each sample point
|
||||
# Linear interpolation from tx to rx
|
||||
rx_total = g_elevs + rx_height # (N,)
|
||||
los_heights = tx_total + t * (rx_total.reshape(-1, 1) - tx_total) # (N, S)
|
||||
|
||||
# Earth curvature correction at each sample
|
||||
total_dist = g_dists.reshape(-1, 1) # (N, 1)
|
||||
d = sample_dists # (N, S)
|
||||
curvature = (d * (total_dist - d)) / (2 * effective_radius) # (N, S)
|
||||
los_heights_corrected = los_heights - curvature # (N, S)
|
||||
|
||||
# Clearance at each sample point
|
||||
clearances = los_heights_corrected - sample_elevs # (N, S)
|
||||
|
||||
# Minimum clearance per profile
|
||||
min_clearances = _xp.min(clearances, axis=1) # (N,)
|
||||
|
||||
# Has LOS if minimum clearance > 0
|
||||
has_los = min_clearances > 0 # (N,)
|
||||
|
||||
# Diffraction loss for points without LOS
|
||||
# Using simplified ITU-R P.526 formula
|
||||
terrain_loss = _xp.zeros(N, dtype=_xp.float64)
|
||||
|
||||
# Only compute diffraction where blocked
|
||||
blocked_mask = ~has_los
|
||||
blocked_clearances = min_clearances[blocked_mask]
|
||||
|
||||
if _xp.any(blocked_mask):
|
||||
# v = |clearance| / 10 (simplified Fresnel parameter)
|
||||
v = _xp.abs(blocked_clearances) / 10.0
|
||||
|
||||
# Diffraction loss formula from ITU-R P.526
|
||||
loss = _xp.where(
|
||||
v <= 0,
|
||||
_xp.zeros_like(v),
|
||||
_xp.where(
|
||||
v < 2.4,
|
||||
6.02 + 9.11 * v + 1.65 * v ** 2,
|
||||
12.95 + 20 * _xp.log10(v)
|
||||
)
|
||||
)
|
||||
# Cap at reasonable max
|
||||
loss = _xp.minimum(loss, 40.0)
|
||||
terrain_loss[blocked_mask] = loss
|
||||
|
||||
return _to_cpu(has_los).astype(bool), _to_cpu(terrain_loss)
|
||||
|
||||
def _batch_elevation_lookup(
|
||||
self,
|
||||
lats: np.ndarray,
|
||||
lons: np.ndarray,
|
||||
terrain_cache: dict,
|
||||
) -> np.ndarray:
|
||||
"""Look up elevations from cached terrain tiles with bilinear interpolation.
|
||||
|
||||
Vectorized implementation: processes per-tile (1-4 tiles) instead of
|
||||
per-point (thousands of points). Uses bilinear interpolation for
|
||||
sub-meter accuracy (vs 15m error with nearest-neighbor at 30m resolution).
|
||||
|
||||
Args:
|
||||
lats, lons: Flattened arrays of coordinates
|
||||
terrain_cache: Dict mapping tile_name -> numpy array
|
||||
|
||||
Returns:
|
||||
elevations: Same shape as input lats
|
||||
"""
|
||||
elevations = np.zeros(len(lats), dtype=np.float64)
|
||||
|
||||
# Vectorized tile identification
|
||||
lat_ints = np.floor(lats).astype(int)
|
||||
lon_ints = np.floor(lons).astype(int)
|
||||
|
||||
# Process per tile (usually 1-4 tiles, not per point)
|
||||
unique_tiles = set(zip(lat_ints, lon_ints))
|
||||
|
||||
for lat_int, lon_int in unique_tiles:
|
||||
lat_letter = 'N' if lat_int >= 0 else 'S'
|
||||
lon_letter = 'E' if lon_int >= 0 else 'W'
|
||||
tile_name = f"{lat_letter}{abs(lat_int):02d}{lon_letter}{abs(lon_int):03d}"
|
||||
|
||||
tile = terrain_cache.get(tile_name)
|
||||
if tile is None:
|
||||
continue
|
||||
|
||||
# Mask for points in this tile
|
||||
mask = (lat_ints == lat_int) & (lon_ints == lon_int)
|
||||
tile_lats = lats[mask]
|
||||
tile_lons = lons[mask]
|
||||
|
||||
size = tile.shape[0]
|
||||
|
||||
# Vectorized bilinear interpolation
|
||||
lat_frac = tile_lats - lat_int
|
||||
lon_frac = tile_lons - lon_int
|
||||
|
||||
row_exact = (1.0 - lat_frac) * (size - 1)
|
||||
col_exact = lon_frac * (size - 1)
|
||||
|
||||
r0 = np.clip(row_exact.astype(int), 0, size - 2)
|
||||
c0 = np.clip(col_exact.astype(int), 0, size - 2)
|
||||
r1 = r0 + 1
|
||||
c1 = c0 + 1
|
||||
|
||||
dr = row_exact - r0
|
||||
dc = col_exact - c0
|
||||
|
||||
# Get four corner values for all points at once
|
||||
z00 = tile[r0, c0].astype(np.float64)
|
||||
z01 = tile[r0, c1].astype(np.float64)
|
||||
z10 = tile[r1, c0].astype(np.float64)
|
||||
z11 = tile[r1, c1].astype(np.float64)
|
||||
|
||||
# Bilinear interpolation (vectorized)
|
||||
result = (z00 * (1 - dr) * (1 - dc) +
|
||||
z01 * (1 - dr) * dc +
|
||||
z10 * dr * (1 - dc) +
|
||||
z11 * dr * dc)
|
||||
|
||||
# Handle void values (-32768) - set to 0
|
||||
void_mask = (z00 == -32768) | (z01 == -32768) | (z10 == -32768) | (z11 == -32768)
|
||||
result[void_mask] = 0.0
|
||||
|
||||
elevations[mask] = result
|
||||
|
||||
return elevations
|
||||
|
||||
def batch_antenna_pattern(
|
||||
self,
|
||||
site_lat: float,
|
||||
site_lon: float,
|
||||
grid_lats: np.ndarray,
|
||||
grid_lons: np.ndarray,
|
||||
azimuth: float,
|
||||
beamwidth: float,
|
||||
) -> np.ndarray:
|
||||
"""Batch compute antenna pattern loss for all grid points.
|
||||
|
||||
Returns antenna_loss in dB, shape (N,)
|
||||
"""
|
||||
_xp = gpu_manager.get_array_module()
|
||||
N = len(grid_lats)
|
||||
|
||||
if N == 0 or azimuth is None or not beamwidth:
|
||||
return np.zeros(N, dtype=np.float64)
|
||||
|
||||
# Convert to radians
|
||||
lat1 = _xp.radians(_xp.float64(site_lat))
|
||||
lon1 = _xp.radians(_xp.float64(site_lon))
|
||||
lat2 = _xp.radians(_xp.asarray(grid_lats, dtype=_xp.float64))
|
||||
lon2 = _xp.radians(_xp.asarray(grid_lons, dtype=_xp.float64))
|
||||
|
||||
# Calculate bearing from site to each point
|
||||
dlon = lon2 - lon1
|
||||
x = _xp.sin(dlon) * _xp.cos(lat2)
|
||||
y = _xp.cos(lat1) * _xp.sin(lat2) - _xp.sin(lat1) * _xp.cos(lat2) * _xp.cos(dlon)
|
||||
bearings = (_xp.degrees(_xp.arctan2(x, y)) + 360) % 360
|
||||
|
||||
# Angle difference from antenna azimuth
|
||||
angle_diff = _xp.abs(bearings - azimuth)
|
||||
angle_diff = _xp.where(angle_diff > 180, 360 - angle_diff, angle_diff)
|
||||
|
||||
# Antenna pattern loss (simplified sector pattern)
|
||||
half_bw = beamwidth / 2
|
||||
in_main = angle_diff <= half_bw
|
||||
loss_main = 3 * (angle_diff / half_bw) ** 2
|
||||
loss_side = 3 + 12 * ((angle_diff - half_bw) / half_bw) ** 2
|
||||
loss_side = _xp.minimum(loss_side, 25.0)
|
||||
|
||||
antenna_loss = _xp.where(in_main, loss_main, loss_side)
|
||||
return _to_cpu(antenna_loss)
|
||||
|
||||
def batch_final_rsrp(
|
||||
self,
|
||||
tx_power: float,
|
||||
tx_gain: float,
|
||||
path_loss: np.ndarray,
|
||||
terrain_loss: np.ndarray,
|
||||
antenna_loss: np.ndarray,
|
||||
building_loss: np.ndarray,
|
||||
vegetation_loss: np.ndarray,
|
||||
rain_loss: np.ndarray,
|
||||
indoor_loss: np.ndarray,
|
||||
atmospheric_loss: np.ndarray,
|
||||
reflection_gain: np.ndarray,
|
||||
fading_margin: float = 0.0,
|
||||
) -> np.ndarray:
|
||||
"""Vectorized final RSRP calculation.
|
||||
|
||||
RSRP = tx_power + tx_gain - path_loss - terrain_loss - antenna_loss
|
||||
- building_loss - vegetation_loss - rain_loss - indoor_loss
|
||||
- atmospheric_loss + reflection_gain - fading_margin
|
||||
|
||||
Returns RSRP in dBm, shape (N,)
|
||||
"""
|
||||
_xp = gpu_manager.get_array_module()
|
||||
|
||||
rsrp = (
|
||||
float(tx_power) + float(tx_gain)
|
||||
- _xp.asarray(path_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(terrain_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(antenna_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(building_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(vegetation_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(rain_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(indoor_loss, dtype=_xp.float64)
|
||||
- _xp.asarray(atmospheric_loss, dtype=_xp.float64)
|
||||
+ _xp.asarray(reflection_gain, dtype=_xp.float64)
|
||||
- float(fading_margin)
|
||||
)
|
||||
|
||||
return _to_cpu(rsrp)
|
||||
|
||||
def calculate_interference(
|
||||
self,
|
||||
rsrp_grids: list,
|
||||
frequencies: list,
|
||||
) -> tuple:
|
||||
"""Calculate C/I (carrier-to-interference) ratio for multi-site scenarios.
|
||||
|
||||
For each grid point:
|
||||
- C = signal strength from strongest (serving) cell
|
||||
- I = sum of signal strengths from all other co-frequency cells
|
||||
- C/I = C(dBm) - 10*log10(sum of linear interference powers)
|
||||
|
||||
Args:
|
||||
rsrp_grids: List of RSRP arrays, one per site, shape (N,) each
|
||||
frequencies: List of frequencies (MHz) for each site
|
||||
|
||||
Returns:
|
||||
(ci_ratio, best_server_idx, best_rsrp)
|
||||
ci_ratio: C/I in dB, shape (N,)
|
||||
best_server_idx: Index of serving cell per point, shape (N,)
|
||||
best_rsrp: RSRP of serving cell per point, shape (N,)
|
||||
"""
|
||||
_xp = gpu_manager.get_array_module()
|
||||
|
||||
if len(rsrp_grids) < 2:
|
||||
# Single site - no interference, return infinity C/I
|
||||
if rsrp_grids:
|
||||
n_points = len(rsrp_grids[0])
|
||||
return (
|
||||
np.full(n_points, 50.0, dtype=np.float64), # 50 dB = effectively no interference
|
||||
np.zeros(n_points, dtype=np.int32),
|
||||
np.array(rsrp_grids[0], dtype=np.float64),
|
||||
)
|
||||
return np.array([]), np.array([]), np.array([])
|
||||
|
||||
# Stack RSRP grids: shape (num_sites, num_points)
|
||||
rsrp_stack = _xp.stack([_xp.asarray(g, dtype=_xp.float64) for g in rsrp_grids], axis=0)
|
||||
num_sites, num_points = rsrp_stack.shape
|
||||
|
||||
# Convert to linear power (mW)
|
||||
rsrp_linear = _xp.power(10.0, rsrp_stack / 10.0)
|
||||
|
||||
# Best server per point
|
||||
best_server_idx = _xp.argmax(rsrp_stack, axis=0)
|
||||
best_rsrp = _xp.take_along_axis(rsrp_stack, best_server_idx[_xp.newaxis, :], axis=0)[0]
|
||||
best_rsrp_linear = _xp.take_along_axis(rsrp_linear, best_server_idx[_xp.newaxis, :], axis=0)[0]
|
||||
|
||||
# Group sites by frequency for co-channel interference
|
||||
freq_array = _xp.asarray(frequencies, dtype=_xp.float64)
|
||||
|
||||
# Calculate interference only from co-frequency sites
|
||||
interference_linear = _xp.zeros(num_points, dtype=_xp.float64)
|
||||
|
||||
for point_idx in range(num_points):
|
||||
serving_site = int(_to_cpu(best_server_idx[point_idx]))
|
||||
serving_freq = frequencies[serving_site]
|
||||
|
||||
# Sum power from all other sites on same frequency
|
||||
for site_idx in range(num_sites):
|
||||
if site_idx != serving_site and frequencies[site_idx] == serving_freq:
|
||||
interference_linear[point_idx] += rsrp_linear[site_idx, point_idx]
|
||||
|
||||
# C/I ratio in dB
|
||||
# Avoid log10(0) with small epsilon
|
||||
epsilon = 1e-30
|
||||
ci_ratio = 10 * _xp.log10(best_rsrp_linear / (interference_linear + epsilon))
|
||||
|
||||
# Clip to reasonable range (-20 to 50 dB)
|
||||
ci_ratio = _xp.clip(ci_ratio, -20, 50)
|
||||
|
||||
return (
|
||||
_to_cpu(ci_ratio),
|
||||
_to_cpu(best_server_idx).astype(np.int32),
|
||||
_to_cpu(best_rsrp),
|
||||
)
|
||||
|
||||
def calculate_interference_vectorized(
|
||||
self,
|
||||
rsrp_grids: list,
|
||||
frequencies: list,
|
||||
) -> tuple:
|
||||
"""Fully vectorized C/I calculation (faster for GPU).
|
||||
|
||||
Same as calculate_interference but avoids Python loops.
|
||||
"""
|
||||
_xp = gpu_manager.get_array_module()
|
||||
|
||||
if len(rsrp_grids) < 2:
|
||||
if rsrp_grids:
|
||||
n_points = len(rsrp_grids[0])
|
||||
return (
|
||||
np.full(n_points, 50.0, dtype=np.float64),
|
||||
np.zeros(n_points, dtype=np.int32),
|
||||
np.array(rsrp_grids[0], dtype=np.float64),
|
||||
)
|
||||
return np.array([]), np.array([]), np.array([])
|
||||
|
||||
# Stack RSRP grids: shape (num_sites, num_points)
|
||||
rsrp_stack = _xp.stack([_xp.asarray(g, dtype=_xp.float64) for g in rsrp_grids], axis=0)
|
||||
num_sites, num_points = rsrp_stack.shape
|
||||
|
||||
# Convert to linear power (mW)
|
||||
rsrp_linear = _xp.power(10.0, rsrp_stack / 10.0)
|
||||
|
||||
# Best server per point
|
||||
best_server_idx = _xp.argmax(rsrp_stack, axis=0)
|
||||
best_rsrp = _xp.take_along_axis(rsrp_stack, best_server_idx[_xp.newaxis, :], axis=0)[0]
|
||||
best_rsrp_linear = _xp.take_along_axis(rsrp_linear, best_server_idx[_xp.newaxis, :], axis=0)[0]
|
||||
|
||||
# Create frequency match matrix: (num_sites, num_sites)
|
||||
freq_array = _xp.asarray(frequencies, dtype=_xp.float64)
|
||||
freq_match = freq_array[:, _xp.newaxis] == freq_array[_xp.newaxis, :]
|
||||
|
||||
# Total power from all sites
|
||||
total_power = _xp.sum(rsrp_linear, axis=0)
|
||||
|
||||
# For simplified calculation (all sites same frequency):
|
||||
# Interference = total - serving
|
||||
interference_linear = total_power - best_rsrp_linear
|
||||
|
||||
# C/I ratio in dB
|
||||
epsilon = 1e-30
|
||||
ci_ratio = 10 * _xp.log10(best_rsrp_linear / (interference_linear + epsilon))
|
||||
|
||||
# Clip to reasonable range
|
||||
ci_ratio = _xp.clip(ci_ratio, -20, 50)
|
||||
|
||||
return (
|
||||
_to_cpu(ci_ratio),
|
||||
_to_cpu(best_server_idx).astype(np.int32),
|
||||
_to_cpu(best_rsrp),
|
||||
)
|
||||
|
||||
|
||||
# Singleton
|
||||
gpu_service = GPUService()
|
||||
|
||||
@@ -226,6 +226,9 @@ def _ray_process_chunk_impl(chunk, terrain_cache, buildings, osm_data, config):
|
||||
config['site_elevation'], point_elev, timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
if point.rsrp >= settings.min_signal:
|
||||
results.append(point.model_dump())
|
||||
@@ -535,6 +538,9 @@ def _pool_worker_process_chunk(args):
|
||||
config['site_elevation'], point_elev, timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
if point.rsrp >= settings.min_signal:
|
||||
results.append(point.model_dump())
|
||||
@@ -654,6 +660,9 @@ def _pool_worker_shm_chunk(args):
|
||||
config['site_elevation'], point_elev, timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
if point.rsrp >= settings.min_signal:
|
||||
results.append(point.model_dump())
|
||||
@@ -816,6 +825,9 @@ def _pool_worker_shm_shared(args):
|
||||
site_elev, point_elev, timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
|
||||
if i < 3:
|
||||
@@ -1134,6 +1146,9 @@ def _calculate_sequential(
|
||||
site_elevation, point_elev, timing,
|
||||
precomputed_distance=pre.get('distance') if pre else None,
|
||||
precomputed_path_loss=pre.get('path_loss') if pre else None,
|
||||
precomputed_has_los=pre.get('has_los') if pre else None,
|
||||
precomputed_terrain_loss=pre.get('terrain_loss') if pre else None,
|
||||
precomputed_antenna_loss=pre.get('antenna_loss') if pre else None,
|
||||
)
|
||||
if point.rsrp >= settings.min_signal:
|
||||
results.append(point.model_dump())
|
||||
|
||||
@@ -20,8 +20,24 @@ class TerrainService:
|
||||
"""
|
||||
|
||||
SRTM_SOURCES = [
|
||||
"https://elevation-tiles-prod.s3.amazonaws.com/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
"https://s3.amazonaws.com/elevation-tiles-prod/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
# Our tile server — SRTM1 (30m) preferred, uncompressed
|
||||
{
|
||||
"url": "https://terra.eliah.one/srtm1/{tile_name}.hgt",
|
||||
"compressed": False,
|
||||
"resolution": "srtm1",
|
||||
},
|
||||
# Our tile server — SRTM3 (90m) fallback
|
||||
{
|
||||
"url": "https://terra.eliah.one/srtm3/{tile_name}.hgt",
|
||||
"compressed": False,
|
||||
"resolution": "srtm3",
|
||||
},
|
||||
# Public AWS mirror — SRTM1, gzip compressed
|
||||
{
|
||||
"url": "https://elevation-tiles-prod.s3.amazonaws.com/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
"compressed": True,
|
||||
"resolution": "srtm1",
|
||||
},
|
||||
]
|
||||
|
||||
def __init__(self):
|
||||
@@ -48,7 +64,7 @@ class TerrainService:
|
||||
return self.terrain_path / f"{tile_name}.hgt"
|
||||
|
||||
async def download_tile(self, tile_name: str) -> bool:
|
||||
"""Download SRTM tile if not cached locally"""
|
||||
"""Download SRTM tile from configured sources, preferring highest resolution."""
|
||||
tile_path = self.get_tile_path(tile_name)
|
||||
|
||||
if tile_path.exists():
|
||||
@@ -56,33 +72,45 @@ class TerrainService:
|
||||
|
||||
lat_dir = tile_name[:3] # e.g., "N48"
|
||||
|
||||
async with httpx.AsyncClient(timeout=60.0) as client:
|
||||
for source_url in self.SRTM_SOURCES:
|
||||
url = source_url.format(lat_dir=lat_dir, tile_name=tile_name)
|
||||
async with httpx.AsyncClient(timeout=60.0, follow_redirects=True) as client:
|
||||
for source in self.SRTM_SOURCES:
|
||||
url = source["url"].format(lat_dir=lat_dir, tile_name=tile_name)
|
||||
try:
|
||||
response = await client.get(url)
|
||||
|
||||
if response.status_code == 200:
|
||||
data = response.content
|
||||
|
||||
if url.endswith('.gz'):
|
||||
data = gzip.decompress(data)
|
||||
elif url.endswith('.zip'):
|
||||
with zipfile.ZipFile(io.BytesIO(data)) as zf:
|
||||
for name in zf.namelist():
|
||||
if name.endswith('.hgt'):
|
||||
data = zf.read(name)
|
||||
break
|
||||
# Skip empty responses
|
||||
if len(data) < 1000:
|
||||
continue
|
||||
|
||||
if source["compressed"]:
|
||||
if url.endswith('.gz'):
|
||||
data = gzip.decompress(data)
|
||||
elif url.endswith('.zip'):
|
||||
with zipfile.ZipFile(io.BytesIO(data)) as zf:
|
||||
for name in zf.namelist():
|
||||
if name.endswith('.hgt'):
|
||||
data = zf.read(name)
|
||||
break
|
||||
|
||||
# Validate tile size (SRTM1: 25,934,402 bytes, SRTM3: 2,884,802 bytes)
|
||||
if len(data) not in (3601 * 3601 * 2, 1201 * 1201 * 2):
|
||||
print(f"[Terrain] Invalid tile size {len(data)} from {url}")
|
||||
continue
|
||||
|
||||
tile_path.write_bytes(data)
|
||||
print(f"[Terrain] Downloaded {tile_name} ({len(data)} bytes)")
|
||||
res = source["resolution"]
|
||||
size_mb = len(data) / 1048576
|
||||
print(f"[Terrain] Downloaded {tile_name} ({res}, {size_mb:.1f} MB)")
|
||||
return True
|
||||
|
||||
except Exception as e:
|
||||
print(f"[Terrain] Failed from {url}: {e}")
|
||||
continue
|
||||
|
||||
print(f"[Terrain] Could not download {tile_name}")
|
||||
print(f"[Terrain] Could not download {tile_name} from any source")
|
||||
return False
|
||||
|
||||
def _load_tile(self, tile_name: str) -> Optional[np.ndarray]:
|
||||
@@ -149,56 +177,179 @@ class TerrainService:
|
||||
|
||||
return self._load_tile(tile_name)
|
||||
|
||||
def _bilinear_sample(self, tile: np.ndarray, lat: float, lon: float) -> float:
|
||||
"""Sample elevation with bilinear interpolation for sub-meter accuracy.
|
||||
|
||||
SRTM1 at 30m means nearest-neighbor can have 15m positional error.
|
||||
Bilinear interpolation reduces this to sub-meter accuracy.
|
||||
"""
|
||||
size = tile.shape[0]
|
||||
|
||||
# Tile southwest corner
|
||||
lat_int = int(lat) if lat >= 0 else int(lat) - 1
|
||||
lon_int = int(lon) if lon >= 0 else int(lon) - 1
|
||||
|
||||
# Fractional position within tile (0.0 to 1.0)
|
||||
lat_frac = lat - lat_int # 0 = south edge, 1 = north edge
|
||||
lon_frac = lon - lon_int # 0 = west edge, 1 = east edge
|
||||
|
||||
# Convert to row/col (note: rows go north to south!)
|
||||
row_exact = (1.0 - lat_frac) * (size - 1) # 0 = north, size-1 = south
|
||||
col_exact = lon_frac * (size - 1) # 0 = west, size-1 = east
|
||||
|
||||
# Four surrounding grid points
|
||||
r0 = int(row_exact)
|
||||
c0 = int(col_exact)
|
||||
r1 = min(r0 + 1, size - 1)
|
||||
c1 = min(c0 + 1, size - 1)
|
||||
|
||||
# Fractional position between grid points
|
||||
dr = row_exact - r0
|
||||
dc = col_exact - c0
|
||||
|
||||
# Get four corner values
|
||||
z00 = tile[r0, c0]
|
||||
z01 = tile[r0, c1]
|
||||
z10 = tile[r1, c0]
|
||||
z11 = tile[r1, c1]
|
||||
|
||||
# Handle void (-32768) values - fall back to nearest valid
|
||||
void_val = -32768
|
||||
corners = [(z00, r0, c0), (z01, r0, c1), (z10, r1, c0), (z11, r1, c1)]
|
||||
if z00 == void_val or z01 == void_val or z10 == void_val or z11 == void_val:
|
||||
valid = [(z, r, c) for z, r, c in corners if z != void_val]
|
||||
if not valid:
|
||||
return 0.0
|
||||
# Return nearest valid value
|
||||
return float(valid[0][0])
|
||||
|
||||
# Bilinear interpolation
|
||||
elevation = (z00 * (1 - dr) * (1 - dc) +
|
||||
z01 * (1 - dr) * dc +
|
||||
z10 * dr * (1 - dc) +
|
||||
z11 * dr * dc)
|
||||
|
||||
return float(elevation)
|
||||
|
||||
async def get_elevation(self, lat: float, lon: float) -> float:
|
||||
"""Get elevation at specific coordinate (meters above sea level)"""
|
||||
"""Get elevation at specific coordinate with bilinear interpolation."""
|
||||
tile_name = self.get_tile_name(lat, lon)
|
||||
tile = await self.load_tile(tile_name)
|
||||
|
||||
if tile is None:
|
||||
return 0.0
|
||||
|
||||
size = tile.shape[0]
|
||||
|
||||
# Calculate position within tile
|
||||
lat_int = int(lat) if lat >= 0 else int(lat) - 1
|
||||
lon_int = int(lon) if lon >= 0 else int(lon) - 1
|
||||
|
||||
lat_frac = lat - lat_int
|
||||
lon_frac = lon - lon_int
|
||||
|
||||
# Row 0 = north edge, last row = south edge
|
||||
row = int((1 - lat_frac) * (size - 1))
|
||||
col = int(lon_frac * (size - 1))
|
||||
|
||||
row = max(0, min(row, size - 1))
|
||||
col = max(0, min(col, size - 1))
|
||||
|
||||
elevation = tile[row, col]
|
||||
|
||||
# -32768 = void/no data
|
||||
if elevation == -32768:
|
||||
return 0.0
|
||||
|
||||
return float(elevation)
|
||||
return self._bilinear_sample(tile, lat, lon)
|
||||
|
||||
def get_elevation_sync(self, lat: float, lon: float) -> float:
|
||||
"""Sync elevation lookup from memory cache. Returns 0.0 if tile not loaded."""
|
||||
"""Sync elevation lookup with bilinear interpolation. Returns 0.0 if tile not loaded."""
|
||||
tile_name = self.get_tile_name(lat, lon)
|
||||
tile = self._tile_cache.get(tile_name)
|
||||
if tile is None:
|
||||
return 0.0
|
||||
|
||||
size = tile.shape[0]
|
||||
lat_int = int(lat) if lat >= 0 else int(lat) - 1
|
||||
lon_int = int(lon) if lon >= 0 else int(lon) - 1
|
||||
return self._bilinear_sample(tile, lat, lon)
|
||||
|
||||
row = int((1 - (lat - lat_int)) * (size - 1))
|
||||
col = int((lon - lon_int) * (size - 1))
|
||||
row = max(0, min(row, size - 1))
|
||||
col = max(0, min(col, size - 1))
|
||||
def get_elevations_batch(self, lats: np.ndarray, lons: np.ndarray) -> np.ndarray:
|
||||
"""Vectorized elevation lookup with bilinear interpolation.
|
||||
|
||||
elevation = tile[row, col]
|
||||
return 0.0 if elevation == -32768 else float(elevation)
|
||||
Handles points spanning multiple tiles efficiently.
|
||||
Groups points by tile, processes each tile with full NumPy vectorization.
|
||||
Tiles must be pre-loaded into memory cache.
|
||||
|
||||
Args:
|
||||
lats: Array of latitudes
|
||||
lons: Array of longitudes
|
||||
|
||||
Returns:
|
||||
Array of elevations (0.0 for missing tiles or void data)
|
||||
"""
|
||||
elevations = np.zeros(len(lats), dtype=np.float32)
|
||||
|
||||
# Compute tile indices for each point
|
||||
lat_ints = np.floor(lats).astype(int)
|
||||
lon_ints = np.floor(lons).astype(int)
|
||||
|
||||
# Group by tile using unique key
|
||||
unique_tiles = set(zip(lat_ints, lon_ints))
|
||||
|
||||
for lat_int, lon_int in unique_tiles:
|
||||
# Get tile name
|
||||
lat_letter = 'N' if lat_int >= 0 else 'S'
|
||||
lon_letter = 'E' if lon_int >= 0 else 'W'
|
||||
tile_name = f"{lat_letter}{abs(lat_int):02d}{lon_letter}{abs(lon_int):03d}"
|
||||
|
||||
tile = self._tile_cache.get(tile_name)
|
||||
if tile is None:
|
||||
continue
|
||||
|
||||
# Mask for points in this tile
|
||||
mask = (lat_ints == lat_int) & (lon_ints == lon_int)
|
||||
tile_lats = lats[mask]
|
||||
tile_lons = lons[mask]
|
||||
|
||||
size = tile.shape[0]
|
||||
|
||||
# Vectorized bilinear interpolation for all points in this tile
|
||||
lat_frac = tile_lats - lat_int
|
||||
lon_frac = tile_lons - lon_int
|
||||
|
||||
row_exact = (1.0 - lat_frac) * (size - 1)
|
||||
col_exact = lon_frac * (size - 1)
|
||||
|
||||
r0 = np.clip(row_exact.astype(int), 0, size - 2)
|
||||
c0 = np.clip(col_exact.astype(int), 0, size - 2)
|
||||
r1 = r0 + 1
|
||||
c1 = c0 + 1
|
||||
|
||||
dr = row_exact - r0
|
||||
dc = col_exact - c0
|
||||
|
||||
# Get four corner values for all points at once
|
||||
z00 = tile[r0, c0].astype(np.float32)
|
||||
z01 = tile[r0, c1].astype(np.float32)
|
||||
z10 = tile[r1, c0].astype(np.float32)
|
||||
z11 = tile[r1, c1].astype(np.float32)
|
||||
|
||||
# Bilinear interpolation (vectorized)
|
||||
result = (z00 * (1 - dr) * (1 - dc) +
|
||||
z01 * (1 - dr) * dc +
|
||||
z10 * dr * (1 - dc) +
|
||||
z11 * dr * dc)
|
||||
|
||||
# Handle void values (-32768) - set to 0
|
||||
void_mask = (z00 == -32768) | (z01 == -32768) | (z10 == -32768) | (z11 == -32768)
|
||||
result[void_mask] = 0.0
|
||||
|
||||
elevations[mask] = result
|
||||
|
||||
return elevations
|
||||
|
||||
def get_required_tiles(self, center_lat: float, center_lon: float, radius_km: float) -> list:
|
||||
"""Determine which tiles are needed for a coverage calculation."""
|
||||
# Convert radius to degrees (approximate)
|
||||
lat_delta = radius_km / 111.0 # ~111 km per degree latitude
|
||||
lon_delta = radius_km / (111.0 * np.cos(np.radians(center_lat)))
|
||||
|
||||
min_lat = center_lat - lat_delta
|
||||
max_lat = center_lat + lat_delta
|
||||
min_lon = center_lon - lon_delta
|
||||
max_lon = center_lon + lon_delta
|
||||
|
||||
tiles = []
|
||||
for lat in range(int(np.floor(min_lat)), int(np.floor(max_lat)) + 1):
|
||||
for lon in range(int(np.floor(min_lon)), int(np.floor(max_lon)) + 1):
|
||||
lat_letter = 'N' if lat >= 0 else 'S'
|
||||
lon_letter = 'E' if lon >= 0 else 'W'
|
||||
tile_name = f"{lat_letter}{abs(lat):02d}{lon_letter}{abs(lon):03d}"
|
||||
tiles.append(tile_name)
|
||||
|
||||
return tiles
|
||||
|
||||
def get_missing_tiles(self, center_lat: float, center_lon: float, radius_km: float) -> list:
|
||||
"""Check which needed tiles are not available locally."""
|
||||
required = self.get_required_tiles(center_lat, center_lon, radius_km)
|
||||
return [t for t in required if not self.get_tile_path(t).exists()]
|
||||
|
||||
async def get_elevation_profile(
|
||||
self,
|
||||
|
||||
@@ -21,6 +21,11 @@ class VegetationArea(BaseModel):
|
||||
geometry: List[Tuple[float, float]] # [(lon, lat), ...]
|
||||
vegetation_type: str # forest, wood, scrub, orchard
|
||||
density: str # dense, sparse, mixed
|
||||
# Bounding box for fast rejection (computed from geometry)
|
||||
min_lat: float = 0.0
|
||||
max_lat: float = 0.0
|
||||
min_lon: float = 0.0
|
||||
max_lon: float = 0.0
|
||||
|
||||
|
||||
class VegetationCache:
|
||||
@@ -127,7 +132,24 @@ class VegetationService:
|
||||
cached = self.cache.get(min_lat, min_lon, max_lat, max_lon)
|
||||
if cached is not None:
|
||||
print(f"[Vegetation] Cache hit for bbox")
|
||||
areas = [VegetationArea(**v) for v in cached]
|
||||
areas = []
|
||||
for v in cached:
|
||||
area = VegetationArea(**v)
|
||||
# Recompute bbox if missing (backward compat with old cache)
|
||||
if area.min_lat == 0.0 and area.max_lat == 0.0 and area.geometry:
|
||||
lons = [p[0] for p in area.geometry]
|
||||
lats = [p[1] for p in area.geometry]
|
||||
area = VegetationArea(
|
||||
id=area.id,
|
||||
geometry=area.geometry,
|
||||
vegetation_type=area.vegetation_type,
|
||||
density=area.density,
|
||||
min_lat=min(lats),
|
||||
max_lat=max(lats),
|
||||
min_lon=min(lons),
|
||||
max_lon=max(lons),
|
||||
)
|
||||
areas.append(area)
|
||||
self._memory_cache[cache_key] = areas
|
||||
return areas
|
||||
|
||||
@@ -205,11 +227,19 @@ class VegetationService:
|
||||
leaf_type = tags.get("leaf_type", "mixed")
|
||||
density = "dense" if leaf_type == "needleleaved" else "mixed"
|
||||
|
||||
# Compute bounding box from geometry (lon, lat tuples)
|
||||
lons = [p[0] for p in geometry]
|
||||
lats = [p[1] for p in geometry]
|
||||
|
||||
areas.append(VegetationArea(
|
||||
id=element["id"],
|
||||
geometry=geometry,
|
||||
vegetation_type=veg_type,
|
||||
density=density
|
||||
density=density,
|
||||
min_lat=min(lats),
|
||||
max_lat=max(lats),
|
||||
min_lon=min(lons),
|
||||
max_lon=max(lons),
|
||||
))
|
||||
|
||||
return areas
|
||||
@@ -260,8 +290,12 @@ class VegetationService:
|
||||
lat: float, lon: float,
|
||||
areas: List[VegetationArea]
|
||||
) -> Optional[VegetationArea]:
|
||||
"""Check if point is in vegetation area"""
|
||||
"""Check if point is in vegetation area (with bbox pre-filter)"""
|
||||
for area in areas:
|
||||
# Quick bbox reject - skips 95%+ of polygons
|
||||
if not (area.min_lat <= lat <= area.max_lat and
|
||||
area.min_lon <= lon <= area.max_lon):
|
||||
continue
|
||||
if self._point_in_polygon(lat, lon, area.geometry):
|
||||
return area
|
||||
return None
|
||||
|
||||
@@ -29,7 +29,23 @@ if getattr(sys, 'frozen', False):
|
||||
print(f"[RFCP] Frozen mode, base dir: {base_dir}", flush=True)
|
||||
|
||||
# Fix uvicorn TTY detection — redirect None streams to a log file
|
||||
log_path = os.path.join(base_dir, 'rfcp-server.log')
|
||||
# Use RFCP_LOG_PATH from Electron, or fallback to user-writable location
|
||||
log_dir = os.environ.get('RFCP_LOG_PATH')
|
||||
if not log_dir:
|
||||
if sys.platform == 'win32':
|
||||
appdata = os.environ.get('APPDATA', os.path.expanduser('~'))
|
||||
log_dir = os.path.join(appdata, 'rfcp-desktop', 'logs')
|
||||
else:
|
||||
log_dir = os.path.join(os.path.expanduser('~'), '.rfcp', 'logs')
|
||||
|
||||
try:
|
||||
os.makedirs(log_dir, exist_ok=True)
|
||||
log_path = os.path.join(log_dir, 'rfcp-server.log')
|
||||
except Exception:
|
||||
# Fallback to temp directory if all else fails
|
||||
import tempfile
|
||||
log_path = os.path.join(tempfile.gettempdir(), 'rfcp-server.log')
|
||||
|
||||
log_file = open(log_path, 'w')
|
||||
if sys.stdout is None:
|
||||
sys.stdout = log_file
|
||||
|
||||
@@ -0,0 +1,463 @@
|
||||
# RFCP — Iteration 3.10: Link Budget, Fresnel Zone & Interference Modeling
|
||||
|
||||
## Overview
|
||||
Add three interconnected RF analysis features: link budget calculator panel, Fresnel zone visualization on terrain profiles, and basic interference (C/I) modeling for multi-site scenarios. These build on existing infrastructure — propagation models, terrain profiles, and multi-site coverage.
|
||||
|
||||
## Priority Order
|
||||
1. Link Budget Calculator (simplest, standalone UI)
|
||||
2. Fresnel Zone Visualization (extends terrain profile)
|
||||
3. Interference Modeling (extends coverage engine)
|
||||
|
||||
---
|
||||
|
||||
## Feature 1: Link Budget Calculator
|
||||
|
||||
### Description
|
||||
A panel/dialog that shows the complete RF link budget as a table — from transmitter to receiver. Uses existing propagation model values but presents them in the standard telecom link budget format.
|
||||
|
||||
### Implementation
|
||||
|
||||
**New component:** `frontend/src/components/panels/LinkBudgetPanel.tsx`
|
||||
|
||||
The panel should display a table with rows for each element in the link chain. It should use the currently selected site's parameters and a configurable receiver point (either clicked on map or manually entered coordinates).
|
||||
|
||||
**Link Budget Table Structure:**
|
||||
```
|
||||
TRANSMITTER
|
||||
Tx Power (dBm) [from site config, e.g. 43 dBm]
|
||||
Tx Antenna Gain (dBi) [from site config, e.g. 18 dBi]
|
||||
Tx Cable/Connector Loss (dB) [new field, default 2 dB]
|
||||
EIRP (dBm) = Tx Power + Gain - Cable Loss
|
||||
|
||||
PATH
|
||||
Distance (km) [calculated from Tx to Rx point]
|
||||
Free Space Path Loss (dB) [existing formula: 20log(d) + 20log(f) + 32.45]
|
||||
Terrain Diffraction Loss (dB) [from terrain_los model if available]
|
||||
Vegetation Loss (dB) [from vegetation model if available]
|
||||
Atmospheric Loss (dB) [from atmospheric model if available]
|
||||
Total Path Loss (dB) = sum of all path losses
|
||||
|
||||
RECEIVER
|
||||
Rx Antenna Gain (dBi) [configurable, default 0 dBi for handset]
|
||||
Rx Cable Loss (dB) [configurable, default 0 dB]
|
||||
Rx Sensitivity (dBm) [configurable, default -100 dBm]
|
||||
|
||||
RESULT
|
||||
Received Power (dBm) = EIRP - Total Path Loss + Rx Gain - Rx Cable
|
||||
Link Margin (dB) = Received Power - Rx Sensitivity
|
||||
Status = "OK" if margin > 0, "FAIL" if < 0
|
||||
```
|
||||
|
||||
**Backend addition:** Add a new endpoint or extend existing coverage API.
|
||||
|
||||
**File:** `backend/app/api/routes/coverage.py` (or new `link_budget.py`)
|
||||
|
||||
```python
|
||||
@router.post("/api/link-budget")
|
||||
async def calculate_link_budget(request: dict):
|
||||
"""Calculate point-to-point link budget.
|
||||
|
||||
Body: {
|
||||
"site_id": "...", # or tx_lat/tx_lon/tx_params
|
||||
"tx_lat": 48.46,
|
||||
"tx_lon": 35.04,
|
||||
"tx_power_dbm": 43,
|
||||
"tx_gain_dbi": 18,
|
||||
"tx_cable_loss_db": 2,
|
||||
"tx_height_m": 30,
|
||||
"rx_lat": 48.50,
|
||||
"rx_lon": 35.10,
|
||||
"rx_gain_dbi": 0,
|
||||
"rx_cable_loss_db": 0,
|
||||
"rx_sensitivity_dbm": -100,
|
||||
"rx_height_m": 1.5,
|
||||
"frequency_mhz": 1800
|
||||
}
|
||||
"""
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
# Calculate distance
|
||||
distance_m = terrain_service.haversine_distance(
|
||||
request["tx_lat"], request["tx_lon"],
|
||||
request["rx_lat"], request["rx_lon"]
|
||||
)
|
||||
distance_km = distance_m / 1000
|
||||
|
||||
# Get elevations
|
||||
tx_elev = await terrain_service.get_elevation(request["tx_lat"], request["tx_lon"])
|
||||
rx_elev = await terrain_service.get_elevation(request["rx_lat"], request["rx_lon"])
|
||||
|
||||
# EIRP
|
||||
eirp_dbm = request["tx_power_dbm"] + request["tx_gain_dbi"] - request["tx_cable_loss_db"]
|
||||
|
||||
# Free space path loss
|
||||
freq = request["frequency_mhz"]
|
||||
fspl_db = 20 * math.log10(distance_km) + 20 * math.log10(freq) + 32.45 if distance_km > 0 else 0
|
||||
|
||||
# Terrain profile for LOS check
|
||||
profile = await terrain_service.get_elevation_profile(
|
||||
request["tx_lat"], request["tx_lon"],
|
||||
request["rx_lat"], request["rx_lon"],
|
||||
num_points=100
|
||||
)
|
||||
|
||||
# Simple LOS check - does terrain block line of sight?
|
||||
tx_total_height = tx_elev + request.get("tx_height_m", 30)
|
||||
rx_total_height = rx_elev + request.get("rx_height_m", 1.5)
|
||||
|
||||
terrain_loss_db = 0
|
||||
los_clear = True
|
||||
for i, point in enumerate(profile):
|
||||
if i == 0 or i == len(profile) - 1:
|
||||
continue
|
||||
# Linear interpolation of LOS line at this point
|
||||
fraction = i / (len(profile) - 1)
|
||||
los_height = tx_total_height + fraction * (rx_total_height - tx_total_height)
|
||||
if point["elevation"] > los_height:
|
||||
los_clear = False
|
||||
# Simple knife-edge diffraction estimate
|
||||
terrain_loss_db += 6 # ~6dB per obstruction (simplified)
|
||||
|
||||
total_path_loss = fspl_db + terrain_loss_db
|
||||
|
||||
# Received power
|
||||
rx_power_dbm = eirp_dbm - total_path_loss + request["rx_gain_dbi"] - request["rx_cable_loss_db"]
|
||||
|
||||
# Link margin
|
||||
margin_db = rx_power_dbm - request["rx_sensitivity_dbm"]
|
||||
|
||||
return {
|
||||
"distance_km": round(distance_km, 2),
|
||||
"distance_m": round(distance_m, 1),
|
||||
"tx_elevation_m": round(tx_elev, 1),
|
||||
"rx_elevation_m": round(rx_elev, 1),
|
||||
"eirp_dbm": round(eirp_dbm, 1),
|
||||
"fspl_db": round(fspl_db, 1),
|
||||
"terrain_loss_db": round(terrain_loss_db, 1),
|
||||
"total_path_loss_db": round(total_path_loss, 1),
|
||||
"los_clear": los_clear,
|
||||
"rx_power_dbm": round(rx_power_dbm, 1),
|
||||
"margin_db": round(margin_db, 1),
|
||||
"status": "OK" if margin_db >= 0 else "FAIL",
|
||||
"profile": profile,
|
||||
}
|
||||
```
|
||||
|
||||
### UI Requirements
|
||||
- New panel accessible from sidebar or toolbar button (calculator icon)
|
||||
- Click on map to set Rx point (with crosshair cursor)
|
||||
- Auto-populates Tx params from selected site
|
||||
- Shows result table with color coding (green margin = OK, red = FAIL)
|
||||
- Optionally draws line on map from Tx to Rx
|
||||
|
||||
---
|
||||
|
||||
## Feature 2: Fresnel Zone Visualization
|
||||
|
||||
### Description
|
||||
Draw Fresnel zone ellipse overlay on the Terrain Profile chart, showing where terrain intrudes into the first Fresnel zone. This is critical for understanding if a radio link will actually work — even if terrain doesn't block direct LOS, Fresnel zone obstruction causes significant signal loss.
|
||||
|
||||
### Implementation
|
||||
|
||||
**Modify:** The existing Terrain Profile component/chart
|
||||
|
||||
**Fresnel Zone Radius Formula:**
|
||||
```python
|
||||
import math
|
||||
|
||||
def fresnel_radius(n: int, frequency_mhz: float, d1_m: float, d2_m: float) -> float:
|
||||
"""Calculate nth Fresnel zone radius at a point along the path.
|
||||
|
||||
Args:
|
||||
n: Fresnel zone number (1 = first zone, most important)
|
||||
frequency_mhz: Frequency in MHz
|
||||
d1_m: Distance from transmitter to this point (meters)
|
||||
d2_m: Distance from this point to receiver (meters)
|
||||
|
||||
Returns:
|
||||
Radius of nth Fresnel zone in meters
|
||||
"""
|
||||
wavelength = 300.0 / frequency_mhz # meters
|
||||
d_total = d1_m + d2_m
|
||||
if d_total == 0:
|
||||
return 0
|
||||
radius = math.sqrt((n * wavelength * d1_m * d2_m) / d_total)
|
||||
return radius
|
||||
```
|
||||
|
||||
**Backend endpoint:** `backend/app/api/routes/coverage.py`
|
||||
|
||||
```python
|
||||
@router.post("/api/fresnel-profile")
|
||||
async def fresnel_profile(request: dict):
|
||||
"""Calculate terrain profile with Fresnel zone boundaries.
|
||||
|
||||
Body: {
|
||||
"tx_lat": 48.46, "tx_lon": 35.04, "tx_height_m": 30,
|
||||
"rx_lat": 48.50, "rx_lon": 35.10, "rx_height_m": 1.5,
|
||||
"frequency_mhz": 1800,
|
||||
"num_points": 100
|
||||
}
|
||||
"""
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
tx_lat, tx_lon = request["tx_lat"], request["tx_lon"]
|
||||
rx_lat, rx_lon = request["rx_lat"], request["rx_lon"]
|
||||
tx_height = request.get("tx_height_m", 30)
|
||||
rx_height = request.get("rx_height_m", 1.5)
|
||||
freq = request.get("frequency_mhz", 1800)
|
||||
num_points = request.get("num_points", 100)
|
||||
|
||||
# Get terrain profile
|
||||
profile = await terrain_service.get_elevation_profile(
|
||||
tx_lat, tx_lon, rx_lat, rx_lon, num_points
|
||||
)
|
||||
|
||||
total_distance = profile[-1]["distance"] if profile else 0
|
||||
|
||||
# Get endpoint elevations
|
||||
tx_elev = profile[0]["elevation"] if profile else 0
|
||||
rx_elev = profile[-1]["elevation"] if profile else 0
|
||||
tx_total = tx_elev + tx_height
|
||||
rx_total = rx_elev + rx_height
|
||||
|
||||
wavelength = 300.0 / freq # meters
|
||||
|
||||
# Calculate Fresnel zone at each profile point
|
||||
fresnel_data = []
|
||||
los_blocked = False
|
||||
fresnel_blocked = False
|
||||
worst_clearance = float('inf')
|
||||
|
||||
for i, point in enumerate(profile):
|
||||
d1 = point["distance"] # distance from tx
|
||||
d2 = total_distance - d1 # distance to rx
|
||||
|
||||
# LOS height at this point (linear interpolation)
|
||||
if total_distance > 0:
|
||||
fraction = d1 / total_distance
|
||||
else:
|
||||
fraction = 0
|
||||
los_height = tx_total + fraction * (rx_total - tx_total)
|
||||
|
||||
# First Fresnel zone radius
|
||||
if d1 > 0 and d2 > 0 and total_distance > 0:
|
||||
f1_radius = math.sqrt((1 * wavelength * d1 * d2) / total_distance)
|
||||
else:
|
||||
f1_radius = 0
|
||||
|
||||
# Fresnel zone boundaries (height above sea level)
|
||||
fresnel_top = los_height + f1_radius
|
||||
fresnel_bottom = los_height - f1_radius
|
||||
|
||||
# Clearance: how much space between terrain and Fresnel bottom
|
||||
clearance = fresnel_bottom - point["elevation"]
|
||||
|
||||
if clearance < worst_clearance:
|
||||
worst_clearance = clearance
|
||||
|
||||
if point["elevation"] > los_height:
|
||||
los_blocked = True
|
||||
if point["elevation"] > fresnel_bottom:
|
||||
fresnel_blocked = True
|
||||
|
||||
fresnel_data.append({
|
||||
"distance": point["distance"],
|
||||
"lat": point["lat"],
|
||||
"lon": point["lon"],
|
||||
"terrain_elevation": point["elevation"],
|
||||
"los_height": round(los_height, 1),
|
||||
"fresnel_top": round(fresnel_top, 1),
|
||||
"fresnel_bottom": round(fresnel_bottom, 1),
|
||||
"f1_radius": round(f1_radius, 1),
|
||||
"clearance": round(clearance, 1),
|
||||
})
|
||||
|
||||
return {
|
||||
"profile": fresnel_data,
|
||||
"total_distance_m": round(total_distance, 1),
|
||||
"tx_elevation": round(tx_elev, 1),
|
||||
"rx_elevation": round(rx_elev, 1),
|
||||
"frequency_mhz": freq,
|
||||
"wavelength_m": round(wavelength, 4),
|
||||
"los_clear": not los_blocked,
|
||||
"fresnel_clear": not fresnel_blocked,
|
||||
"worst_clearance_m": round(worst_clearance, 1),
|
||||
"recommendation": (
|
||||
"Clear — excellent link" if not fresnel_blocked
|
||||
else "Fresnel zone partially blocked — expect 3-6 dB additional loss"
|
||||
if not los_blocked
|
||||
else "LOS blocked — significant diffraction loss expected"
|
||||
),
|
||||
}
|
||||
```
|
||||
|
||||
### Frontend Visualization
|
||||
On the existing Terrain Profile chart:
|
||||
- Draw the LOS line (straight line from Tx to Rx) — this may already exist
|
||||
- Draw first Fresnel zone as a **semi-transparent elliptical area** around the LOS line
|
||||
- Upper boundary = `fresnel_top` series
|
||||
- Lower boundary = `fresnel_bottom` series
|
||||
- Color: light blue with ~20% opacity
|
||||
- Where terrain intersects Fresnel zone, highlight in red/orange
|
||||
- Show clearance info in the profile tooltip
|
||||
- Add a summary badge: "LOS Clear ✓" / "Fresnel 60% Clear ⚠" / "LOS Blocked ✗"
|
||||
|
||||
---
|
||||
|
||||
## Feature 3: Interference Modeling (C/I Ratio)
|
||||
|
||||
### Description
|
||||
Add carrier-to-interference ratio calculation to the coverage engine. For each grid point, calculate the C/I ratio: the signal from the serving cell vs the sum of signals from all other cells on the same frequency. Display as a separate heatmap layer.
|
||||
|
||||
### Implementation
|
||||
|
||||
**Backend changes:**
|
||||
|
||||
**File:** `backend/app/services/coverage_service.py` (or gpu_service.py)
|
||||
|
||||
Add C/I calculation after existing coverage computation:
|
||||
|
||||
```python
|
||||
def calculate_interference(self, sites: list, coverage_results: dict) -> np.ndarray:
|
||||
"""Calculate C/I ratio for each grid point.
|
||||
|
||||
For each point:
|
||||
- C = signal strength from strongest (serving) cell
|
||||
- I = sum of signal strengths from all other co-frequency cells
|
||||
- C/I = C - 10*log10(sum of linear interference powers)
|
||||
|
||||
Returns array of C/I values in dB.
|
||||
"""
|
||||
# Get all RSRP grids (already calculated)
|
||||
# For each point, find:
|
||||
# 1. Best server (strongest signal) = C
|
||||
# 2. Sum of all others on same frequency = I
|
||||
# 3. C/I = C(dBm) - I(dBm)
|
||||
|
||||
# Group sites by frequency
|
||||
freq_groups = {}
|
||||
for site in sites:
|
||||
freq = site.get("frequency_mhz", 1800)
|
||||
if freq not in freq_groups:
|
||||
freq_groups[freq] = []
|
||||
freq_groups[freq].append(site)
|
||||
|
||||
# Only calculate interference for frequency groups with 2+ sites
|
||||
# For single-site frequencies, C/I = infinity (no interference)
|
||||
|
||||
# The RSRP values are already in dBm, need to convert to linear for summing
|
||||
# P_linear = 10^(P_dBm / 10)
|
||||
# I_total_linear = sum(P_linear for all interferers)
|
||||
# I_total_dBm = 10 * log10(I_total_linear)
|
||||
# C/I = C_dBm - I_total_dBm
|
||||
pass
|
||||
```
|
||||
|
||||
**Key algorithm (for GPU pipeline in gpu_service.py):**
|
||||
```python
|
||||
# After computing RSRP for all sites at all grid points:
|
||||
# rsrp_grid shape: (num_sites, num_points) in dBm
|
||||
|
||||
# Convert to linear (mW)
|
||||
rsrp_linear = 10 ** (rsrp_grid / 10.0) # CuPy array
|
||||
|
||||
# For each point, best server
|
||||
best_server_idx = cp.argmax(rsrp_grid, axis=0)
|
||||
best_rsrp_linear = cp.take_along_axis(rsrp_linear, best_server_idx[cp.newaxis, :], axis=0)[0]
|
||||
|
||||
# Total power from all sites
|
||||
total_power = cp.sum(rsrp_linear, axis=0)
|
||||
|
||||
# Interference = total - serving
|
||||
interference_linear = total_power - best_rsrp_linear
|
||||
|
||||
# C/I ratio in dB
|
||||
# Avoid log10(0) with small epsilon
|
||||
epsilon = 1e-30
|
||||
ci_ratio_db = 10 * cp.log10(best_rsrp_linear / (interference_linear + epsilon))
|
||||
|
||||
# Clip to reasonable range
|
||||
ci_ratio_db = cp.clip(ci_ratio_db, -20, 50)
|
||||
```
|
||||
|
||||
### Frontend Visualization
|
||||
- Add a toggle in the coverage controls: "Show: Signal (RSRP) | Interference (C/I)"
|
||||
- C/I heatmap uses different color scale:
|
||||
- Dark red: < 0 dB (interference dominant — no service)
|
||||
- Orange: 0-10 dB (marginal)
|
||||
- Yellow: 10-20 dB (acceptable)
|
||||
- Green: 20-30 dB (good)
|
||||
- Blue: > 30 dB (excellent, minimal interference)
|
||||
- The C/I map only makes sense with 2+ sites on same frequency
|
||||
- Show warning if all sites are on different frequencies (no co-channel interference)
|
||||
|
||||
### API Response Extension
|
||||
Add `ci_ratio` field to coverage calculation response alongside existing `rsrp` values.
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
### Link Budget
|
||||
- [ ] Panel opens from toolbar/sidebar
|
||||
- [ ] Click on map sets Rx point
|
||||
- [ ] Tx parameters auto-populate from selected site
|
||||
- [ ] Link budget table shows all rows correctly
|
||||
- [ ] Margin calculation is correct (manual verification)
|
||||
- [ ] Color coding: green for positive margin, red for negative
|
||||
- [ ] Line drawn on map from Tx to Rx
|
||||
|
||||
### Fresnel Zone
|
||||
- [ ] Terrain profile shows Fresnel zone overlay
|
||||
- [ ] Fresnel ellipse is widest at midpoint (correct shape)
|
||||
- [ ] Red highlighting where terrain enters Fresnel zone
|
||||
- [ ] Summary shows LOS/Fresnel status
|
||||
- [ ] Works at different frequencies (zone size changes with frequency)
|
||||
- [ ] Clearance values are reasonable (first Fresnel zone at 1800 MHz, 10km = ~22m radius at midpoint)
|
||||
|
||||
### Interference
|
||||
- [ ] C/I toggle appears when 2+ sites exist
|
||||
- [ ] C/I heatmap renders with correct color scale
|
||||
- [ ] Single-site scenario shows "no interference" or infinite C/I
|
||||
- [ ] Two sites on same frequency show interference zones between them
|
||||
- [ ] C/I values are reasonable (> 20 dB near serving cell, < 10 dB at cell edge)
|
||||
|
||||
## Build & Deploy
|
||||
|
||||
```bash
|
||||
cd D:\root\rfcp
|
||||
|
||||
# Backend — just restart uvicorn (Python, no build)
|
||||
cd backend
|
||||
python -m uvicorn app.main:app --host 0.0.0.0 --port 8000 --reload
|
||||
|
||||
# Frontend — rebuild if UI components changed
|
||||
cd frontend
|
||||
npm run build
|
||||
|
||||
# Full installer rebuild if needed
|
||||
# (use existing build script)
|
||||
```
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
feat(rf): add link budget, Fresnel zone, and interference modeling
|
||||
|
||||
- Add /api/link-budget endpoint with full path analysis
|
||||
- Add /api/fresnel-profile endpoint with zone clearance calculation
|
||||
- Add C/I ratio computation to GPU coverage pipeline
|
||||
- Add LinkBudgetPanel frontend component
|
||||
- Add Fresnel zone overlay to terrain profile chart
|
||||
- Add C/I heatmap toggle alongside RSRP display
|
||||
- Group interference by frequency for co-channel analysis
|
||||
```
|
||||
|
||||
## Success Criteria
|
||||
|
||||
1. Link budget shows correct margin for known test case (Dnipro, 10km, 1800MHz)
|
||||
2. Fresnel zone visually shows ellipse on terrain profile
|
||||
3. Two co-frequency sites show interference pattern between them
|
||||
4. All three features work with existing terrain data (no new downloads needed)
|
||||
5. GPU pipeline performance not significantly degraded by C/I calculation
|
||||
210
docs/devlog/gpu_supp/RFCP-3.10.1-UI-Bugfixes.md
Normal file
210
docs/devlog/gpu_supp/RFCP-3.10.1-UI-Bugfixes.md
Normal file
@@ -0,0 +1,210 @@
|
||||
# RFCP — Iteration 3.10.1: UI/UX Bugfixes
|
||||
|
||||
## Overview
|
||||
Four bugs found during 3.10 testing. All are frontend issues, no backend changes needed.
|
||||
|
||||
---
|
||||
|
||||
## Bug 1: Ruler places point when clicking Terrain Profile button
|
||||
|
||||
**Problem:** When Ruler mode is active and user clicks "Terrain Profile" button in the measurement overlay, it also places a ruler point on the map underneath. The click event propagates to the map.
|
||||
|
||||
**Fix:** Stop event propagation on the Terrain Profile button click handler. The Terrain Profile button (and any overlay UI elements) should call `e.stopPropagation()` to prevent the click from reaching the map layer.
|
||||
|
||||
Also review: any other UI overlays that sit on top of the map (Link Budget panel, coverage controls, etc.) should also stop propagation to prevent accidental ruler/site placement.
|
||||
|
||||
**Files to check:**
|
||||
- MeasurementTool component (Terrain Profile button handler)
|
||||
- Any overlay/popup components that sit on top of the Leaflet map
|
||||
|
||||
---
|
||||
|
||||
## Bug 2: Cursor should be default arrow, not hand; Ruler snap to site
|
||||
|
||||
**Problem A:** The map cursor shows as a grab/hand icon. Should be default arrow cursor for normal mode. Hand cursor should only appear when dragging the map.
|
||||
|
||||
**Fix A:** Set Leaflet map cursor styles:
|
||||
```css
|
||||
/* Default cursor */
|
||||
.leaflet-container {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
/* Grabbing only when dragging */
|
||||
.leaflet-container.leaflet-drag-target {
|
||||
cursor: grabbing !important;
|
||||
}
|
||||
|
||||
/* Crosshair for ruler mode */
|
||||
.leaflet-container.ruler-mode {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
/* Crosshair for RX point placement mode */
|
||||
.leaflet-container.rx-placement-mode {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
```
|
||||
|
||||
Apply CSS classes to the map container based on current mode. Remove Leaflet's default grab cursor.
|
||||
|
||||
**Problem B:** When using the ruler, it should be possible to snap the ruler start/end point exactly to a site (tower) location. Currently you have to eyeball it.
|
||||
|
||||
**Fix B:** When in ruler mode and clicking near a site marker (within ~20px), snap the ruler point to the exact site coordinates. This gives precise distance measurements from tower to any point.
|
||||
|
||||
```typescript
|
||||
// In ruler click handler:
|
||||
const SNAP_DISTANCE_PX = 20;
|
||||
|
||||
function findNearestSite(clickLatLng: L.LatLng, map: L.Map): Site | null {
|
||||
const clickPoint = map.latLngToContainerPoint(clickLatLng);
|
||||
let nearest: Site | null = null;
|
||||
let minDist = Infinity;
|
||||
|
||||
for (const site of sites) {
|
||||
const sitePoint = map.latLngToContainerPoint(L.latLng(site.lat, site.lon));
|
||||
const dist = clickPoint.distanceTo(sitePoint);
|
||||
if (dist < SNAP_DISTANCE_PX && dist < minDist) {
|
||||
minDist = dist;
|
||||
nearest = site;
|
||||
}
|
||||
}
|
||||
return nearest;
|
||||
}
|
||||
|
||||
// When placing ruler point:
|
||||
const snappedSite = findNearestSite(clickLatLng, map);
|
||||
if (snappedSite) {
|
||||
// Use exact site coordinates
|
||||
rulerPoint = L.latLng(snappedSite.lat, snappedSite.lon);
|
||||
} else {
|
||||
rulerPoint = clickLatLng;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Bug 3: Link Budget Calculator text invisible + RX point not placed on map
|
||||
|
||||
**Problem A:** Text in Link Budget Calculator panel is black on dark background — invisible. The input fields and labels need light text color for dark theme.
|
||||
|
||||
**Fix A:** Ensure all text in LinkBudgetPanel uses light colors:
|
||||
```css
|
||||
/* All text in the panel should be light */
|
||||
color: #e2e8f0; /* or whatever the app's light text color is */
|
||||
|
||||
/* Input fields */
|
||||
input {
|
||||
color: #e2e8f0;
|
||||
background: #1e293b; /* dark input background */
|
||||
border: 1px solid #475569;
|
||||
}
|
||||
|
||||
/* Labels */
|
||||
label {
|
||||
color: #94a3b8; /* slightly muted for labels */
|
||||
}
|
||||
|
||||
/* Values/results */
|
||||
.result-value {
|
||||
color: #f1f5f9; /* bright white for important values */
|
||||
}
|
||||
```
|
||||
|
||||
Check if the panel is using Tailwind classes — if so, ensure `text-slate-200` or similar is applied to the container. The panel likely inherits wrong text color or has hardcoded dark text.
|
||||
|
||||
**Problem B:** When clicking "Click on Map to Set RX Point" and then clicking on the map, the RX marker does not appear on the map. The coordinates might update in the fields but there's no visual indicator.
|
||||
|
||||
**Fix B:** When RX point is set:
|
||||
1. Place a visible marker on the map at the RX location (use a different icon than the TX site — e.g., a small circle or pin in a different color like orange or blue)
|
||||
2. Draw a dashed line from the TX site to the RX marker
|
||||
3. The marker should be draggable to adjust position
|
||||
4. When Link Budget panel is closed, remove the RX marker and line
|
||||
|
||||
```typescript
|
||||
// RX marker icon (different from site markers)
|
||||
const rxIcon = L.divIcon({
|
||||
className: 'rx-marker',
|
||||
html: '<div style="width: 12px; height: 12px; background: #f97316; border: 2px solid white; border-radius: 50%;"></div>',
|
||||
iconSize: [12, 12],
|
||||
iconAnchor: [6, 6],
|
||||
});
|
||||
|
||||
// Place marker
|
||||
const rxMarker = L.marker([rxLat, rxLon], { icon: rxIcon, draggable: true }).addTo(map);
|
||||
|
||||
// Dashed line from TX to RX
|
||||
const linkLine = L.polyline([[txLat, txLon], [rxLat, rxLon]], {
|
||||
color: '#f97316',
|
||||
weight: 2,
|
||||
dashArray: '8, 4',
|
||||
opacity: 0.8,
|
||||
}).addTo(map);
|
||||
|
||||
// Update on drag
|
||||
rxMarker.on('drag', (e) => {
|
||||
const pos = e.target.getLatLng();
|
||||
linkLine.setLatLngs([[txLat, txLon], [pos.lat, pos.lng]]);
|
||||
// Update Link Budget panel coordinates
|
||||
updateRxCoordinates(pos.lat, pos.lng);
|
||||
});
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Bug 4: Elevation color opacity not working
|
||||
|
||||
**Problem:** The opacity control for elevation/terrain colors on the map is not functioning. Adjusting the opacity slider has no effect on the terrain overlay visibility.
|
||||
|
||||
**Fix:** Check how the elevation overlay is rendered:
|
||||
|
||||
1. If it's a tile layer (Leaflet tile overlay), use `layer.setOpacity(value)`
|
||||
2. If it's the topo map layer, the opacity needs to be applied to the correct layer reference
|
||||
3. If it's the coverage heatmap opacity that's broken, check the canvas renderer opacity
|
||||
|
||||
The "Elev" button on the right toolbar likely toggles an elevation visualization. Find where this layer is created and ensure:
|
||||
|
||||
```typescript
|
||||
// When opacity slider changes:
|
||||
elevationLayer.setOpacity(opacityValue);
|
||||
|
||||
// Or if it's a canvas overlay:
|
||||
const canvas = document.querySelector('.elevation-overlay');
|
||||
if (canvas) {
|
||||
canvas.style.opacity = String(opacityValue);
|
||||
}
|
||||
```
|
||||
|
||||
Also check: there might be TWO opacity controls that are confused:
|
||||
- Coverage heatmap opacity (the RSRP colors)
|
||||
- Terrain/elevation color overlay opacity (the topo colors)
|
||||
|
||||
Make sure each slider controls the correct layer.
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
- [ ] Click Terrain Profile button with Ruler active — NO extra ruler point placed
|
||||
- [ ] Default cursor is arrow, not hand
|
||||
- [ ] Cursor changes to crosshair in Ruler mode
|
||||
- [ ] Cursor changes to crosshair in RX placement mode
|
||||
- [ ] Ruler snaps to site when clicking near tower marker
|
||||
- [ ] Link Budget panel text is readable (light on dark)
|
||||
- [ ] Clicking map in RX mode places visible orange marker
|
||||
- [ ] Dashed line drawn from TX to RX
|
||||
- [ ] RX marker removed when panel closes
|
||||
- [ ] Elevation opacity slider actually changes overlay transparency
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
fix(ui): resolve ruler propagation, cursor, link budget visibility, elevation opacity
|
||||
|
||||
- Stop click propagation on Terrain Profile button (prevents ruler point)
|
||||
- Change default cursor to arrow, crosshair for tool modes
|
||||
- Add ruler snap-to-site (20px threshold)
|
||||
- Fix Link Budget panel text colors for dark theme
|
||||
- Add RX marker and dashed line on map
|
||||
- Fix elevation overlay opacity control binding
|
||||
```
|
||||
349
docs/devlog/gpu_supp/RFCP-3.10.2-ToolMode-ClickFixes.md
Normal file
349
docs/devlog/gpu_supp/RFCP-3.10.2-ToolMode-ClickFixes.md
Normal file
@@ -0,0 +1,349 @@
|
||||
# RFCP — Iteration 3.10.2: Tool Mode System & Click Fixes
|
||||
|
||||
## Root Cause
|
||||
All click-related bugs share one root cause: multiple features compete for the same map click event. Ruler, RX point placement, site placement, and terrain profile all listen to map clicks simultaneously. There's no centralized "active tool" state that prevents conflicts.
|
||||
|
||||
## Solution: Active Tool Mode
|
||||
Create a single source of truth for which tool is currently active. Only the active tool receives map click events.
|
||||
|
||||
### Tool Modes (mutually exclusive):
|
||||
```typescript
|
||||
type ActiveTool =
|
||||
| 'none' // Default — pan/zoom only, no click actions
|
||||
| 'ruler' // Distance measurement, click to add points
|
||||
| 'rx-placement' // Link Budget RX point, single click
|
||||
| 'site-placement' // Place new site on map
|
||||
```
|
||||
|
||||
### Implementation
|
||||
|
||||
**1. Add to app store (Zustand):**
|
||||
|
||||
```typescript
|
||||
// In the main store or a new toolStore:
|
||||
interface ToolState {
|
||||
activeTool: ActiveTool;
|
||||
setActiveTool: (tool: ActiveTool) => void;
|
||||
clearTool: () => void;
|
||||
}
|
||||
|
||||
const useToolStore = create<ToolState>((set) => ({
|
||||
activeTool: 'none',
|
||||
setActiveTool: (tool) => set({ activeTool: tool }),
|
||||
clearTool: () => set({ activeTool: 'none' }),
|
||||
}));
|
||||
```
|
||||
|
||||
**2. Map click handler — single entry point:**
|
||||
|
||||
Replace all individual map click listeners with ONE handler:
|
||||
|
||||
```typescript
|
||||
// In the main Map component:
|
||||
map.on('click', (e: L.LeafletMouseEvent) => {
|
||||
const { activeTool } = useToolStore.getState();
|
||||
|
||||
switch (activeTool) {
|
||||
case 'ruler':
|
||||
handleRulerClick(e);
|
||||
break;
|
||||
case 'rx-placement':
|
||||
handleRxPlacement(e);
|
||||
break;
|
||||
case 'site-placement':
|
||||
handleSitePlacement(e);
|
||||
break;
|
||||
case 'none':
|
||||
default:
|
||||
// No action on map click — just pan/zoom
|
||||
break;
|
||||
}
|
||||
});
|
||||
```
|
||||
|
||||
**3. Cursor changes based on active tool:**
|
||||
|
||||
```typescript
|
||||
useEffect(() => {
|
||||
const container = map.getContainer();
|
||||
// Remove all tool cursors
|
||||
container.classList.remove('ruler-mode', 'rx-placement-mode', 'site-placement-mode');
|
||||
|
||||
switch (activeTool) {
|
||||
case 'ruler':
|
||||
container.classList.add('ruler-mode');
|
||||
break;
|
||||
case 'rx-placement':
|
||||
container.classList.add('rx-placement-mode');
|
||||
break;
|
||||
case 'site-placement':
|
||||
container.classList.add('site-placement-mode');
|
||||
break;
|
||||
default:
|
||||
// Default cursor (arrow)
|
||||
break;
|
||||
}
|
||||
}, [activeTool]);
|
||||
```
|
||||
|
||||
**4. CSS for cursors:**
|
||||
|
||||
```css
|
||||
.leaflet-container {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
.leaflet-container.leaflet-dragging {
|
||||
cursor: grabbing !important;
|
||||
}
|
||||
|
||||
.leaflet-container.ruler-mode {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.rx-placement-mode {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.site-placement-mode {
|
||||
cursor: cell !important;
|
||||
}
|
||||
```
|
||||
|
||||
**5. UI buttons toggle tool mode:**
|
||||
|
||||
```typescript
|
||||
// Ruler button:
|
||||
const handleRulerToggle = () => {
|
||||
if (activeTool === 'ruler') {
|
||||
clearTool(); // Toggle off
|
||||
} else {
|
||||
setActiveTool('ruler'); // Activate ruler, deactivate others
|
||||
}
|
||||
};
|
||||
|
||||
// Link Budget "Click on Map to Set RX Point" button:
|
||||
const handleRxModeToggle = () => {
|
||||
if (activeTool === 'rx-placement') {
|
||||
clearTool();
|
||||
} else {
|
||||
setActiveTool('rx-placement');
|
||||
}
|
||||
};
|
||||
```
|
||||
|
||||
**6. Auto-deactivation:**
|
||||
- RX placement: deactivate after single click (point is set)
|
||||
- Ruler: stays active until toggled off or right-click finishes
|
||||
- Site placement: deactivate after placing site
|
||||
|
||||
---
|
||||
|
||||
## Fix: Ruler Snap to Site
|
||||
|
||||
In the ruler click handler, check proximity to existing sites:
|
||||
|
||||
```typescript
|
||||
function handleRulerClick(e: L.LeafletMouseEvent) {
|
||||
const map = e.target;
|
||||
const clickPoint = map.latLngToContainerPoint(e.latlng);
|
||||
const SNAP_THRESHOLD_PX = 20;
|
||||
|
||||
// Check all site markers
|
||||
let snappedLatLng = e.latlng;
|
||||
let snapped = false;
|
||||
|
||||
for (const site of sites) {
|
||||
const siteLatLng = L.latLng(site.lat, site.lon);
|
||||
const sitePoint = map.latLngToContainerPoint(siteLatLng);
|
||||
const pixelDist = clickPoint.distanceTo(sitePoint);
|
||||
|
||||
if (pixelDist < SNAP_THRESHOLD_PX) {
|
||||
snappedLatLng = siteLatLng;
|
||||
snapped = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// Add ruler point at snapped or original location
|
||||
addRulerPoint(snappedLatLng);
|
||||
|
||||
// Optional: visual feedback for snap
|
||||
if (snapped) {
|
||||
// Brief highlight on the site marker
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Fix: RX Point Placement + Visual Marker
|
||||
|
||||
When in 'rx-placement' mode and map is clicked:
|
||||
|
||||
```typescript
|
||||
function handleRxPlacement(e: L.LeafletMouseEvent) {
|
||||
const { lat, lng } = e.latlng;
|
||||
|
||||
// Update Link Budget panel coordinates
|
||||
setRxCoordinates(lat, lng);
|
||||
|
||||
// Place visible marker on map
|
||||
if (rxMarkerRef.current) {
|
||||
rxMarkerRef.current.setLatLng([lat, lng]);
|
||||
} else {
|
||||
rxMarkerRef.current = L.marker([lat, lng], {
|
||||
icon: L.divIcon({
|
||||
className: 'rx-point-marker',
|
||||
html: `<div style="
|
||||
width: 14px; height: 14px;
|
||||
background: #f97316;
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 6px rgba(249,115,22,0.6);
|
||||
"></div>`,
|
||||
iconSize: [14, 14],
|
||||
iconAnchor: [7, 7],
|
||||
}),
|
||||
draggable: true,
|
||||
}).addTo(map);
|
||||
|
||||
// Update coords on drag
|
||||
rxMarkerRef.current.on('drag', (ev) => {
|
||||
const pos = ev.target.getLatLng();
|
||||
setRxCoordinates(pos.lat, pos.lng);
|
||||
});
|
||||
}
|
||||
|
||||
// Draw dashed line from TX to RX
|
||||
const selectedSite = getSelectedSite();
|
||||
if (selectedSite && linkLineRef.current) {
|
||||
linkLineRef.current.setLatLngs([[selectedSite.lat, selectedSite.lon], [lat, lng]]);
|
||||
} else if (selectedSite) {
|
||||
linkLineRef.current = L.polyline(
|
||||
[[selectedSite.lat, selectedSite.lon], [lat, lng]],
|
||||
{ color: '#f97316', weight: 2, dashArray: '8,4', opacity: 0.8 }
|
||||
).addTo(map);
|
||||
}
|
||||
|
||||
// Deactivate RX placement mode (single click action)
|
||||
clearTool();
|
||||
}
|
||||
|
||||
// Cleanup when Link Budget panel closes:
|
||||
function cleanupRxMarker() {
|
||||
if (rxMarkerRef.current) {
|
||||
rxMarkerRef.current.remove();
|
||||
rxMarkerRef.current = null;
|
||||
}
|
||||
if (linkLineRef.current) {
|
||||
linkLineRef.current.remove();
|
||||
linkLineRef.current = null;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Fix: Terrain Profile Click-Through
|
||||
|
||||
The Terrain Profile popup and its "Terrain Profile" trigger button must stop event propagation:
|
||||
|
||||
```typescript
|
||||
// On the Terrain Profile button in the measurement overlay:
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
showTerrainProfile();
|
||||
}}
|
||||
onMouseDown={(e) => e.stopPropagation()}
|
||||
onPointerDown={(e) => e.stopPropagation()}
|
||||
>
|
||||
Terrain Profile
|
||||
</button>
|
||||
|
||||
// On the Terrain Profile popup container:
|
||||
<div
|
||||
className="terrain-profile-popup"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
onMouseDown={(e) => e.stopPropagation()}
|
||||
onPointerDown={(e) => e.stopPropagation()}
|
||||
>
|
||||
{/* ... chart content ... */}
|
||||
</div>
|
||||
```
|
||||
|
||||
Also ensure the popup/panel has `pointer-events: auto` and is positioned with a high z-index above the map.
|
||||
|
||||
With the tool mode system in place, this becomes less critical since clicking terrain profile UI won't trigger ruler (ruler mode would be separate), but stopping propagation is still good practice.
|
||||
|
||||
---
|
||||
|
||||
## Fix: Default Cursor (Not Hand)
|
||||
|
||||
Override Leaflet's default grab cursor:
|
||||
|
||||
```css
|
||||
/* Global override in the app's main CSS */
|
||||
.leaflet-container {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
/* Only show grab when actually dragging */
|
||||
.leaflet-container.leaflet-dragging,
|
||||
.leaflet-container:active {
|
||||
cursor: grabbing !important;
|
||||
}
|
||||
|
||||
/* Remove grab cursor from interactive layers too */
|
||||
.leaflet-interactive {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
/* Tool-specific cursors applied via JS class toggle */
|
||||
.leaflet-container.tool-ruler {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.tool-rx-placement {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.tool-site-placement {
|
||||
cursor: cell !important;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
- [ ] Only ONE tool can be active at a time
|
||||
- [ ] Activating Ruler deactivates RX placement and vice versa
|
||||
- [ ] Default cursor is arrow (not hand/grab)
|
||||
- [ ] Cursor changes to crosshair when Ruler is active
|
||||
- [ ] Cursor changes to crosshair when RX placement is active
|
||||
- [ ] Cursor shows grabbing only when dragging map
|
||||
- [ ] Clicking Terrain Profile button does NOT place ruler point
|
||||
- [ ] Clicking any UI panel/popup does NOT place ruler point
|
||||
- [ ] Ruler point snaps to site marker when clicking within 20px
|
||||
- [ ] RX point click places orange marker on map
|
||||
- [ ] Dashed orange line appears from TX site to RX marker
|
||||
- [ ] RX marker is draggable (updates coordinates in panel)
|
||||
- [ ] RX marker removed when Link Budget panel closes
|
||||
- [ ] Right-click finishes ruler measurement
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
fix(tools): implement active tool mode system, fix click conflicts
|
||||
|
||||
- Add ActiveTool state (none/ruler/rx-placement/site-placement)
|
||||
- Single map click handler dispatches to active tool only
|
||||
- Fix cursor: default arrow, crosshair for tools, grabbing for drag
|
||||
- Add ruler snap-to-site (20px threshold)
|
||||
- Add RX marker with draggable orange dot and dashed line
|
||||
- Stop event propagation on all UI overlays above map
|
||||
- Clean up markers when panels close
|
||||
```
|
||||
106
docs/devlog/gpu_supp/RFCP-3.10.3-Calculator-Ruler-UX.md
Normal file
106
docs/devlog/gpu_supp/RFCP-3.10.3-Calculator-Ruler-UX.md
Normal file
@@ -0,0 +1,106 @@
|
||||
# RFCP — Iteration 3.10.3: Calculator Shortcut & Ruler Limit
|
||||
|
||||
## Two small UX changes, no backend.
|
||||
|
||||
---
|
||||
|
||||
## 1. Link Budget Calculator — Quick Access Button
|
||||
|
||||
Move calculator access to a visible toolbar button, not buried in Map Tools panel.
|
||||
|
||||
**Location:** Top-left corner of the map, below the zoom controls (+/- buttons). Similar to how Fit, Reset, Topo, Grid, Ruler, Elev buttons are in the top-right.
|
||||
|
||||
**Implementation:**
|
||||
Add a button to the left toolbar (or create a small floating button group):
|
||||
|
||||
```typescript
|
||||
// Top-left button, below zoom controls
|
||||
<button
|
||||
className="map-tool-btn"
|
||||
onClick={() => setShowLinkBudget(!showLinkBudget)}
|
||||
title="Link Budget Calculator"
|
||||
>
|
||||
{/* Calculator icon — use an emoji or SVG */}
|
||||
🔗 {/* or a small "LB" text label, or a calculator SVG icon */}
|
||||
</button>
|
||||
```
|
||||
|
||||
**Styling:** Same visual style as the right-side tool buttons (Fit, Reset, Topo, Grid, Ruler, Elev) — dark rounded rectangle with light text/icon.
|
||||
|
||||
**Position options (pick one):**
|
||||
- **Option A:** Add to the RIGHT toolbar stack below "Elev" button — keeps all tools together
|
||||
- **Option B:** Floating button top-left below zoom — separate but prominent
|
||||
- **Option C:** Add to the measurement overlay bar (near the ruler distance display)
|
||||
|
||||
Recommend **Option A** — add "LB" or calculator icon button to the right toolbar stack, below Elev. Consistent with existing UI pattern.
|
||||
|
||||
Also: Remove the "Hide Link Budget Calculator" button from Map Tools panel (or keep it as secondary toggle — but primary access should be the toolbar button).
|
||||
|
||||
---
|
||||
|
||||
## 2. Ruler — Maximum 2 Points Only
|
||||
|
||||
**Problem:** Ruler currently allows unlimited points, creating a web of measurement lines. For RF point-to-point measurement, only 2 points make sense: start and end.
|
||||
|
||||
**Fix:** Limit ruler to exactly 2 points. When both points are placed, the measurement is complete. To start a new measurement, clicking again replaces the first point and clears the old measurement.
|
||||
|
||||
```typescript
|
||||
// In the map click handler for ruler mode:
|
||||
function handleRulerClick(e: L.LeafletMouseEvent) {
|
||||
const currentPoints = rulerPoints;
|
||||
|
||||
if (currentPoints.length === 0) {
|
||||
// First point
|
||||
setRulerPoints([snappedLatLng]);
|
||||
} else if (currentPoints.length === 1) {
|
||||
// Second point — measurement complete
|
||||
setRulerPoints([currentPoints[0], snappedLatLng]);
|
||||
// Optionally: auto-deactivate ruler mode after 2nd point
|
||||
// clearTool(); // uncomment if you want one-shot behavior
|
||||
} else {
|
||||
// Already 2 points — start new measurement
|
||||
// Replace: clear old points, start fresh with new first point
|
||||
setRulerPoints([snappedLatLng]);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**Behavior:**
|
||||
1. Click 1: Place start point (show marker)
|
||||
2. Click 2: Place end point (show marker + line + distance label + Terrain Profile button)
|
||||
3. Click 3: Clear previous, start new measurement from this click
|
||||
4. Right-click or Escape: Cancel/clear ruler entirely
|
||||
|
||||
**Remove:**
|
||||
- Remove "Right-click to finish" instruction (no longer needed — measurement auto-completes at 2 points)
|
||||
- Remove multi-point polyline rendering (only single line between 2 points)
|
||||
|
||||
**Visual:**
|
||||
- Show a single straight line between 2 points (green dashed, as current)
|
||||
- Distance label at midpoint
|
||||
- Terrain Profile button appears after 2nd point is placed
|
||||
- Small circle markers at both endpoints
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
- [ ] Calculator button visible in toolbar (right side, below Elev)
|
||||
- [ ] Click calculator button opens/closes Link Budget panel
|
||||
- [ ] Ruler allows exactly 2 points, no more
|
||||
- [ ] Third click starts new measurement (replaces old)
|
||||
- [ ] Escape clears ruler
|
||||
- [ ] Distance + Terrain Profile button appears after 2nd point
|
||||
- [ ] No multi-point web/polygon possible
|
||||
- [ ] Ruler still snaps to site markers
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
fix(ux): add calculator toolbar button, limit ruler to 2 points
|
||||
|
||||
- Add Link Budget Calculator button to right toolbar
|
||||
- Limit ruler to exactly 2 points (point-to-point only)
|
||||
- Third click starts new measurement, clears previous
|
||||
- Remove multi-point polyline behavior
|
||||
```
|
||||
136
docs/devlog/gpu_supp/RFCP-3.10.4-TerrainClick-TxHeight.md
Normal file
136
docs/devlog/gpu_supp/RFCP-3.10.4-TerrainClick-TxHeight.md
Normal file
@@ -0,0 +1,136 @@
|
||||
# RFCP — Iteration 3.10.4: Terrain Profile Click Fix & TX Height
|
||||
|
||||
## Two bugs remaining from previous iterations.
|
||||
|
||||
---
|
||||
|
||||
## Bug 1: Terrain Profile click still places ruler point
|
||||
|
||||
**Problem:** Clicking inside the Terrain Profile popup (chart area, close button, fresnel checkbox, anywhere in the popup) triggers the map click handler underneath, which places a ruler point or resets the measurement.
|
||||
|
||||
**Previous fix was incomplete** — stopPropagation was added to some elements but not the entire popup container and its backdrop.
|
||||
|
||||
**Fix:** The Terrain Profile popup needs a FULL click barrier. Every mouse event must be caught:
|
||||
|
||||
```typescript
|
||||
// The OUTERMOST container of the Terrain Profile popup:
|
||||
<div
|
||||
className="terrain-profile-container"
|
||||
onClick={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
onMouseDown={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
onMouseUp={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
onPointerDown={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
onPointerUp={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
onDoubleClick={(e) => { e.stopPropagation(); e.nativeEvent.stopImmediatePropagation(); }}
|
||||
>
|
||||
{/* All terrain profile content */}
|
||||
</div>
|
||||
```
|
||||
|
||||
**IMPORTANT:** `stopPropagation()` alone may not be enough because Leaflet listens to DOM events directly, not React synthetic events. The fix MUST also call `e.nativeEvent.stopImmediatePropagation()` to prevent Leaflet's native DOM listener from firing.
|
||||
|
||||
**Alternative approach (more robust):** Add the popup OUTSIDE the Leaflet map container in the DOM tree. If the Terrain Profile div is a sibling or parent of the map div (not a child), Leaflet's event delegation won't catch clicks on it at all.
|
||||
|
||||
```tsx
|
||||
// In the main layout:
|
||||
<div className="app-layout">
|
||||
<div id="map-container">
|
||||
{/* Leaflet map renders here */}
|
||||
</div>
|
||||
|
||||
{/* These are OUTSIDE the map container — Leaflet can't intercept */}
|
||||
{showTerrainProfile && (
|
||||
<TerrainProfile ... />
|
||||
)}
|
||||
{showLinkBudget && (
|
||||
<LinkBudgetPanel ... />
|
||||
)}
|
||||
</div>
|
||||
```
|
||||
|
||||
If moving outside the map container is too much refactoring, the stopImmediatePropagation approach should work. But check: is the TerrainProfile component rendered INSIDE a Leaflet pane or overlay? If so, moving it out is the correct fix.
|
||||
|
||||
**Also apply the same fix to:**
|
||||
- Link Budget Calculator panel
|
||||
- Any other floating panel/popup that sits over the map
|
||||
|
||||
---
|
||||
|
||||
## Bug 2: TX Height always shows 2m in Link Budget Calculator
|
||||
|
||||
**Problem:** The Link Budget Calculator TRANSMITTER section always shows `Height: 2m` regardless of the actual site configuration. It should read the height from the selected site's settings.
|
||||
|
||||
**Root cause:** The LinkBudgetPanel component likely reads `site.height` but the site object might store height in a different field name (e.g., `site.antennaHeight`, `site.towerHeight`, `site.params.height`, or per-sector height).
|
||||
|
||||
**Fix:** Find where site height is stored and pass the correct value:
|
||||
|
||||
```typescript
|
||||
// In LinkBudgetPanel.tsx, find where TX height is set:
|
||||
// WRONG (probably current):
|
||||
const txHeight = site.height || 2; // Defaults to 2 if field is missing
|
||||
|
||||
// Check the actual site data structure. It might be:
|
||||
const txHeight = site.antennaHeight
|
||||
|| site.tower_height
|
||||
|| site.params?.height
|
||||
|| site.sectors?.[0]?.height // If height is per-sector
|
||||
|| 30; // Default should be 30m for a typical cell tower, not 2m
|
||||
|
||||
// Or if height is stored in meters in a nested config:
|
||||
const txHeight = selectedSite?.config?.height || selectedSite?.height || 30;
|
||||
```
|
||||
|
||||
**Steps to debug:**
|
||||
1. In the browser console (F12), find the selected site object
|
||||
2. Check what field contains the height value
|
||||
3. Update LinkBudgetPanel to read from the correct field
|
||||
|
||||
**Display fix:**
|
||||
```typescript
|
||||
// In the TRANSMITTER section of the panel:
|
||||
<div className="param-row">
|
||||
<span>Height:</span>
|
||||
<span>{txHeight} m</span>
|
||||
</div>
|
||||
```
|
||||
|
||||
The height should also be EDITABLE in the link budget calculator (as an input field, not just display), since you might want to test "what if I put the antenna at 40m instead of 30m?" without changing the actual site config.
|
||||
|
||||
```typescript
|
||||
// Make height an editable field with site value as default:
|
||||
const [txHeightOverride, setTxHeightOverride] = useState<number | null>(null);
|
||||
const txHeight = txHeightOverride ?? (site?.height || 30);
|
||||
|
||||
<div className="param-row">
|
||||
<label>Height:</label>
|
||||
<input
|
||||
type="number"
|
||||
value={txHeight}
|
||||
onChange={(e) => setTxHeightOverride(parseFloat(e.target.value))}
|
||||
/> m
|
||||
</div>
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
- [ ] Click ANYWHERE inside Terrain Profile popup — NO ruler point placed
|
||||
- [ ] Click Terrain Profile close button (X) — popup closes, no ruler point
|
||||
- [ ] Click Fresnel Zone checkbox — toggles, no ruler point
|
||||
- [ ] Click chart area — no ruler point
|
||||
- [ ] Drag/scroll inside chart — no map pan/zoom
|
||||
- [ ] TX Height in Link Budget shows actual site height (not 2m)
|
||||
- [ ] TX Height is editable for what-if scenarios
|
||||
- [ ] Changing TX height recalculates link budget
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
fix(ui): block all click propagation from terrain profile, fix TX height
|
||||
|
||||
- Add stopImmediatePropagation on terrain profile container
|
||||
- Prevent all mouse/pointer events from reaching Leaflet map
|
||||
- Fix TX height reading from site config (was defaulting to 2m)
|
||||
- Make TX height editable in link budget calculator
|
||||
```
|
||||
436
docs/devlog/gpu_supp/RFCP-3.9.0-SRTM-Terrain-Integration.md
Normal file
436
docs/devlog/gpu_supp/RFCP-3.9.0-SRTM-Terrain-Integration.md
Normal file
@@ -0,0 +1,436 @@
|
||||
# RFCP 3.9.0 — SRTM1 Real Terrain Data Integration
|
||||
|
||||
## Context
|
||||
|
||||
RFCP currently downloads terrain tiles from an elevation API at runtime.
|
||||
This works but has limitations:
|
||||
- Requires internet connection
|
||||
- Unknown data source quality
|
||||
- No offline capability (critical for tactical/field use)
|
||||
- No control over resolution or caching
|
||||
|
||||
Goal: Replace with SRTM1 (30m resolution) HGT files, offline-first architecture.
|
||||
|
||||
## SRTM1 Data Format
|
||||
|
||||
HGT files are dead simple:
|
||||
- 1°×1° tiles, named by southwest corner: `N48E033.hgt`
|
||||
- 3601×3601 grid of signed 16-bit integers (big-endian)
|
||||
- Each value = elevation in meters
|
||||
- File size: exactly 25,934,402 bytes (3601 × 3601 × 2)
|
||||
- Row order: north to south (first row = northernmost)
|
||||
- Column order: west to east
|
||||
- Adjacent tiles overlap by 1 pixel on shared edges
|
||||
- Void/no-data value: -32768
|
||||
|
||||
Compressed (.hgt.zip): ~10-15 MB per tile typically.
|
||||
|
||||
## Architecture
|
||||
|
||||
### Tile Storage Layout
|
||||
|
||||
```
|
||||
{app_data}/terrain/
|
||||
├── srtm1/ # 30m resolution tiles
|
||||
│ ├── N48E033.hgt # Uncompressed for fast access
|
||||
│ ├── N48E034.hgt
|
||||
│ ├── N48E035.hgt
|
||||
│ └── ...
|
||||
├── tile_index.json # Metadata: available tiles, checksums, dates
|
||||
└── downloads/ # Temporary download staging
|
||||
```
|
||||
|
||||
On Windows, `{app_data}` = the application's data directory.
|
||||
For PyInstaller exe: `data/terrain/` relative to exe location.
|
||||
The path must be configurable (environment variable or config file).
|
||||
|
||||
### Tile Manager (new file: `terrain_manager.py`)
|
||||
|
||||
```python
|
||||
class SRTMTileManager:
|
||||
"""Manages SRTM1 HGT tile storage, loading, and caching."""
|
||||
|
||||
def __init__(self, terrain_dir: str):
|
||||
self.terrain_dir = Path(terrain_dir)
|
||||
self.srtm1_dir = self.terrain_dir / "srtm1"
|
||||
self.srtm1_dir.mkdir(parents=True, exist_ok=True)
|
||||
|
||||
# In-memory cache: tile_name -> numpy array
|
||||
self._tile_cache: Dict[str, np.ndarray] = {}
|
||||
self._max_cache_tiles = 16 # ~16 tiles = ~400 MB RAM
|
||||
|
||||
def get_tile_name(self, lat: float, lon: float) -> str:
|
||||
"""Convert lat/lon to SRTM tile name."""
|
||||
# Floor to get southwest corner
|
||||
lat_int = int(lat) if lat >= 0 else int(lat) - 1
|
||||
lon_int = int(lon) if lon >= 0 else int(lon) - 1
|
||||
|
||||
lat_prefix = "N" if lat_int >= 0 else "S"
|
||||
lon_prefix = "E" if lon_int >= 0 else "W"
|
||||
|
||||
return f"{lat_prefix}{abs(lat_int):02d}{lon_prefix}{abs(lon_int):03d}"
|
||||
|
||||
def get_required_tiles(self, center_lat, center_lon, radius_km) -> List[str]:
|
||||
"""Determine which tiles are needed for a coverage calculation."""
|
||||
# Calculate bounding box from center + radius
|
||||
# Return list of tile names
|
||||
|
||||
def has_tile(self, tile_name: str) -> bool:
|
||||
"""Check if tile exists locally."""
|
||||
return (self.srtm1_dir / f"{tile_name}.hgt").exists()
|
||||
|
||||
def load_tile(self, tile_name: str) -> Optional[np.ndarray]:
|
||||
"""Load tile from disk into memory. Returns 3601x3601 int16 array."""
|
||||
if tile_name in self._tile_cache:
|
||||
return self._tile_cache[tile_name]
|
||||
|
||||
hgt_path = self.srtm1_dir / f"{tile_name}.hgt"
|
||||
if not hgt_path.exists():
|
||||
return None
|
||||
|
||||
# Read raw HGT: big-endian signed 16-bit
|
||||
data = np.fromfile(str(hgt_path), dtype='>i2')
|
||||
tile = data.reshape((3601, 3601))
|
||||
|
||||
# Replace void values
|
||||
tile = tile.astype(np.float32)
|
||||
tile[tile == -32768] = np.nan
|
||||
|
||||
# Cache management (LRU-style: evict oldest if full)
|
||||
if len(self._tile_cache) >= self._max_cache_tiles:
|
||||
oldest_key = next(iter(self._tile_cache))
|
||||
del self._tile_cache[oldest_key]
|
||||
|
||||
self._tile_cache[tile_name] = tile
|
||||
return tile
|
||||
|
||||
def get_elevation(self, lat: float, lon: float) -> Optional[float]:
|
||||
"""Get elevation at a single point with bilinear interpolation."""
|
||||
tile_name = self.get_tile_name(lat, lon)
|
||||
tile = self.load_tile(tile_name)
|
||||
if tile is None:
|
||||
return None
|
||||
return self._bilinear_sample(tile, lat, lon)
|
||||
|
||||
def get_elevations_batch(self, lats: np.ndarray, lons: np.ndarray) -> np.ndarray:
|
||||
"""Get elevations for array of points. Vectorized."""
|
||||
# Group points by tile
|
||||
# Load needed tiles
|
||||
# Vectorized bilinear interpolation per tile
|
||||
# Return array of elevations
|
||||
|
||||
async def download_tile(self, tile_name: str) -> bool:
|
||||
"""Download a single tile from remote source (if online)."""
|
||||
# Try multiple sources in order:
|
||||
# 1. Own server (future: UMTC sync endpoint)
|
||||
# 2. srtm.fasma.org (no auth required)
|
||||
# 3. viewfinderpanoramas.org (no auth, void-filled)
|
||||
# Returns True if successful
|
||||
|
||||
def get_missing_tiles(self, center_lat, center_lon, radius_km) -> List[str]:
|
||||
"""Check which needed tiles are not available locally."""
|
||||
required = self.get_required_tiles(center_lat, center_lon, radius_km)
|
||||
return [t for t in required if not self.has_tile(t)]
|
||||
```
|
||||
|
||||
### Bilinear Interpolation (CRITICAL for accuracy)
|
||||
|
||||
Current system uses nearest-neighbor (pick closest grid cell).
|
||||
SRTM1 at 30m means nearest-neighbor can have 15m positional error.
|
||||
Bilinear interpolation reduces this to sub-meter accuracy.
|
||||
|
||||
```python
|
||||
def _bilinear_sample(self, tile: np.ndarray, lat: float, lon: float) -> float:
|
||||
"""Sample elevation with bilinear interpolation."""
|
||||
# Tile southwest corner
|
||||
lat_int = int(lat) if lat >= 0 else int(lat) - 1
|
||||
lon_int = int(lon) if lon >= 0 else int(lon) - 1
|
||||
|
||||
# Fractional position within tile (0.0 to 1.0)
|
||||
lat_frac = lat - lat_int # 0 = south edge, 1 = north edge
|
||||
lon_frac = lon - lon_int # 0 = west edge, 1 = east edge
|
||||
|
||||
# Convert to row/col (note: rows go north to south!)
|
||||
row_exact = (1.0 - lat_frac) * 3600.0 # 0 = north, 3600 = south
|
||||
col_exact = lon_frac * 3600.0 # 0 = west, 3600 = east
|
||||
|
||||
# Four surrounding grid points
|
||||
r0 = int(row_exact)
|
||||
c0 = int(col_exact)
|
||||
r1 = min(r0 + 1, 3600)
|
||||
c1 = min(c0 + 1, 3600)
|
||||
|
||||
# Fractional position between grid points
|
||||
dr = row_exact - r0
|
||||
dc = col_exact - c0
|
||||
|
||||
# Bilinear interpolation
|
||||
z00 = tile[r0, c0]
|
||||
z01 = tile[r0, c1]
|
||||
z10 = tile[r1, c0]
|
||||
z11 = tile[r1, c1]
|
||||
|
||||
# Handle NaN (void) values
|
||||
if np.isnan(z00) or np.isnan(z01) or np.isnan(z10) or np.isnan(z11):
|
||||
# Fall back to nearest non-NaN
|
||||
valid = [(z00, 0, 0), (z01, 0, 1), (z10, 1, 0), (z11, 1, 1)]
|
||||
valid = [(z, r, c) for z, r, c in valid if not np.isnan(z)]
|
||||
return valid[0][0] if valid else 0.0
|
||||
|
||||
elevation = (z00 * (1 - dr) * (1 - dc) +
|
||||
z01 * (1 - dr) * dc +
|
||||
z10 * dr * (1 - dc) +
|
||||
z11 * dr * dc)
|
||||
|
||||
return float(elevation)
|
||||
```
|
||||
|
||||
### Vectorized Batch Elevation (for GPU pipeline)
|
||||
|
||||
This replaces the current `_batch_elevation_lookup` in gpu_service.py.
|
||||
Must handle multi-tile seamlessly.
|
||||
|
||||
```python
|
||||
def get_elevations_batch(self, lats: np.ndarray, lons: np.ndarray) -> np.ndarray:
|
||||
"""Vectorized elevation lookup with bilinear interpolation.
|
||||
|
||||
Handles points spanning multiple tiles efficiently.
|
||||
Groups points by tile, processes each tile with full NumPy vectorization.
|
||||
"""
|
||||
elevations = np.zeros(len(lats), dtype=np.float32)
|
||||
|
||||
# Compute tile indices for each point
|
||||
lat_ints = np.where(lats >= 0, np.floor(lats).astype(int),
|
||||
np.floor(lats).astype(int))
|
||||
lon_ints = np.where(lons >= 0, np.floor(lons).astype(int),
|
||||
np.floor(lons).astype(int))
|
||||
|
||||
# Group by tile
|
||||
tile_keys = lat_ints * 1000 + lon_ints # unique key per tile
|
||||
unique_keys = np.unique(tile_keys)
|
||||
|
||||
for key in unique_keys:
|
||||
mask = tile_keys == key
|
||||
lat_int = int(key // 1000)
|
||||
lon_int = int(key % 1000)
|
||||
if lon_int > 500: # handle negative longitudes
|
||||
lon_int -= 1000
|
||||
|
||||
tile_name = self._make_tile_name(lat_int, lon_int)
|
||||
tile = self.load_tile(tile_name)
|
||||
|
||||
if tile is None:
|
||||
elevations[mask] = 0.0 # no data
|
||||
continue
|
||||
|
||||
# Vectorized bilinear for all points in this tile
|
||||
tile_lats = lats[mask]
|
||||
tile_lons = lons[mask]
|
||||
|
||||
lat_frac = tile_lats - lat_int
|
||||
lon_frac = tile_lons - lon_int
|
||||
|
||||
row_exact = (1.0 - lat_frac) * 3600.0
|
||||
col_exact = lon_frac * 3600.0
|
||||
|
||||
r0 = np.clip(row_exact.astype(int), 0, 3599)
|
||||
c0 = np.clip(col_exact.astype(int), 0, 3599)
|
||||
r1 = np.clip(r0 + 1, 0, 3600)
|
||||
c1 = np.clip(c0 + 1, 0, 3600)
|
||||
|
||||
dr = row_exact - r0
|
||||
dc = col_exact - c0
|
||||
|
||||
z00 = tile[r0, c0]
|
||||
z01 = tile[r0, c1]
|
||||
z10 = tile[r1, c0]
|
||||
z11 = tile[r1, c1]
|
||||
|
||||
result = (z00 * (1 - dr) * (1 - dc) +
|
||||
z01 * (1 - dr) * dc +
|
||||
z10 * dr * (1 - dc) +
|
||||
z11 * dr * dc)
|
||||
|
||||
# Handle NaN voids
|
||||
nan_mask = np.isnan(result)
|
||||
if nan_mask.any():
|
||||
result[nan_mask] = 0.0
|
||||
|
||||
elevations[mask] = result
|
||||
|
||||
return elevations
|
||||
```
|
||||
|
||||
## Integration Points
|
||||
|
||||
### 1. Replace terrain_service.py elevation lookup
|
||||
|
||||
Current terrain service downloads elevation data from an API.
|
||||
Replace with SRTMTileManager calls:
|
||||
|
||||
```python
|
||||
# OLD:
|
||||
elevation = await self.terrain_service.get_elevation(lat, lon)
|
||||
|
||||
# NEW:
|
||||
elevation = self.tile_manager.get_elevation(lat, lon)
|
||||
# Or for batch (GPU pipeline Phase 2.6):
|
||||
elevations = self.tile_manager.get_elevations_batch(lats_array, lons_array)
|
||||
```
|
||||
|
||||
### 2. Replace _batch_elevation_lookup in gpu_service.py
|
||||
|
||||
The vectorized elevation lookup in gpu_service.py currently loads tiles
|
||||
and does nearest-neighbor sampling. Replace with tile_manager.get_elevations_batch()
|
||||
which does bilinear interpolation.
|
||||
|
||||
### 3. Coverage service pre-check
|
||||
|
||||
Before starting calculation, check if all needed tiles are available:
|
||||
|
||||
```python
|
||||
missing = self.tile_manager.get_missing_tiles(site_lat, site_lon, radius_km)
|
||||
if missing:
|
||||
if has_internet:
|
||||
# Try to download missing tiles
|
||||
for tile_name in missing:
|
||||
await self.tile_manager.download_tile(tile_name)
|
||||
else:
|
||||
# Return warning to frontend
|
||||
return {"warning": f"Missing terrain tiles: {missing}. Using flat terrain."}
|
||||
```
|
||||
|
||||
### 4. Frontend notification
|
||||
|
||||
When tiles are missing, show a warning banner:
|
||||
"⚠ Terrain data not available for this area. Coverage accuracy reduced."
|
||||
|
||||
When tiles are being downloaded:
|
||||
"⬇ Downloading terrain data... (N48E033.hgt, 12.5 MB)"
|
||||
|
||||
### 5. Terrain Profile Viewer
|
||||
|
||||
The terrain profile viewer should use the same tile_manager
|
||||
for consistent elevation data. With bilinear interpolation,
|
||||
profiles will be much smoother and more accurate.
|
||||
|
||||
## Download Sources (Priority Order)
|
||||
|
||||
For auto-download when online:
|
||||
|
||||
1. **srtm.fasma.org** (no auth, direct HGT.zip download)
|
||||
URL: `https://srtm.fasma.org/N48E033.SRTMGL1.hgt.zip`
|
||||
- Free, no registration
|
||||
- SRTM1 (30m) data
|
||||
- May be slow or unreliable
|
||||
|
||||
2. **viewfinderpanoramas.org** (no auth, void-filled data)
|
||||
URL: `http://viewfinderpanoramas.org/dem1/{region}/{tile}.hgt.zip`
|
||||
- Free, no registration
|
||||
- Void areas filled from topographic maps
|
||||
- Better quality in mountainous areas
|
||||
- File naming might differ by region
|
||||
|
||||
3. **Future: UMTC sync server**
|
||||
URL: `https://rfcp.{your-domain}/api/terrain/tiles/{tile_name}.hgt`
|
||||
- Self-hosted on your infrastructure
|
||||
- Accessible via WireGuard mesh
|
||||
- Can pre-populate with full Ukraine dataset
|
||||
|
||||
## Offline Bundle Strategy
|
||||
|
||||
For installer / field deployment:
|
||||
|
||||
### Option A: Region packs
|
||||
Pre-package tiles by operational area:
|
||||
- `terrain-dnipro.zip` — 4 tiles around Dnipro area (~100 MB)
|
||||
- `terrain-ukraine-east.zip` — ~50 tiles, eastern Ukraine (~1.2 GB)
|
||||
- `terrain-ukraine-full.zip` — ~171 tiles, all Ukraine (~4.3 GB)
|
||||
|
||||
### Option B: On-demand with cache
|
||||
Ship empty, download tiles as needed on first calculation.
|
||||
Cache permanently. Works well for development/testing.
|
||||
|
||||
### Option C: Live USB bundle
|
||||
For tactical deployment, include full Ukraine terrain data
|
||||
on the live USB alongside the application. 4.3 GB is acceptable
|
||||
for a USB drive.
|
||||
|
||||
Recommend: **Option B for now** (development), **Option C for deployment**.
|
||||
|
||||
## File Changes
|
||||
|
||||
### New Files
|
||||
- `backend/app/services/terrain_manager.py` — SRTMTileManager class
|
||||
|
||||
### Modified Files
|
||||
- `backend/app/services/terrain_service.py` — Replace API calls with tile_manager
|
||||
- `backend/app/services/gpu_service.py` — Replace _batch_elevation_lookup
|
||||
- `backend/app/services/coverage_service.py` — Add missing tile pre-check
|
||||
- `backend/app/main.py` — Initialize tile_manager on startup
|
||||
|
||||
### Config
|
||||
- Add `TERRAIN_DIR` environment variable / config option
|
||||
- Default: `./data/terrain` relative to backend exe
|
||||
|
||||
## Testing
|
||||
|
||||
```powershell
|
||||
# Build and test
|
||||
cd D:\root\rfcp\backend
|
||||
pyinstaller ..\installer\rfcp-server-gpu.spec --noconfirm
|
||||
.\dist\rfcp-server\rfcp-server.exe
|
||||
```
|
||||
|
||||
### Test 1: First run (no tiles cached)
|
||||
- Start app, trigger calculation
|
||||
- Should attempt to download required tile(s)
|
||||
- If online: downloads, caches, calculates
|
||||
- If offline: warning, flat terrain fallback
|
||||
|
||||
### Test 2: Cached tiles
|
||||
- Run same calculation again
|
||||
- Tile loaded from disk cache, no download
|
||||
- Should be fast (tile load from disk < 100ms)
|
||||
|
||||
### Test 3: Accuracy comparison
|
||||
- Compare elevation at known points (e.g., Dnipro city center)
|
||||
- Cross-reference with Google Earth elevation
|
||||
- Expected accuracy: ±5m horizontal, ±16m vertical (SRTM spec)
|
||||
|
||||
### Test 4: Multi-tile calculation
|
||||
- Set radius to 50km+ to span multiple tiles
|
||||
- Verify seamless stitching at tile boundaries
|
||||
- No elevation jumps or artifacts at edges
|
||||
|
||||
### Test 5: Terrain profile
|
||||
- Draw terrain profile across tile boundary
|
||||
- Should be smooth, no discontinuity
|
||||
- Compare with Google Earth profile for same path
|
||||
|
||||
### Test 6: Performance
|
||||
- Tile load time from disk: <100ms
|
||||
- Batch elevation lookup (6000 points): <50ms
|
||||
- Should not regress overall calculation time
|
||||
- Memory: ~25 MB per loaded tile, max 16 tiles = 400 MB
|
||||
|
||||
## What NOT to Change
|
||||
|
||||
- Don't modify GPU pipeline architecture (Phase 2.5/2.6/2.7)
|
||||
- Don't change propagation model math
|
||||
- Don't change API endpoints or response format
|
||||
- Don't change frontend map or heatmap rendering
|
||||
- Don't change OSM building/vegetation fetching
|
||||
- Don't change PyInstaller build process (just add data dir)
|
||||
|
||||
## Success Criteria
|
||||
|
||||
- [ ] SRTM1 tiles load correctly (3601×3601, 30m resolution)
|
||||
- [ ] Bilinear interpolation working (smoother than nearest-neighbor)
|
||||
- [ ] Offline mode works with pre-cached tiles
|
||||
- [ ] Auto-download works when online
|
||||
- [ ] Missing tile warning shown to user
|
||||
- [ ] Multi-tile seamless stitching
|
||||
- [ ] Terrain profile accuracy matches Google Earth within 20m
|
||||
- [ ] No performance regression (calculation time same or faster)
|
||||
- [ ] Tile cache directory configurable
|
||||
246
docs/devlog/gpu_supp/RFCP-3.9.1-Terra-Integration.md
Normal file
246
docs/devlog/gpu_supp/RFCP-3.9.1-Terra-Integration.md
Normal file
@@ -0,0 +1,246 @@
|
||||
# RFCP — Iteration 3.9.1: Terra Tile Server Integration
|
||||
|
||||
## Overview
|
||||
Connect terrain_service.py to our SRTM tile server (terra.eliah.one) as primary download source, add terrain status API endpoint, and create a bulk pre-download utility. The `data/terrain/` directory already exists.
|
||||
|
||||
## Context
|
||||
- terra.eliah.one is live and serving tiles via Caddy file_server
|
||||
- SRTM3 (90m): 187 tiles, 515 MB — full Ukraine coverage (N44-N51, E018-E041)
|
||||
- SRTM1 (30m): 160 tiles, 3.9 GB — same coverage area
|
||||
- terrain_service.py already has bilinear interpolation (3.9.0)
|
||||
- Backend runs on Windows with RTX 4060, tiles stored locally in `data/terrain/`
|
||||
- Server is download source, NOT used during realtime calculations
|
||||
|
||||
## Changes Required
|
||||
|
||||
### 1. Update SRTM_SOURCES in terrain_service.py
|
||||
|
||||
**File:** `backend/app/services/terrain_service.py`
|
||||
|
||||
Replace current SRTM_SOURCES (lines 22-25):
|
||||
```python
|
||||
SRTM_SOURCES = [
|
||||
"https://elevation-tiles-prod.s3.amazonaws.com/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
"https://s3.amazonaws.com/elevation-tiles-prod/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
]
|
||||
```
|
||||
|
||||
With prioritized source list:
|
||||
```python
|
||||
SRTM_SOURCES = [
|
||||
# Our tile server — SRTM1 (30m) preferred, uncompressed
|
||||
{
|
||||
"url": "https://terra.eliah.one/srtm1/{tile_name}.hgt",
|
||||
"compressed": False,
|
||||
"resolution": "srtm1",
|
||||
},
|
||||
# Our tile server — SRTM3 (90m) fallback
|
||||
{
|
||||
"url": "https://terra.eliah.one/srtm3/{tile_name}.hgt",
|
||||
"compressed": False,
|
||||
"resolution": "srtm3",
|
||||
},
|
||||
# Public AWS mirror — SRTM1, gzip compressed
|
||||
{
|
||||
"url": "https://elevation-tiles-prod.s3.amazonaws.com/skadi/{lat_dir}/{tile_name}.hgt.gz",
|
||||
"compressed": True,
|
||||
"resolution": "srtm1",
|
||||
},
|
||||
]
|
||||
```
|
||||
|
||||
Update `download_tile()` to handle the new source format:
|
||||
```python
|
||||
async def download_tile(self, tile_name: str) -> bool:
|
||||
"""Download SRTM tile from configured sources, preferring highest resolution."""
|
||||
tile_path = self.get_tile_path(tile_name)
|
||||
|
||||
if tile_path.exists():
|
||||
return True
|
||||
|
||||
lat_dir = tile_name[:3] # e.g., "N48"
|
||||
|
||||
async with httpx.AsyncClient(timeout=60.0, follow_redirects=True) as client:
|
||||
for source in self.SRTM_SOURCES:
|
||||
url = source["url"].format(lat_dir=lat_dir, tile_name=tile_name)
|
||||
try:
|
||||
response = await client.get(url)
|
||||
|
||||
if response.status_code == 200:
|
||||
data = response.content
|
||||
|
||||
# Skip empty responses
|
||||
if len(data) < 1000:
|
||||
continue
|
||||
|
||||
if source["compressed"]:
|
||||
if url.endswith('.gz'):
|
||||
data = gzip.decompress(data)
|
||||
elif url.endswith('.zip'):
|
||||
with zipfile.ZipFile(io.BytesIO(data)) as zf:
|
||||
for name in zf.namelist():
|
||||
if name.endswith('.hgt'):
|
||||
data = zf.read(name)
|
||||
break
|
||||
|
||||
# Validate tile size
|
||||
if len(data) not in (3601 * 3601 * 2, 1201 * 1201 * 2):
|
||||
print(f"[Terrain] Invalid tile size {len(data)} from {url}")
|
||||
continue
|
||||
|
||||
tile_path.write_bytes(data)
|
||||
res = source["resolution"]
|
||||
size_mb = len(data) / 1048576
|
||||
print(f"[Terrain] Downloaded {tile_name} ({res}, {size_mb:.1f} MB)")
|
||||
return True
|
||||
|
||||
except Exception as e:
|
||||
print(f"[Terrain] Failed from {url}: {e}")
|
||||
continue
|
||||
|
||||
print(f"[Terrain] Could not download {tile_name} from any source")
|
||||
return False
|
||||
```
|
||||
|
||||
### 2. Add Terrain Status API Endpoint
|
||||
|
||||
**File:** `backend/app/api/routes.py` (or wherever API routes are defined)
|
||||
|
||||
Add a new endpoint:
|
||||
```python
|
||||
@router.get("/api/terrain/status")
|
||||
async def terrain_status():
|
||||
"""Return terrain data availability info."""
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
cached_tiles = terrain_service.get_cached_tiles()
|
||||
cache_size = terrain_service.get_cache_size_mb()
|
||||
|
||||
# Categorize by resolution
|
||||
srtm1_tiles = [t for t in cached_tiles
|
||||
if (terrain_service.terrain_path / f"{t}.hgt").stat().st_size == 3601 * 3601 * 2]
|
||||
srtm3_tiles = [t for t in cached_tiles if t not in srtm1_tiles]
|
||||
|
||||
return {
|
||||
"total_tiles": len(cached_tiles),
|
||||
"srtm1": {
|
||||
"count": len(srtm1_tiles),
|
||||
"resolution_m": 30,
|
||||
"tiles": sorted(srtm1_tiles),
|
||||
},
|
||||
"srtm3": {
|
||||
"count": len(srtm3_tiles),
|
||||
"resolution_m": 90,
|
||||
"tiles": sorted(srtm3_tiles),
|
||||
},
|
||||
"cache_size_mb": round(cache_size, 1),
|
||||
"memory_cached": len(terrain_service._tile_cache),
|
||||
"terra_server": "https://terra.eliah.one",
|
||||
}
|
||||
```
|
||||
|
||||
### 3. Add Bulk Pre-Download Endpoint
|
||||
|
||||
**File:** Same routes file
|
||||
|
||||
```python
|
||||
@router.post("/api/terrain/download")
|
||||
async def terrain_download(request: dict):
|
||||
"""Pre-download tiles for a region.
|
||||
|
||||
Body: {"center_lat": 48.46, "center_lon": 35.04, "radius_km": 50}
|
||||
Or: {"tiles": ["N48E034", "N48E035", "N47E034", "N47E035"]}
|
||||
"""
|
||||
from app.services.terrain_service import terrain_service
|
||||
|
||||
if "tiles" in request:
|
||||
tile_list = request["tiles"]
|
||||
else:
|
||||
center_lat = request.get("center_lat", 48.46)
|
||||
center_lon = request.get("center_lon", 35.04)
|
||||
radius_km = request.get("radius_km", 50)
|
||||
tile_list = terrain_service.get_required_tiles(center_lat, center_lon, radius_km)
|
||||
|
||||
missing = [t for t in tile_list if not terrain_service.get_tile_path(t).exists()]
|
||||
|
||||
if not missing:
|
||||
return {"status": "ok", "message": "All tiles already cached", "count": len(tile_list)}
|
||||
|
||||
# Download missing tiles
|
||||
downloaded = []
|
||||
failed = []
|
||||
for tile_name in missing:
|
||||
success = await terrain_service.download_tile(tile_name)
|
||||
if success:
|
||||
downloaded.append(tile_name)
|
||||
else:
|
||||
failed.append(tile_name)
|
||||
|
||||
return {
|
||||
"status": "ok",
|
||||
"required": len(tile_list),
|
||||
"already_cached": len(tile_list) - len(missing),
|
||||
"downloaded": downloaded,
|
||||
"failed": failed,
|
||||
}
|
||||
```
|
||||
|
||||
### 4. Add Tile Index Endpoint
|
||||
|
||||
**File:** Same routes file
|
||||
|
||||
```python
|
||||
@router.get("/api/terrain/index")
|
||||
async def terrain_index():
|
||||
"""Fetch tile index from terra server."""
|
||||
import httpx
|
||||
try:
|
||||
async with httpx.AsyncClient(timeout=10.0) as client:
|
||||
resp = await client.get("https://terra.eliah.one/api/index")
|
||||
if resp.status_code == 200:
|
||||
return resp.json()
|
||||
except Exception:
|
||||
pass
|
||||
return {"error": "Could not reach terra.eliah.one", "offline": True}
|
||||
```
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
- [ ] `GET /api/terrain/status` returns tile counts and sizes
|
||||
- [ ] `POST /api/terrain/download {"center_lat": 48.46, "center_lon": 35.04, "radius_km": 10}` downloads missing tiles from terra.eliah.one
|
||||
- [ ] Tiles downloaded from terra are valid HGT format (2,884,802 or 25,934,402 bytes)
|
||||
- [ ] SRTM1 is preferred over SRTM3 when downloading
|
||||
- [ ] Existing tiles are not re-downloaded
|
||||
- [ ] Coverage calculation works with terrain data (test with Dnipro coordinates)
|
||||
- [ ] `GET /api/terrain/index` returns terra server tile list
|
||||
|
||||
## Build & Deploy
|
||||
|
||||
```bash
|
||||
cd D:\root\rfcp\backend
|
||||
# No build needed — Python backend, just restart
|
||||
# Kill existing uvicorn and restart:
|
||||
python -m uvicorn app.main:app --host 0.0.0.0 --port 8000 --reload
|
||||
```
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
feat(terrain): integrate terra.eliah.one tile server
|
||||
|
||||
- Add terra.eliah.one as primary SRTM source (SRTM1 30m preferred)
|
||||
- Keep AWS S3 as fallback source
|
||||
- Add /api/terrain/status endpoint (tile inventory)
|
||||
- Add /api/terrain/download endpoint (bulk pre-download)
|
||||
- Add /api/terrain/index endpoint (terra server index)
|
||||
- Validate tile size before saving
|
||||
- Add follow_redirects=True to httpx client
|
||||
```
|
||||
|
||||
## Success Criteria
|
||||
|
||||
1. terrain_service downloads from terra.eliah.one first
|
||||
2. /api/terrain/status shows correct tile counts by resolution
|
||||
3. /api/terrain/download fetches tiles for any Ukrainian coordinate
|
||||
4. Offline mode works — no downloads attempted if tiles exist locally
|
||||
5. Coverage calculation uses real elevation data instead of flat terrain
|
||||
@@ -0,0 +1,516 @@
|
||||
# RFCP — Iteration 3.10.5: WebGL Smooth Coverage Interpolation
|
||||
|
||||
**Date:** February 6, 2026
|
||||
**Priority:** P1 (Major Visual Improvement)
|
||||
**Estimated Time:** 3-4 hours
|
||||
**Author:** Claude (Opus 4.5) for Олег @ UMTC
|
||||
|
||||
---
|
||||
|
||||
## Overview
|
||||
|
||||
Replace the current grid-based square coverage visualization with smooth WebGL-interpolated rendering. Currently coverage is displayed as discrete colored squares which looks "pixelated" and unrealistic. Professional RF tools like CloudRF use smooth gradients that interpolate between measurement points.
|
||||
|
||||
**Current State:** Grid squares at 50m/200m resolution → blocky appearance
|
||||
**Target State:** Smooth bilinear/bicubic interpolation → professional gradient appearance
|
||||
|
||||
---
|
||||
|
||||
## Problem Description
|
||||
|
||||
### Current Implementation
|
||||
- Coverage points are rendered as discrete squares on a Leaflet canvas layer
|
||||
- Each grid point (lat, lon, rsrp) → one colored square
|
||||
- Resolution determines square size (50m = small squares, 200m = large squares)
|
||||
- Result: Looks like Minecraft, not like professional RF planning software
|
||||
|
||||
### Desired Outcome
|
||||
- Smooth color transitions between coverage points
|
||||
- GPU-accelerated rendering via WebGL
|
||||
- No visible grid artifacts
|
||||
- Performance maintained or improved (GPU does interpolation)
|
||||
- Same data, better visualization
|
||||
|
||||
---
|
||||
|
||||
## Technical Approach
|
||||
|
||||
### Option A: WebGL Fragment Shader (RECOMMENDED)
|
||||
|
||||
Use a WebGL fragment shader that:
|
||||
1. Receives coverage points as a texture or uniform array
|
||||
2. For each screen pixel, finds nearest coverage points
|
||||
3. Performs bilinear interpolation between them
|
||||
4. Outputs smoothly interpolated color
|
||||
|
||||
**Pros:**
|
||||
- Best visual quality
|
||||
- GPU-accelerated (fast)
|
||||
- Scales to any resolution
|
||||
- Industry standard approach
|
||||
|
||||
**Cons:**
|
||||
- More complex implementation
|
||||
- Requires WebGL knowledge
|
||||
|
||||
### Option B: Canvas with Gaussian Blur
|
||||
|
||||
Apply Gaussian blur to the existing canvas after rendering squares.
|
||||
|
||||
**Pros:**
|
||||
- Simple to implement
|
||||
- Works with existing code
|
||||
|
||||
**Cons:**
|
||||
- Blurs edges (coverage boundary becomes fuzzy)
|
||||
- Not true interpolation
|
||||
- Performance overhead
|
||||
|
||||
### Option C: Pre-interpolate on CPU
|
||||
|
||||
Generate more points by interpolating between existing ones before rendering.
|
||||
|
||||
**Pros:**
|
||||
- Simpler rendering
|
||||
- Works with existing canvas
|
||||
|
||||
**Cons:**
|
||||
- Much slower (CPU-bound)
|
||||
- Memory intensive
|
||||
- Not scalable
|
||||
|
||||
**DECISION: Implement Option A (WebGL Fragment Shader)**
|
||||
|
||||
---
|
||||
|
||||
## Implementation Plan
|
||||
|
||||
### Phase 1: WebGL Layer Setup
|
||||
|
||||
**File:** `frontend/src/components/map/WebGLCoverageLayer.tsx`
|
||||
|
||||
Create a new Leaflet layer that uses WebGL for rendering:
|
||||
|
||||
```typescript
|
||||
import { useEffect, useRef } from 'react';
|
||||
import { useMap } from 'react-leaflet';
|
||||
import L from 'leaflet';
|
||||
|
||||
interface CoveragePoint {
|
||||
lat: number;
|
||||
lon: number;
|
||||
rsrp: number;
|
||||
}
|
||||
|
||||
interface WebGLCoverageLayerProps {
|
||||
points: CoveragePoint[];
|
||||
opacity: number;
|
||||
minRsrp: number;
|
||||
maxRsrp: number;
|
||||
visible: boolean;
|
||||
}
|
||||
|
||||
export default function WebGLCoverageLayer({
|
||||
points,
|
||||
opacity,
|
||||
minRsrp,
|
||||
maxRsrp,
|
||||
visible
|
||||
}: WebGLCoverageLayerProps) {
|
||||
const map = useMap();
|
||||
const canvasRef = useRef<HTMLCanvasElement | null>(null);
|
||||
const glRef = useRef<WebGLRenderingContext | null>(null);
|
||||
const programRef = useRef<WebGLProgram | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!visible || points.length === 0) return;
|
||||
|
||||
// Create canvas overlay
|
||||
const canvas = document.createElement('canvas');
|
||||
const container = map.getContainer();
|
||||
canvas.width = container.clientWidth;
|
||||
canvas.height = container.clientHeight;
|
||||
canvas.style.position = 'absolute';
|
||||
canvas.style.top = '0';
|
||||
canvas.style.left = '0';
|
||||
canvas.style.pointerEvents = 'none';
|
||||
canvas.style.zIndex = '400'; // Above tiles, below markers
|
||||
canvas.style.opacity = String(opacity);
|
||||
container.appendChild(canvas);
|
||||
canvasRef.current = canvas;
|
||||
|
||||
// Initialize WebGL
|
||||
const gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl');
|
||||
if (!gl) {
|
||||
console.error('WebGL not supported, falling back to canvas');
|
||||
return;
|
||||
}
|
||||
glRef.current = gl as WebGLRenderingContext;
|
||||
|
||||
// Setup shaders and render
|
||||
initShaders(gl as WebGLRenderingContext);
|
||||
render();
|
||||
|
||||
// Handle map move/zoom
|
||||
const onMove = () => render();
|
||||
map.on('move', onMove);
|
||||
map.on('zoom', onMove);
|
||||
map.on('resize', onResize);
|
||||
|
||||
return () => {
|
||||
map.off('move', onMove);
|
||||
map.off('zoom', onMove);
|
||||
map.off('resize', onResize);
|
||||
canvas.remove();
|
||||
};
|
||||
}, [points, visible, opacity, minRsrp, maxRsrp, map]);
|
||||
|
||||
// ... shader init and render functions
|
||||
}
|
||||
```
|
||||
|
||||
### Phase 2: WebGL Shaders
|
||||
|
||||
**Vertex Shader:**
|
||||
```glsl
|
||||
attribute vec2 a_position;
|
||||
varying vec2 v_texCoord;
|
||||
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0.0, 1.0);
|
||||
v_texCoord = (a_position + 1.0) / 2.0;
|
||||
}
|
||||
```
|
||||
|
||||
**Fragment Shader (Bilinear Interpolation):**
|
||||
```glsl
|
||||
precision mediump float;
|
||||
|
||||
uniform sampler2D u_coverageTexture;
|
||||
uniform vec2 u_resolution;
|
||||
uniform vec4 u_bounds; // minLat, minLon, maxLat, maxLon
|
||||
uniform float u_minRsrp;
|
||||
uniform float u_maxRsrp;
|
||||
|
||||
varying vec2 v_texCoord;
|
||||
|
||||
// RSRP to color gradient (matches existing palette)
|
||||
vec3 rsrpToColor(float rsrp) {
|
||||
float t = clamp((rsrp - u_minRsrp) / (u_maxRsrp - u_minRsrp), 0.0, 1.0);
|
||||
|
||||
// Color stops: red -> orange -> yellow -> green -> cyan -> blue
|
||||
// Reversed: strong signal = green/cyan, weak = red/orange
|
||||
if (t < 0.2) {
|
||||
return mix(vec3(0.5, 0.0, 0.0), vec3(1.0, 0.0, 0.0), t / 0.2); // maroon -> red
|
||||
} else if (t < 0.4) {
|
||||
return mix(vec3(1.0, 0.0, 0.0), vec3(1.0, 0.5, 0.0), (t - 0.2) / 0.2); // red -> orange
|
||||
} else if (t < 0.6) {
|
||||
return mix(vec3(1.0, 0.5, 0.0), vec3(1.0, 1.0, 0.0), (t - 0.4) / 0.2); // orange -> yellow
|
||||
} else if (t < 0.8) {
|
||||
return mix(vec3(1.0, 1.0, 0.0), vec3(0.0, 1.0, 0.0), (t - 0.6) / 0.2); // yellow -> green
|
||||
} else {
|
||||
return mix(vec3(0.0, 1.0, 0.0), vec3(0.0, 1.0, 1.0), (t - 0.8) / 0.2); // green -> cyan
|
||||
}
|
||||
}
|
||||
|
||||
void main() {
|
||||
// Convert screen coords to geographic coords
|
||||
vec2 geoCoord = mix(u_bounds.xy, u_bounds.zw, v_texCoord);
|
||||
|
||||
// Sample coverage texture (contains RSRP values encoded as colors)
|
||||
vec4 sample = texture2D(u_coverageTexture, v_texCoord);
|
||||
|
||||
// Decode RSRP from texture (R channel = normalized RSRP)
|
||||
float rsrp = mix(u_minRsrp, u_maxRsrp, sample.r);
|
||||
|
||||
// Skip if no coverage (alpha = 0)
|
||||
if (sample.a < 0.1) {
|
||||
discard;
|
||||
}
|
||||
|
||||
vec3 color = rsrpToColor(rsrp);
|
||||
gl_FragColor = vec4(color, sample.a);
|
||||
}
|
||||
```
|
||||
|
||||
### Phase 3: Coverage Data → Texture
|
||||
|
||||
Convert coverage points array to a WebGL texture for GPU sampling:
|
||||
|
||||
```typescript
|
||||
function createCoverageTexture(
|
||||
gl: WebGLRenderingContext,
|
||||
points: CoveragePoint[],
|
||||
bounds: L.LatLngBounds,
|
||||
textureSize: number = 512
|
||||
): WebGLTexture {
|
||||
// Create a grid texture from sparse points
|
||||
const data = new Uint8Array(textureSize * textureSize * 4);
|
||||
|
||||
const minLat = bounds.getSouth();
|
||||
const maxLat = bounds.getNorth();
|
||||
const minLon = bounds.getWest();
|
||||
const maxLon = bounds.getEast();
|
||||
|
||||
// For each texture pixel, find nearest coverage point and interpolate
|
||||
for (let y = 0; y < textureSize; y++) {
|
||||
for (let x = 0; x < textureSize; x++) {
|
||||
const lat = minLat + (maxLat - minLat) * (y / textureSize);
|
||||
const lon = minLon + (maxLon - minLon) * (x / textureSize);
|
||||
|
||||
// Find nearest points and interpolate (IDW - Inverse Distance Weighting)
|
||||
const { value, weight } = interpolateIDW(points, lat, lon, 4);
|
||||
|
||||
const idx = (y * textureSize + x) * 4;
|
||||
if (weight > 0) {
|
||||
// Encode normalized RSRP in R channel, weight in A channel
|
||||
const normalized = (value - minRsrp) / (maxRsrp - minRsrp);
|
||||
data[idx] = Math.floor(normalized * 255); // R = RSRP
|
||||
data[idx + 1] = 0; // G = unused
|
||||
data[idx + 2] = 0; // B = unused
|
||||
data[idx + 3] = Math.floor(Math.min(weight, 1) * 255); // A = coverage mask
|
||||
} else {
|
||||
data[idx + 3] = 0; // No coverage
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const texture = gl.createTexture();
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, textureSize, textureSize, 0, gl.RGBA, gl.UNSIGNED_BYTE, data);
|
||||
|
||||
// Enable bilinear filtering for smooth interpolation
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
|
||||
return texture!;
|
||||
}
|
||||
|
||||
// Inverse Distance Weighting interpolation
|
||||
function interpolateIDW(
|
||||
points: CoveragePoint[],
|
||||
lat: number,
|
||||
lon: number,
|
||||
k: number = 4,
|
||||
power: number = 2
|
||||
): { value: number; weight: number } {
|
||||
// Find k nearest points
|
||||
const distances = points.map((p, i) => ({
|
||||
index: i,
|
||||
dist: Math.sqrt(Math.pow(p.lat - lat, 2) + Math.pow(p.lon - lon, 2))
|
||||
}));
|
||||
|
||||
distances.sort((a, b) => a.dist - b.dist);
|
||||
const nearest = distances.slice(0, k);
|
||||
|
||||
// If very close to a point, use its value directly
|
||||
if (nearest[0].dist < 0.0001) {
|
||||
return { value: points[nearest[0].index].rsrp, weight: 1 };
|
||||
}
|
||||
|
||||
// IDW formula: weighted average where weight = 1 / distance^power
|
||||
let sumWeights = 0;
|
||||
let sumValues = 0;
|
||||
|
||||
for (const n of nearest) {
|
||||
const w = 1 / Math.pow(n.dist, power);
|
||||
sumWeights += w;
|
||||
sumValues += w * points[n.index].rsrp;
|
||||
}
|
||||
|
||||
// Limit interpolation range (don't extrapolate too far from data)
|
||||
const maxDist = nearest[nearest.length - 1].dist;
|
||||
const coverage = maxDist < 0.01 ? 1 : Math.max(0, 1 - maxDist * 50);
|
||||
|
||||
return {
|
||||
value: sumValues / sumWeights,
|
||||
weight: coverage
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
### Phase 4: Integration with Existing Code
|
||||
|
||||
**Modify:** `frontend/src/components/map/MapView.tsx`
|
||||
|
||||
Add toggle between old canvas layer and new WebGL layer:
|
||||
|
||||
```typescript
|
||||
import WebGLCoverageLayer from './WebGLCoverageLayer';
|
||||
|
||||
// In MapView component:
|
||||
const [useWebGL, setUseWebGL] = useState(true);
|
||||
|
||||
// In render:
|
||||
{useWebGL ? (
|
||||
<WebGLCoverageLayer
|
||||
points={coveragePoints}
|
||||
opacity={heatmapOpacity}
|
||||
minRsrp={-130}
|
||||
maxRsrp={-50}
|
||||
visible={showCoverage}
|
||||
/>
|
||||
) : (
|
||||
<GeographicHeatmap ... /> // Existing canvas implementation
|
||||
)}
|
||||
```
|
||||
|
||||
**Add setting:** `frontend/src/components/panels/SettingsPanel.tsx`
|
||||
|
||||
```typescript
|
||||
<div className="flex items-center justify-between">
|
||||
<span>Smooth Coverage (WebGL)</span>
|
||||
<Toggle
|
||||
checked={useWebGL}
|
||||
onChange={setUseWebGL}
|
||||
/>
|
||||
</div>
|
||||
```
|
||||
|
||||
### Phase 5: Performance Optimizations
|
||||
|
||||
1. **Texture Caching:** Only regenerate texture when coverage data changes
|
||||
2. **Resolution Scaling:** Use smaller texture on zoom out, larger on zoom in
|
||||
3. **Frustum Culling:** Don't render points outside visible bounds
|
||||
4. **Web Worker:** Move IDW interpolation to background thread
|
||||
|
||||
```typescript
|
||||
// Memoize texture generation
|
||||
const coverageTexture = useMemo(() => {
|
||||
if (!gl || points.length === 0) return null;
|
||||
return createCoverageTexture(gl, points, bounds, textureSize);
|
||||
}, [points, bounds, textureSize]);
|
||||
|
||||
// Dynamic texture size based on zoom
|
||||
const textureSize = useMemo(() => {
|
||||
const zoom = map.getZoom();
|
||||
if (zoom < 10) return 256;
|
||||
if (zoom < 14) return 512;
|
||||
return 1024;
|
||||
}, [map.getZoom()]);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Files to Create/Modify
|
||||
|
||||
| File | Action | Description |
|
||||
|------|--------|-------------|
|
||||
| `frontend/src/components/map/WebGLCoverageLayer.tsx` | CREATE | New WebGL rendering component |
|
||||
| `frontend/src/components/map/shaders/coverage.vert` | CREATE | Vertex shader (optional, can inline) |
|
||||
| `frontend/src/components/map/shaders/coverage.frag` | CREATE | Fragment shader (optional, can inline) |
|
||||
| `frontend/src/components/map/MapView.tsx` | MODIFY | Add WebGL layer toggle |
|
||||
| `frontend/src/store/settings.ts` | MODIFY | Add useWebGL setting |
|
||||
| `frontend/src/components/panels/CoverageSettingsPanel.tsx` | MODIFY | Add WebGL toggle UI |
|
||||
|
||||
---
|
||||
|
||||
## Testing Checklist
|
||||
|
||||
### Visual Quality
|
||||
- [ ] No visible grid squares at any zoom level
|
||||
- [ ] Smooth color gradients between coverage points
|
||||
- [ ] Coverage boundary is smooth, not jagged
|
||||
- [ ] Colors match existing palette (weak = red, strong = cyan/green)
|
||||
- [ ] Opacity control works correctly
|
||||
|
||||
### Performance
|
||||
- [ ] 60 FPS during map pan/zoom
|
||||
- [ ] Initial render < 500ms for 6000 points
|
||||
- [ ] Memory usage reasonable (< 100MB for large coverage)
|
||||
- [ ] No GPU memory leaks on repeated calculations
|
||||
|
||||
### Compatibility
|
||||
- [ ] Works on systems without dedicated GPU (falls back gracefully)
|
||||
- [ ] Works in Chrome, Firefox, Edge
|
||||
- [ ] Works on both high-DPI and standard displays
|
||||
|
||||
### Integration
|
||||
- [ ] Toggle between WebGL and canvas modes works
|
||||
- [ ] Coverage data updates correctly after recalculation
|
||||
- [ ] Settings persist across sessions
|
||||
- [ ] No console errors or warnings
|
||||
|
||||
---
|
||||
|
||||
## Fallback Strategy
|
||||
|
||||
If WebGL fails to initialize:
|
||||
1. Log warning to console
|
||||
2. Fall back to existing canvas implementation
|
||||
3. Show toast notification to user
|
||||
|
||||
```typescript
|
||||
const gl = canvas.getContext('webgl');
|
||||
if (!gl) {
|
||||
console.warn('WebGL not available, using canvas fallback');
|
||||
setUseWebGL(false);
|
||||
toast.warning('WebGL not supported, using standard rendering');
|
||||
return;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Success Criteria
|
||||
|
||||
1. **Visual:** Coverage looks like CloudRF/professional tools — smooth gradients, no grid
|
||||
2. **Performance:** Same or better than current canvas implementation
|
||||
3. **Reliability:** Graceful fallback if WebGL unavailable
|
||||
4. **UX:** User can toggle between modes in settings
|
||||
|
||||
---
|
||||
|
||||
## Additional Notes
|
||||
|
||||
### Color Gradient Reference
|
||||
|
||||
Current RSRP color mapping (from `colorGradient.ts`):
|
||||
```
|
||||
-130 dBm → Maroon (no service)
|
||||
-110 dBm → Red (very weak)
|
||||
-100 dBm → Orange (weak)
|
||||
-85 dBm → Yellow (fair)
|
||||
-70 dBm → Green (good)
|
||||
-50 dBm → Cyan (excellent)
|
||||
```
|
||||
|
||||
### Coordinate Systems
|
||||
|
||||
- **Geographic:** Latitude/Longitude (EPSG:4326)
|
||||
- **Screen:** Pixels from top-left
|
||||
- **WebGL:** Normalized device coordinates (-1 to 1)
|
||||
- **Texture:** UV coordinates (0 to 1)
|
||||
|
||||
All conversions must account for Web Mercator projection distortion.
|
||||
|
||||
---
|
||||
|
||||
## References
|
||||
|
||||
- WebGL Fundamentals: https://webglfundamentals.org/
|
||||
- Leaflet Custom Layers: https://leafletjs.com/examples/extending/extending-2-layers.html
|
||||
- IDW Interpolation: https://en.wikipedia.org/wiki/Inverse_distance_weighting
|
||||
- CloudRF visualization: https://cloudrf.com (for visual reference)
|
||||
|
||||
---
|
||||
|
||||
## Commit Message
|
||||
|
||||
```
|
||||
feat(coverage): WebGL smooth interpolation rendering
|
||||
|
||||
- Add WebGLCoverageLayer with GPU-accelerated rendering
|
||||
- Implement IDW interpolation for smooth gradients
|
||||
- Add toggle between WebGL and canvas modes
|
||||
- Graceful fallback for systems without WebGL support
|
||||
|
||||
Closes #coverage-interpolation
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
**Ready for Implementation!**
|
||||
|
||||
220
docs/devlog/gpu_supp/RFCP-Roadmap-Updated-2026-02-04.md
Normal file
220
docs/devlog/gpu_supp/RFCP-Roadmap-Updated-2026-02-04.md
Normal file
@@ -0,0 +1,220 @@
|
||||
# RFCP Project Roadmap — Updated February 4, 2026
|
||||
|
||||
**Project:** RFCP (RF Coverage Planning) for UMTC
|
||||
**Developer:** Олег + Claude
|
||||
**Started:** January 30, 2025
|
||||
**Current Version:** 3.8.0 (GPU Acceleration Complete)
|
||||
|
||||
---
|
||||
|
||||
## ✅ Completed Milestones
|
||||
|
||||
### Phase 1: Frontend (January 2025)
|
||||
- ✅ React + TypeScript + Vite + Leaflet
|
||||
- ✅ Multi-site RF coverage planning
|
||||
- ✅ Multi-sector sites (Alpha/Beta/Gamma)
|
||||
- ✅ Geographic-scale canvas heatmap
|
||||
- ✅ Keyboard shortcuts + delete confirmation
|
||||
- ✅ NumberInput components with sliders
|
||||
- ✅ TypeScript strict mode, ESLint clean
|
||||
- ✅ Production build: 536KB / 163KB gzipped
|
||||
|
||||
### Phase 2: Backend Architecture (February 1, 2025)
|
||||
- ✅ Python FastAPI + NumPy + ProcessPoolExecutor
|
||||
- ✅ 8 propagation models (FreeSpace, Okumura-Hata, COST-231, ITU-R P.1546, etc.)
|
||||
- ✅ Modular geometry engine (haversine, intersection, reflection, diffraction, LOS)
|
||||
- ✅ SharedMemoryManager for terrain data (zero-copy, 25 MB)
|
||||
- ✅ Building filtering (351k → 27k bbox → 15k cap)
|
||||
- ✅ Overpass API with retry + mirror failover
|
||||
- ✅ WebSocket progress streaming
|
||||
|
||||
### Phase 3: Performance (February 2-3, 2025)
|
||||
- ✅ LOD (Level of Detail) optimization
|
||||
- ✅ Spatial indexing for buildings (R-tree)
|
||||
- ✅ Dominant path simplification for distant points
|
||||
- ✅ OOM fix + memory management
|
||||
- ✅ CloudRF-style color gradient
|
||||
- ✅ Results popup + session history
|
||||
- ✅ Terrain profile viewer
|
||||
|
||||
### Phase 4: GPU Acceleration (February 3-4, 2025) ⭐
|
||||
- ✅ CuPy + CUDA backend (RTX 4060)
|
||||
- ✅ CUDA Toolkit 13.1 + cupy-cuda13x setup
|
||||
- ✅ Phase 2.5: Vectorized distances + path_loss (0.006s)
|
||||
- ✅ Phase 2.6: Vectorized terrain LOS + diffraction (0.04s)
|
||||
- ✅ Phase 2.7: Vectorized antenna pattern loss
|
||||
- ✅ Vegetation bbox pre-filter (100x+ speedup)
|
||||
- ✅ Worker process isolation (no CUDA in workers)
|
||||
- ✅ PyInstaller ONEDIR GPU build (1.2 GB installer)
|
||||
- ✅ **Full preset: 195s → 11.2s (17.4x speedup)**
|
||||
|
||||
### Supporting Work
|
||||
- ✅ RF Radio Theory wiki article (comprehensive)
|
||||
- ✅ Propagation model research (CloudRF, SPLAT!, Signal Server)
|
||||
- ✅ RFCP Method collaboration framework documented
|
||||
|
||||
---
|
||||
|
||||
## 📊 Current Performance
|
||||
|
||||
| Preset | Points | Resolution | Time (cached) | Time (cold) |
|
||||
|--------|--------|-----------|---------------|-------------|
|
||||
| Standard | 1,975 | 200m | **2.3s** | ~12s |
|
||||
| Full | 6,640 | 50m | **11.2s** | ~20s |
|
||||
| 50km radius | 4,966 | adaptive | ~410s | ~420s |
|
||||
|
||||
**Hardware:** Windows 11, RTX 4060 Laptop GPU, 6-core CPU
|
||||
|
||||
---
|
||||
|
||||
## 🔜 Next: Phase 5 — Data & Accuracy
|
||||
|
||||
### 5.1 SRTM Terrain Integration
|
||||
**Priority:** HIGH
|
||||
**Status:** Not started
|
||||
|
||||
Current terrain: Single HGT tile download per calculation
|
||||
Target: Pre-cached SRTM/ASTER DEM tiles with proper interpolation
|
||||
|
||||
- [ ] SRTM tile manager (auto-download, cache)
|
||||
- [ ] Bilinear interpolation for elevation sampling
|
||||
- [ ] Multi-tile coverage for large radius
|
||||
- [ ] Terrain profile accuracy validation
|
||||
- [ ] Compare with current terrain data quality
|
||||
|
||||
### 5.2 Project Persistence
|
||||
**Priority:** MEDIUM
|
||||
|
||||
- [ ] Save/load projects (JSON or SQLite)
|
||||
- [ ] Site configurations persistence
|
||||
- [ ] Coverage results caching
|
||||
- [ ] Session history persistence across restarts
|
||||
- [ ] Export coverage report (PDF/PNG)
|
||||
|
||||
### 5.3 Accuracy Validation
|
||||
**Priority:** MEDIUM
|
||||
|
||||
- [ ] Compare with known coverage maps
|
||||
- [ ] Field measurements with real equipment
|
||||
- [ ] Calibrate propagation models per environment
|
||||
- [ ] Antenna pattern library (real equipment specs)
|
||||
|
||||
---
|
||||
|
||||
## 🔮 Future Phases
|
||||
|
||||
### Phase 6: Multi-Station & Dashboard
|
||||
- [ ] Multi-station view (aggregate coverage)
|
||||
- [ ] Station discovery via WireGuard mesh
|
||||
- [ ] Coverage gap analysis
|
||||
- [ ] Interference modeling between stations
|
||||
- [ ] Handover zone visualization
|
||||
|
||||
### Phase 7: Hardware Integration
|
||||
- [ ] LimeSDR Mini 2.0 testing
|
||||
- [ ] Real RF attach validation
|
||||
- [ ] sysmoISIM-SJA2 SIM integration
|
||||
- [ ] ZTE B8200 base station testing
|
||||
- [ ] INFOZAHYST Plastun SDR (if accessible)
|
||||
|
||||
### Phase 8: Advanced Features
|
||||
- [ ] 3D visualization mode
|
||||
- [ ] Link budget analysis view
|
||||
- [ ] Frequency planning tool
|
||||
- [ ] Indoor coverage modeling
|
||||
- [ ] Time-series analysis (seasonal vegetation)
|
||||
- [ ] Offline mode (embedded terrain DB)
|
||||
|
||||
### Phase 9: Distribution
|
||||
- [ ] Auto-updater (electron-updater)
|
||||
- [ ] Live USB distribution for field deployment
|
||||
- [ ] Standalone offline package
|
||||
- [ ] User documentation / help system
|
||||
|
||||
---
|
||||
|
||||
## 🏛️ Architecture Overview
|
||||
|
||||
```
|
||||
RFCP Application (Electron)
|
||||
├── Frontend (React + TypeScript + Vite)
|
||||
│ ├── Leaflet map with custom canvas heatmap
|
||||
│ ├── Zustand state management
|
||||
│ └── WebSocket for progress streaming
|
||||
│
|
||||
├── Backend (Python FastAPI)
|
||||
│ ├── Coverage Engine
|
||||
│ │ ├── Grid generator (adaptive zones)
|
||||
│ │ ├── GPU pipeline (CuPy/CUDA) — main process
|
||||
│ │ │ ├── Phase 2.5: distances + path_loss
|
||||
│ │ │ ├── Phase 2.6: terrain LOS + diffraction
|
||||
│ │ │ └── Phase 2.7: antenna pattern
|
||||
│ │ └── CPU workers (ProcessPool) — 3-6 workers
|
||||
│ │ ├── Building obstruction (spatial index)
|
||||
│ │ ├── Reflections (ray-building intersection)
|
||||
│ │ └── Vegetation loss (bbox pre-filter)
|
||||
│ │
|
||||
│ ├── Propagation Models (8 models)
|
||||
│ │ ├── Free-Space Path Loss
|
||||
│ │ ├── Okumura-Hata (150-1500 MHz)
|
||||
│ │ ├── COST-231-Hata (1500-2000 MHz)
|
||||
│ │ ├── ITU-R P.1546
|
||||
│ │ └── ... 4 more
|
||||
│ │
|
||||
│ ├── OSM Services
|
||||
│ │ ├── Buildings (Overpass API + cache)
|
||||
│ │ ├── Vegetation (bbox pre-filter)
|
||||
│ │ ├── Water bodies
|
||||
│ │ └── Streets
|
||||
│ │
|
||||
│ └── Terrain Service
|
||||
│ ├── HGT tile download + cache
|
||||
│ ├── Elevation sampling
|
||||
│ └── Line-of-sight checking
|
||||
│
|
||||
└── Desktop (Electron)
|
||||
├── Backend process management
|
||||
└── NSIS installer (1.2 GB with CUDA)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📈 Development Timeline
|
||||
|
||||
```
|
||||
Jan 30, 2025 Phase 1: Frontend complete (10 iterations)
|
||||
Feb 01, 2025 Phase 2: Backend architecture (48 files, 82 tests)
|
||||
Feb 02, 2025 Phase 3: LOD + performance optimization
|
||||
Feb 03, 2025 Phase 3.5-3.6: GPU setup + CUDA build
|
||||
Feb 04, 2025 Phase 3.7-3.8: GPU vectorization complete ⭐
|
||||
─────────────────────────────────────────
|
||||
Full preset: 195s → 11.2s (17.4x speedup)
|
||||
Standard: 38s → 2.3s (16.5x speedup)
|
||||
```
|
||||
|
||||
**Total development time:** ~5 days intensive
|
||||
**Total iterations:** 3.8.0 (20+ sub-iterations)
|
||||
**Architecture:** Battle-tested, production-ready
|
||||
|
||||
---
|
||||
|
||||
## 🧰 Tech Stack
|
||||
|
||||
| Component | Technology | Version |
|
||||
|-----------|-----------|---------|
|
||||
| Frontend | React + TypeScript | 18 |
|
||||
| Build | Vite | 5.x |
|
||||
| Map | Leaflet | 1.9 |
|
||||
| State | Zustand | 4.x |
|
||||
| Backend | Python FastAPI | 3.12 |
|
||||
| GPU | CuPy + CUDA | 13.x |
|
||||
| Parallel | ProcessPoolExecutor | stdlib |
|
||||
| Terrain | NumPy (HGT tiles) | 1.26 |
|
||||
| Desktop | Electron | 28.x |
|
||||
| Installer | NSIS (via electron-builder) | - |
|
||||
| Build (BE) | PyInstaller | 6.x |
|
||||
|
||||
---
|
||||
|
||||
*"11.2 seconds. Full preset. 6,640 points. GPU acceleration complete."*
|
||||
*— February 4, 2026*
|
||||
345
docs/devlog/gpu_supp/RFCP-WebGL-Radial-Gradients-Task.md
Normal file
345
docs/devlog/gpu_supp/RFCP-WebGL-Radial-Gradients-Task.md
Normal file
@@ -0,0 +1,345 @@
|
||||
# RFCP: WebGL Radial Gradients Coverage Layer
|
||||
|
||||
## Мета
|
||||
|
||||
Переробити WebGL coverage layer з texture-based підходу на **radial gradients** — як працює Canvas GeographicHeatmap, але на GPU.
|
||||
|
||||
## Чому radial gradients краще для візуалізації
|
||||
|
||||
**Texture-based (поточний):**
|
||||
- Кожна точка = 1 pixel в grid
|
||||
- Nearest neighbor fill → blocky квадрати
|
||||
- Навіть з smoothstep — видно grid структуру
|
||||
- ✅ Добре для: terrain detail, точні значення
|
||||
- ❌ Погано для: красива візуалізація
|
||||
|
||||
**Radial gradients (Canvas heatmap):**
|
||||
- Кожна точка = круг з radial falloff
|
||||
- Smooth blending між точками
|
||||
- Природній вигляд coverage
|
||||
- ✅ Добре для: красива візуалізація, презентації
|
||||
- ❌ Погано для: точні значення (blending спотворює)
|
||||
|
||||
## Архітектура WebGL Radial Gradients
|
||||
|
||||
### Підхід: Multi-pass additive blending
|
||||
|
||||
```
|
||||
Pass 1-N: Для кожної точки (або batch точок)
|
||||
├── Малюємо full-screen quad
|
||||
├── Fragment shader: radial falloff від центру точки
|
||||
├── Output: (weight * value, weight, 0, 1)
|
||||
└── Blending: GL_ONE, GL_ONE (additive)
|
||||
|
||||
Final Pass:
|
||||
├── Читаємо accumulated texture
|
||||
├── Normalize: value = R / G (weighted average)
|
||||
└── Apply colormap
|
||||
```
|
||||
|
||||
### Альтернатива: Single-pass з texture atlas
|
||||
|
||||
Замість N проходів, закодувати всі точки в texture і в одному fragment shader пройтись по всіх:
|
||||
|
||||
```glsl
|
||||
// Fragment shader
|
||||
uniform sampler2D u_points; // texture з точками: (lat, lon, rsrp, radius)
|
||||
uniform int u_pointCount;
|
||||
|
||||
void main() {
|
||||
vec2 worldPos = getWorldPosition(v_uv);
|
||||
|
||||
float totalWeight = 0.0;
|
||||
float totalValue = 0.0;
|
||||
|
||||
for (int i = 0; i < MAX_POINTS; i++) {
|
||||
if (i >= u_pointCount) break;
|
||||
|
||||
vec4 point = texelFetch(u_points, ivec2(i, 0), 0);
|
||||
vec2 pointPos = point.xy;
|
||||
float rsrp = point.z;
|
||||
float radius = point.w;
|
||||
|
||||
float dist = distance(worldPos, pointPos);
|
||||
float weight = smoothstep(radius, 0.0, dist);
|
||||
|
||||
totalWeight += weight;
|
||||
totalValue += weight * rsrp;
|
||||
}
|
||||
|
||||
if (totalWeight < 0.001) discard;
|
||||
|
||||
float avgRsrp = totalValue / totalWeight;
|
||||
vec3 color = rsrpToColor(avgRsrp);
|
||||
|
||||
gl_FragColor = vec4(color, smoothstep(0.0, 0.1, totalWeight));
|
||||
}
|
||||
```
|
||||
|
||||
**Проблема:** Loop по 6,675 точках в кожному fragment = дуже повільно.
|
||||
|
||||
### Рекомендований підхід: Batched additive blending
|
||||
|
||||
```
|
||||
1. Створити offscreen framebuffer (float texture)
|
||||
2. Для кожної точки (або batch по 100-500):
|
||||
- Малювати quad розміром з radius точки
|
||||
- Additive blend: (weight * rsrp, weight)
|
||||
3. Final pass: normalize + colormap
|
||||
```
|
||||
|
||||
Це як Mapbox heatmap працює.
|
||||
|
||||
---
|
||||
|
||||
## Імплементація
|
||||
|
||||
### Крок 1: Створити offscreen framebuffer
|
||||
|
||||
```typescript
|
||||
// Accumulation texture (RG float for weighted sum)
|
||||
const accumTexture = gl.createTexture();
|
||||
gl.bindTexture(gl.TEXTURE_2D, accumTexture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RG32F, width, height, 0, gl.RG, gl.FLOAT, null);
|
||||
|
||||
const framebuffer = gl.createFramebuffer();
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
|
||||
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, accumTexture, 0);
|
||||
```
|
||||
|
||||
**Примітка:** Потрібен `EXT_color_buffer_float` extension для float framebuffer.
|
||||
|
||||
### Крок 2: Point rendering shader
|
||||
|
||||
**Vertex shader:**
|
||||
```glsl
|
||||
attribute vec2 a_position; // quad vertices
|
||||
attribute vec2 a_pointCenter; // point lat/lon (instanced)
|
||||
attribute float a_pointRsrp; // point RSRP (instanced)
|
||||
attribute float a_pointRadius; // point radius in pixels (instanced)
|
||||
|
||||
uniform mat4 u_matrix; // world to clip transform
|
||||
|
||||
varying vec2 v_localPos; // position relative to point center
|
||||
varying float v_rsrp;
|
||||
|
||||
void main() {
|
||||
// Expand quad around point center
|
||||
vec2 worldPos = a_pointCenter + a_position * a_pointRadius;
|
||||
gl_Position = u_matrix * vec4(worldPos, 0.0, 1.0);
|
||||
|
||||
v_localPos = a_position; // -1 to 1
|
||||
v_rsrp = a_pointRsrp;
|
||||
}
|
||||
```
|
||||
|
||||
**Fragment shader:**
|
||||
```glsl
|
||||
precision highp float;
|
||||
|
||||
varying vec2 v_localPos;
|
||||
varying float v_rsrp;
|
||||
|
||||
void main() {
|
||||
// Radial distance from center (0 at center, 1 at edge)
|
||||
float dist = length(v_localPos);
|
||||
|
||||
// Discard outside circle
|
||||
if (dist > 1.0) discard;
|
||||
|
||||
// Radial falloff (smooth at edges)
|
||||
float weight = 1.0 - smoothstep(0.0, 1.0, dist);
|
||||
// Or gaussian: weight = exp(-dist * dist * 2.0);
|
||||
|
||||
// Output: (weight * normalized_rsrp, weight)
|
||||
float normalizedRsrp = (v_rsrp + 130.0) / 80.0; // -130 to -50 → 0 to 1
|
||||
gl_FragColor = vec4(weight * normalizedRsrp, weight, 0.0, 1.0);
|
||||
}
|
||||
```
|
||||
|
||||
### Крок 3: Final compositing shader
|
||||
|
||||
```glsl
|
||||
precision highp float;
|
||||
|
||||
uniform sampler2D u_accumTexture;
|
||||
varying vec2 v_uv;
|
||||
|
||||
vec3 rsrpToColor(float t) {
|
||||
// t: 0 = weak (red), 1 = strong (cyan)
|
||||
if (t < 0.25) return mix(vec3(1.0, 0.0, 0.0), vec3(1.0, 0.5, 0.0), t / 0.25);
|
||||
if (t < 0.5) return mix(vec3(1.0, 0.5, 0.0), vec3(1.0, 1.0, 0.0), (t - 0.25) / 0.25);
|
||||
if (t < 0.75) return mix(vec3(1.0, 1.0, 0.0), vec3(0.0, 1.0, 0.0), (t - 0.5) / 0.25);
|
||||
return mix(vec3(0.0, 1.0, 0.0), vec3(0.0, 1.0, 1.0), (t - 0.75) / 0.25);
|
||||
}
|
||||
|
||||
void main() {
|
||||
vec2 accum = texture2D(u_accumTexture, v_uv).rg;
|
||||
|
||||
float totalValue = accum.r;
|
||||
float totalWeight = accum.g;
|
||||
|
||||
// No coverage
|
||||
if (totalWeight < 0.001) discard;
|
||||
|
||||
// Weighted average RSRP
|
||||
float avgRsrp = totalValue / totalWeight;
|
||||
|
||||
// Color mapping
|
||||
vec3 color = rsrpToColor(avgRsrp);
|
||||
|
||||
// Alpha based on weight (fade at edges)
|
||||
float alpha = smoothstep(0.0, 0.1, totalWeight) * 0.85;
|
||||
|
||||
gl_FragColor = vec4(color, alpha);
|
||||
}
|
||||
```
|
||||
|
||||
### Крок 4: Rendering loop
|
||||
|
||||
```typescript
|
||||
function render() {
|
||||
const canvas = canvasRef.current;
|
||||
const gl = glRef.current;
|
||||
|
||||
// 1. Position canvas over map
|
||||
const nw = map.latLngToLayerPoint([bounds.maxLat, bounds.minLon]);
|
||||
const se = map.latLngToLayerPoint([bounds.minLat, bounds.maxLon]);
|
||||
canvas.style.transform = `translate(${nw.x}px, ${nw.y}px)`;
|
||||
canvas.style.width = `${se.x - nw.x}px`;
|
||||
canvas.style.height = `${se.y - nw.y}px`;
|
||||
|
||||
// 2. Clear accumulation buffer
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, accumFramebuffer);
|
||||
gl.clearColor(0, 0, 0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
// 3. Render points with additive blending
|
||||
gl.useProgram(pointProgram);
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.ONE, gl.ONE); // Additive
|
||||
|
||||
// Set uniforms (matrix, etc.)
|
||||
const matrix = calculateWorldToClipMatrix(bounds, canvas.width, canvas.height);
|
||||
gl.uniformMatrix4fv(u_matrix, false, matrix);
|
||||
|
||||
// Draw all points (instanced if supported, or batched)
|
||||
drawPoints(gl, points);
|
||||
|
||||
// 4. Final composite pass
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
||||
gl.useProgram(compositeProgram);
|
||||
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); // Normal blend
|
||||
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, accumTexture);
|
||||
|
||||
drawFullscreenQuad(gl);
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Оптимізації
|
||||
|
||||
### 1. Instanced rendering (якщо підтримується)
|
||||
|
||||
```typescript
|
||||
const ext = gl.getExtension('ANGLE_instanced_arrays');
|
||||
if (ext) {
|
||||
// Use instanced rendering - draw all points in one call
|
||||
ext.drawArraysInstancedANGLE(gl.TRIANGLE_STRIP, 0, 4, points.length);
|
||||
}
|
||||
```
|
||||
|
||||
### 2. Spatial culling
|
||||
|
||||
Малювати тільки точки що потрапляють у viewport:
|
||||
|
||||
```typescript
|
||||
const visiblePoints = points.filter(p => {
|
||||
const screenPos = map.latLngToContainerPoint([p.lat, p.lon]);
|
||||
return screenPos.x > -radius && screenPos.x < canvas.width + radius &&
|
||||
screenPos.y > -radius && screenPos.y < canvas.height + radius;
|
||||
});
|
||||
```
|
||||
|
||||
### 3. Dynamic radius based on zoom
|
||||
|
||||
```typescript
|
||||
const zoom = map.getZoom();
|
||||
const metersPerPixel = 40075016.686 * Math.cos(centerLat * Math.PI / 180) / Math.pow(2, zoom + 8);
|
||||
const radiusPixels = (settings.resolution * 1.5) / metersPerPixel;
|
||||
```
|
||||
|
||||
### 4. Resolution scaling
|
||||
|
||||
На низьких zoom рівнях, рендерити в менший framebuffer і upscale:
|
||||
|
||||
```typescript
|
||||
const scale = zoom < 10 ? 0.5 : zoom < 12 ? 0.75 : 1.0;
|
||||
const fbWidth = Math.round(canvas.width * scale);
|
||||
const fbHeight = Math.round(canvas.height * scale);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Порівняння з поточним texture-based
|
||||
|
||||
| Аспект | Texture-based | Radial gradients |
|
||||
|--------|---------------|------------------|
|
||||
| Візуалізація | Blocky | Smooth |
|
||||
| Terrain detail | Добре | Менш точно |
|
||||
| Performance | Швидко (1 draw call) | Повільніше (N points) |
|
||||
| Memory | Texture size | Framebuffer + points |
|
||||
| Код складність | Середня | Висока |
|
||||
|
||||
---
|
||||
|
||||
## Чеклист імплементації
|
||||
|
||||
### Phase 1: Basic setup
|
||||
- [ ] Створити новий файл `WebGLRadialCoverageLayer.tsx`
|
||||
- [ ] Setup WebGL context з float extensions
|
||||
- [ ] Створити accumulation framebuffer
|
||||
- [ ] Базовий vertex/fragment shader для точок
|
||||
|
||||
### Phase 2: Point rendering
|
||||
- [ ] Implement point quad rendering
|
||||
- [ ] Radial falloff function
|
||||
- [ ] Additive blending
|
||||
- [ ] Test з кількома точками
|
||||
|
||||
### Phase 3: Compositing
|
||||
- [ ] Final pass shader
|
||||
- [ ] Weighted average calculation
|
||||
- [ ] Color mapping
|
||||
- [ ] Alpha/transparency
|
||||
|
||||
### Phase 4: Integration
|
||||
- [ ] Map positioning (як в поточному WebGL layer)
|
||||
- [ ] Map event listeners (move/zoom)
|
||||
- [ ] Opacity control
|
||||
- [ ] Toggle в UI
|
||||
|
||||
### Phase 5: Optimization
|
||||
- [ ] Instanced rendering
|
||||
- [ ] Spatial culling
|
||||
- [ ] Dynamic radius
|
||||
- [ ] Resolution scaling
|
||||
|
||||
---
|
||||
|
||||
## Fallback
|
||||
|
||||
Якщо WebGL radial не працює (older GPU, missing extensions):
|
||||
- Fallback до Canvas GeographicHeatmap
|
||||
- Або до поточного texture-based WebGL
|
||||
|
||||
---
|
||||
|
||||
## Референси
|
||||
|
||||
1. [Mapbox GL Heatmap implementation](https://github.com/mapbox/mapbox-gl-js/blob/main/src/render/draw_heatmap.js)
|
||||
2. [deck.gl HeatmapLayer](https://deck.gl/docs/api-reference/aggregation-layers/heatmap-layer)
|
||||
3. [WebGL additive blending](https://webglfundamentals.org/webgl/lessons/webgl-text-texture.html)
|
||||
281
docs/devlog/gpu_supp/RFCP-WebGL-Smooth-Coverage-Task.md
Normal file
281
docs/devlog/gpu_supp/RFCP-WebGL-Smooth-Coverage-Task.md
Normal file
@@ -0,0 +1,281 @@
|
||||
# RFCP v3.10.5: WebGL Smooth Coverage Implementation
|
||||
|
||||
## Контекст проблеми
|
||||
|
||||
**Поточний стан:**
|
||||
- Backend повертає grid точок з lat/lon/RSRP (50m = 6,675 pts, 200m = 1,975 pts)
|
||||
- WebGL texture-based rendering: points → texture → GL_LINEAR → colormap
|
||||
- **Проблема:** Видимі grid squares/pixelation, особливо при zoom in або sparse grids (200m)
|
||||
|
||||
**Причина:**
|
||||
- `GL_LINEAR` дає тільки C0 continuity (значення співпадають на краях, але похідні — ні)
|
||||
- Це створює видимі "шви" між клітинками
|
||||
|
||||
## Рішення з ресерчу
|
||||
|
||||
### Ключовий інсайт
|
||||
|
||||
**Catmull-Rom spline interpolation** дає C1 continuity (smooth derivatives) І проходить через exact data values (на відміну від B-spline який blurs peaks).
|
||||
|
||||
**9-tap Catmull-Rom** замість `texture2D()`:
|
||||
- 9 texture fetches замість 1
|
||||
- ~0.32ms vs ~0.30ms на GTX 980 при 1920×1080
|
||||
- Для нашої ~80×85 текстури — практично безкоштовно
|
||||
|
||||
### Критичне правило
|
||||
|
||||
**Інтерполювати RAW RSRP values ПЕРЕД colormap!**
|
||||
- ❌ Неправильно: texture → colormap → interpolate (muddy colors)
|
||||
- ✅ Правильно: texture → interpolate → colormap (clean gradients)
|
||||
|
||||
---
|
||||
|
||||
## Етап 1: Quick Fix (30 хвилин)
|
||||
|
||||
### Smoothstep coordinate remapping
|
||||
|
||||
Найшвидший спосіб прибрати grid edges — одна зміна в shader:
|
||||
|
||||
```glsl
|
||||
// ЗАМІСТЬ:
|
||||
vec4 texColor = texture2D(u_texture, v_uv);
|
||||
|
||||
// ВИКОРИСТАТИ:
|
||||
vec4 textureSmooth(sampler2D tex, vec2 uv, vec2 texSize) {
|
||||
vec2 p = uv * texSize + 0.5;
|
||||
vec2 i = floor(p);
|
||||
vec2 f = p - i;
|
||||
f = f * f * f * (f * (f * 6.0 - 15.0) + 10.0); // quintic hermite
|
||||
return texture2D(tex, (i + f - 0.5) / texSize);
|
||||
}
|
||||
|
||||
// В main():
|
||||
vec4 texColor = textureSmooth(u_texture, v_uv, u_textureSize);
|
||||
```
|
||||
|
||||
**Що це дає:**
|
||||
- C2 continuity з одним texture read
|
||||
- Прибирає видимі grid edges
|
||||
- Мінімальний positional bias
|
||||
|
||||
**Потрібно додати uniform:**
|
||||
```javascript
|
||||
const textureSizeLocation = gl.getUniformLocation(program, 'u_textureSize');
|
||||
gl.uniform2f(textureSizeLocation, textureWidth, textureHeight);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Етап 2: Production Implementation (1-2 години)
|
||||
|
||||
### 9-tap Catmull-Rom Shader
|
||||
|
||||
```glsl
|
||||
precision highp float;
|
||||
|
||||
uniform sampler2D u_texture;
|
||||
uniform vec2 u_textureSize;
|
||||
uniform float u_opacity;
|
||||
varying vec2 v_uv;
|
||||
|
||||
// Catmull-Rom 9-tap interpolation
|
||||
// Source: TheRealMJP's gist (108 GitHub stars)
|
||||
vec4 SampleTextureCatmullRom(sampler2D tex, vec2 uv, vec2 texSize) {
|
||||
vec2 samplePos = uv * texSize;
|
||||
vec2 texPos1 = floor(samplePos - 0.5) + 0.5;
|
||||
vec2 f = samplePos - texPos1;
|
||||
|
||||
// Catmull-Rom weights
|
||||
vec2 w0 = f * (-0.5 + f * (1.0 - 0.5 * f));
|
||||
vec2 w1 = 1.0 + f * f * (-2.5 + 1.5 * f);
|
||||
vec2 w2 = f * (0.5 + f * (2.0 - 1.5 * f));
|
||||
vec2 w3 = f * f * (-0.5 + 0.5 * f);
|
||||
|
||||
// Combine weights for optimized sampling
|
||||
vec2 w12 = w1 + w2;
|
||||
vec2 offset12 = w2 / (w1 + w2);
|
||||
|
||||
// Compute texture coordinates
|
||||
vec2 texPos0 = (texPos1 - 1.0) / texSize;
|
||||
vec2 texPos3 = (texPos1 + 2.0) / texSize;
|
||||
vec2 texPos12 = (texPos1 + offset12) / texSize;
|
||||
|
||||
// 9 texture fetches (optimized from 16)
|
||||
vec4 result = vec4(0.0);
|
||||
result += texture2D(tex, vec2(texPos0.x, texPos0.y)) * w0.x * w0.y;
|
||||
result += texture2D(tex, vec2(texPos12.x, texPos0.y)) * w12.x * w0.y;
|
||||
result += texture2D(tex, vec2(texPos3.x, texPos0.y)) * w3.x * w0.y;
|
||||
result += texture2D(tex, vec2(texPos0.x, texPos12.y)) * w0.x * w12.y;
|
||||
result += texture2D(tex, vec2(texPos12.x, texPos12.y)) * w12.x * w12.y;
|
||||
result += texture2D(tex, vec2(texPos3.x, texPos12.y)) * w3.x * w12.y;
|
||||
result += texture2D(tex, vec2(texPos0.x, texPos3.y)) * w0.x * w3.y;
|
||||
result += texture2D(tex, vec2(texPos12.x, texPos3.y)) * w12.x * w3.y;
|
||||
result += texture2D(tex, vec2(texPos3.x, texPos3.y)) * w3.x * w3.y;
|
||||
return result;
|
||||
}
|
||||
|
||||
// RSRP to color mapping (cyan -> green -> yellow -> orange -> red)
|
||||
vec3 rsrpToColor(float rsrp) {
|
||||
// rsrp: normalized 0.0 (weak, -110dBm) to 1.0 (strong, -50dBm)
|
||||
|
||||
// Color stops: red -> orange -> yellow -> green -> cyan
|
||||
vec3 c0 = vec3(1.0, 0.0, 0.0); // red (weak)
|
||||
vec3 c1 = vec3(1.0, 0.5, 0.0); // orange
|
||||
vec3 c2 = vec3(1.0, 1.0, 0.0); // yellow
|
||||
vec3 c3 = vec3(0.0, 1.0, 0.0); // green
|
||||
vec3 c4 = vec3(0.0, 1.0, 1.0); // cyan (strong)
|
||||
|
||||
float t = clamp(rsrp, 0.0, 1.0);
|
||||
|
||||
if (t < 0.25) {
|
||||
return mix(c0, c1, t / 0.25);
|
||||
} else if (t < 0.5) {
|
||||
return mix(c1, c2, (t - 0.25) / 0.25);
|
||||
} else if (t < 0.75) {
|
||||
return mix(c2, c3, (t - 0.5) / 0.25);
|
||||
} else {
|
||||
return mix(c3, c4, (t - 0.75) / 0.25);
|
||||
}
|
||||
}
|
||||
|
||||
void main() {
|
||||
// 1. Sample with Catmull-Rom interpolation (RAW value)
|
||||
vec4 texColor = SampleTextureCatmullRom(u_texture, v_uv, u_textureSize);
|
||||
float rsrpNormalized = texColor.r;
|
||||
|
||||
// 2. Discard if no coverage (validity check)
|
||||
if (rsrpNormalized < 0.01) {
|
||||
discard;
|
||||
}
|
||||
|
||||
// 3. Apply colormap AFTER interpolation
|
||||
vec3 color = rsrpToColor(rsrpNormalized);
|
||||
|
||||
// 4. Smooth boundary fading (optional)
|
||||
float boundaryAlpha = smoothstep(0.01, 0.05, rsrpNormalized);
|
||||
|
||||
gl_FragColor = vec4(color, boundaryAlpha * u_opacity);
|
||||
}
|
||||
```
|
||||
|
||||
### JavaScript зміни
|
||||
|
||||
```javascript
|
||||
// 1. Vertex shader (без змін)
|
||||
const vertexShaderSource = `
|
||||
attribute vec2 a_position;
|
||||
attribute vec2 a_texCoord;
|
||||
varying vec2 v_uv;
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0.0, 1.0);
|
||||
v_uv = a_texCoord;
|
||||
}
|
||||
`;
|
||||
|
||||
// 2. При створенні texture — зберегти розміри
|
||||
const textureWidth = gridWidth;
|
||||
const textureHeight = gridHeight;
|
||||
|
||||
// 3. Передати uniform
|
||||
const textureSizeLocation = gl.getUniformLocation(program, 'u_textureSize');
|
||||
if (textureSizeLocation) {
|
||||
gl.uniform2f(textureSizeLocation, textureWidth, textureHeight);
|
||||
} else {
|
||||
console.error('[WebGL] u_textureSize uniform NOT FOUND!');
|
||||
}
|
||||
|
||||
// 4. Texture filtering — можна залишити LINEAR для fallback
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Етап 3: Texture Data Format
|
||||
|
||||
### Поточний формат (перевірити)
|
||||
|
||||
```javascript
|
||||
// Normalized RSRP value (0-255 mapped to 0.0-1.0 in shader)
|
||||
const normalized = (rsrp - minRsrp) / (maxRsrp - minRsrp);
|
||||
const value = Math.round(normalized * 255);
|
||||
|
||||
// Store in R channel
|
||||
textureData[idx] = value; // R = normalized RSRP
|
||||
textureData[idx + 1] = value; // G (можна використати для validity mask)
|
||||
textureData[idx + 2] = value; // B
|
||||
textureData[idx + 3] = 255; // A = fully opaque
|
||||
```
|
||||
|
||||
### Альтернатива: Float texture (краща точність)
|
||||
|
||||
```javascript
|
||||
// Якщо браузер підтримує OES_texture_float
|
||||
const ext = gl.getExtension('OES_texture_float');
|
||||
if (ext) {
|
||||
const floatData = new Float32Array(width * height);
|
||||
for (const point of points) {
|
||||
const normalized = (point.rsrp - minRsrp) / (maxRsrp - minRsrp);
|
||||
floatData[gridY * width + gridX] = normalized;
|
||||
}
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.LUMINANCE, width, height, 0,
|
||||
gl.LUMINANCE, gl.FLOAT, floatData);
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Чеклист імплементації
|
||||
|
||||
### Phase 1: Quick Test (Smoothstep)
|
||||
- [ ] Додати `u_textureSize` uniform
|
||||
- [ ] Замінити `texture2D()` на `textureSmooth()`
|
||||
- [ ] Тест на 50m і 200m
|
||||
- [ ] Тест zoom in/out
|
||||
|
||||
### Phase 2: Production (Catmull-Rom)
|
||||
- [ ] Імплементувати `SampleTextureCatmullRom()`
|
||||
- [ ] Оновити colormap function
|
||||
- [ ] Додати boundary fading
|
||||
- [ ] Тест edge cases (краї текстури)
|
||||
- [ ] Performance benchmark
|
||||
|
||||
### Phase 3: Polish
|
||||
- [ ] Видалити старі CSS blur workarounds
|
||||
- [ ] Видалити cellSize multiplication (не потрібно з Catmull-Rom)
|
||||
- [ ] Cleanup debug logs
|
||||
- [ ] Update version to v3.10.5
|
||||
|
||||
---
|
||||
|
||||
## Очікуваний результат
|
||||
|
||||
**До (GL_LINEAR):**
|
||||
```
|
||||
┌───┬───┬───┐
|
||||
│ A │ B │ C │ ← Видимі краї між клітинками
|
||||
├───┼───┼───┤ C0 continuity
|
||||
│ D │ E │ F │
|
||||
└───┴───┴───┘
|
||||
```
|
||||
|
||||
**Після (Catmull-Rom):**
|
||||
```
|
||||
╭───────────────╮
|
||||
│ ░░░▒▒▓▓██ │ ← Smooth gradient
|
||||
│ ░░░▒▒▓▓██▓▓ │ C1 continuity
|
||||
│ ░░▒▒▓▓██ │ Exact values at grid points
|
||||
╰───────────────╯
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Референси
|
||||
|
||||
1. [TheRealMJP's 9-tap Catmull-Rom HLSL](https://gist.github.com/TheRealMJP/c83b8c0f46b63f3a88a5986f4fa982b1)
|
||||
2. [Inigo Quilez - Better Texture Filtering](https://iquilezles.org/articles/texture/)
|
||||
3. [2D Catmull-Rom in 4 samples - Shadertoy](https://www.shadertoy.com/view/4tyGDD)
|
||||
4. [mapbox-gl-interpolate-heatmap](https://github.com/vinayakkulkarni/mapbox-gl-interpolate-heatmap)
|
||||
5. [NVIDIA GPU Gems 2 - Fast Third-Order Texture Filtering](https://developer.nvidia.com/gpugems/gpugems2/part-iii-high-quality-rendering/chapter-20-fast-third-order-texture-filtering)
|
||||
@@ -0,0 +1,149 @@
|
||||
# RFCP Session Summary — February 4, 2026
|
||||
## GPU Acceleration Complete: 195s → 11.2s (17.4x Speedup)
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Session Goal
|
||||
Complete GPU acceleration pipeline and optimize Full preset performance.
|
||||
|
||||
## 📊 Results
|
||||
|
||||
### Performance Achievement
|
||||
|
||||
| Metric | Before (3.7.0) | After (3.8.0) | Improvement |
|
||||
|--------|----------------|---------------|-------------|
|
||||
| **Full preset** (6640 pts, 50m) | 195s | **11.2s** | **17.4x** |
|
||||
| **Standard preset** (1975 pts, 200m) | 7.2s | **2.3s** (cached) | **3.1x** |
|
||||
| Phase 2.5 (distances+path_loss) | 0.33s | **0.006s** | 55x |
|
||||
| Phase 2.6 (terrain LOS) | 7.29s | **0.04s** | 182x |
|
||||
| Per-point (workers) | 1.1ms | **0.1ms** | 11x |
|
||||
|
||||
### GPU Pipeline (Final Architecture)
|
||||
|
||||
```
|
||||
Phase 1: OSM data fetch (Overpass API) ~6-10s (network)
|
||||
Phase 2: Terrain tile download + cache ~4s first / 0s cached
|
||||
Phase 2.5: GPU — distances + base path_loss 0.006s ⚡
|
||||
Phase 2.6: GPU — terrain LOS + diffraction loss 0.04s ⚡
|
||||
Phase 2.7: GPU — antenna pattern loss ~0s ⚡
|
||||
Phase 3: CPU workers — buildings + vegetation ~2s
|
||||
─────────────────────────────────────────────────
|
||||
TOTAL (cached): ~2.3s (Standard)
|
||||
TOTAL (cached): ~11.2s (Full)
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🔧 Changes Made (Iterations 3.7.0 → 3.8.0)
|
||||
|
||||
### Iteration 3.7.0 — GPU Precompute Foundation
|
||||
- Added `gpu_manager` import to `coverage_service.py`
|
||||
- Grid arrays created on GPU (CuPy)
|
||||
- GPU precompute for distances + path_loss (vectorized)
|
||||
- Fixed critical bug: CuPy worker process crashes (CUDA context sharing)
|
||||
- Solution: GPU only in main process, workers use precomputed CPU values
|
||||
- Fixed frontend duplicate calculation guard
|
||||
|
||||
### Iteration 3.8.0 — Full Vectorization
|
||||
- **Phase 2.6**: `batch_terrain_los()` in `gpu_service.py`
|
||||
- Vectorized terrain profile sampling for ALL points simultaneously
|
||||
- Earth curvature correction vectorized
|
||||
- Fresnel clearance + diffraction loss vectorized
|
||||
- **Phase 2.7**: `batch_antenna_pattern()` in `gpu_service.py`
|
||||
- Workers receive precomputed `has_los`, `terrain_loss`, `antenna_loss`
|
||||
- Workers only compute buildings + reflections + vegetation
|
||||
|
||||
### Critical Fix: `_batch_elevation_lookup` Vectorization
|
||||
- **Before**: Python `for` loop over 59,250 coordinates (7.29s)
|
||||
- **After**: Vectorized NumPy tile indexing, loop only over tiles (0.04s)
|
||||
- **Impact**: 182x speedup on Phase 2.6 alone
|
||||
|
||||
### Critical Fix: Vegetation Bbox Pre-filter
|
||||
- **Before**: Each sample point checked ALL 683 vegetation polygons
|
||||
- **After**: Bounding box pre-filter skips 95%+ of polygons
|
||||
- **Impact**: Full preset 156s → 11.2s
|
||||
|
||||
---
|
||||
|
||||
## 📁 Files Modified
|
||||
|
||||
### Backend
|
||||
- `app/services/coverage_service.py` — precomputed values passthrough
|
||||
- `app/services/parallel_coverage_service.py` — 5 worker functions updated
|
||||
- `app/services/gpu_service.py` — batch_terrain_los, batch_antenna_pattern, batch_final_rsrp
|
||||
- `app/services/vegetation_service.py` — bbox pre-filter on _point_in_vegetation
|
||||
|
||||
### Build
|
||||
- PyInstaller ONEDIR build: 1.6 GB dist → 1.2 GB NSIS installer
|
||||
- CUDA DLLs bundled (cublas, cusparse, curand, etc.)
|
||||
- Runtime hook for DLL directory setup
|
||||
|
||||
---
|
||||
|
||||
## 🏗️ Architecture (Final State)
|
||||
|
||||
```
|
||||
Main Process (asyncio event loop)
|
||||
├── Phase 2.5: GPU precompute
|
||||
│ └── CuPy arrays: distances, path_loss (vectorized)
|
||||
├── Phase 2.6: GPU terrain LOS
|
||||
│ └── Batch elevation lookup (vectorized NumPy)
|
||||
│ └── Earth curvature + Fresnel (CuPy)
|
||||
│ └── Diffraction loss (CuPy)
|
||||
├── Phase 2.7: GPU antenna pattern
|
||||
│ └── Bearing + pattern loss (CuPy)
|
||||
│
|
||||
└── Phase 3: CPU ProcessPool (3 workers)
|
||||
└── Receive precomputed dict per point
|
||||
└── Skip terrain/antenna (already computed)
|
||||
└── Only: buildings + reflections + vegetation
|
||||
└── Pure NumPy + CPU
|
||||
```
|
||||
|
||||
**Key Rule**: GPU (CuPy) code ONLY in main process. Workers never import gpu_manager.
|
||||
|
||||
---
|
||||
|
||||
## 🎮 Side Activity: Dwarf Fortress Gamelog Analysis
|
||||
|
||||
Analyzed 102,669-line gamelog from fort "Lashderush (Prophethandle)":
|
||||
- 8-9 years, 23 migrant waves, 1,943 masterpieces
|
||||
- 51,599 combat actions, only 4 deaths (weredeer outbreak)
|
||||
- Top crafter: Momuz Nëkorlibash (201 masterpieces)
|
||||
- Sole survivor transforms between dwarf/weredeer
|
||||
|
||||
---
|
||||
|
||||
## 🔮 Next Steps
|
||||
|
||||
### Immediate
|
||||
- [x] ~~GPU acceleration~~ ✅ COMPLETE
|
||||
- [ ] SRTM terrain data integration (higher accuracy than current tiles)
|
||||
- [ ] Session history persistence across app restarts
|
||||
|
||||
### Short Term
|
||||
- [ ] Multi-station dashboard
|
||||
- [ ] Project export/import (JSON)
|
||||
- [ ] Link budget analysis view
|
||||
|
||||
### Medium Term
|
||||
- [ ] LimeSDR hardware integration testing
|
||||
- [ ] Real RF validation against field measurements
|
||||
- [ ] 3D visualization mode
|
||||
|
||||
---
|
||||
|
||||
## 💡 Key Learnings
|
||||
|
||||
1. **Python for-loops are the enemy** — `_batch_elevation_lookup` went from 7.3s to 0.04s by replacing enumerate(zip()) with NumPy indexing
|
||||
2. **Spatial pre-filtering is massive** — vegetation bbox check eliminated 95%+ of polygon tests
|
||||
3. **GPU context can't be shared across processes** — spawn mode creates new CUDA contexts that OOM
|
||||
4. **Vectorize in main, distribute to workers** — best pattern for GPU + multiprocessing
|
||||
5. **Profile before optimizing** — Phase 2.6 bottleneck was invisible until measured
|
||||
|
||||
---
|
||||
|
||||
*Session duration: ~4 hours*
|
||||
*Lines of code changed: ~300*
|
||||
*Performance gain: 17.4x*
|
||||
*Feeling: 🚀*
|
||||
@@ -0,0 +1,260 @@
|
||||
# RFCP Session 2026-02-04 — Complete Development Log
|
||||
|
||||
**Session:** February 4, 2026 (afternoon/evening)
|
||||
**Duration:** ~6 hours active development
|
||||
**Iterations completed:** 3.9.0 → 3.9.1 → 3.10.0 → 3.10.1 → 3.10.2 → 3.10.3 → 3.10.4 (pending)
|
||||
|
||||
---
|
||||
|
||||
## What Was Done This Session
|
||||
|
||||
### Infrastructure: terra.eliah.one Tile Server ✅
|
||||
- **DNS:** terra.eliah.one → 2.56.207.143 (VPS A, Hayhost)
|
||||
- **Caddy:** File server with browse at /opt/terra/tiles/
|
||||
- **SRTM3 (90m):** 187 tiles, 514.5 MB — full Ukraine (N44-N51, E018-E041)
|
||||
- **SRTM1 (30m):** 160 tiles, 3,957.3 MB — full Ukraine (N44-N51, E022-E041)
|
||||
- **Sources:** viewfinderpanoramas.org (SRTM3, void-filled), AWS S3 elevation-tiles-prod (SRTM1)
|
||||
- **Index:** /api/index → tile_index.json (version 2, dual dataset)
|
||||
- **Public access verified:** https://terra.eliah.one/srtm1/ and /srtm3/
|
||||
|
||||
### Iteration 3.9.1: Terra Integration ✅
|
||||
- terrain_service.py updated with prioritized SRTM sources:
|
||||
1. terra.eliah.one/srtm1/ (30m, preferred)
|
||||
2. terra.eliah.one/srtm3/ (90m, fallback)
|
||||
3. AWS S3 skadi mirror (public fallback)
|
||||
- New endpoints: /api/terrain/status, /api/terrain/download, /api/terrain/index
|
||||
- Auto-downloads tiles on first use, cached permanently on disk
|
||||
- 173 tiles loaded (4,278.6 MB) confirmed in Data Cache panel
|
||||
|
||||
### Iteration 3.10.0: Link Budget + Fresnel Zone + Interference ✅
|
||||
- **Link Budget Calculator:** Full TX→RX path analysis panel
|
||||
- EIRP calculation, FSPL, terrain loss, received power, link margin
|
||||
- RX point placement on map (orange marker, dashed line)
|
||||
- ✓ LINK OK / ✗ FAIL status with margin display
|
||||
- **Fresnel Zone Visualization:** On Terrain Profile chart
|
||||
- First Fresnel zone ellipse overlay (semi-transparent)
|
||||
- Red highlighting where terrain intrudes zone
|
||||
- Frequency-aware (zone size changes with MHz)
|
||||
- Clearance calculation with recommendation text
|
||||
- **Interference Modeling (C/I):** Backend ready
|
||||
- Carrier-to-interference ratio per grid point
|
||||
- Co-frequency site grouping
|
||||
- GPU-accelerated (CuPy vectorized)
|
||||
|
||||
### Iteration 3.10.1: UI Bugfixes (partial) ✅
|
||||
- Elevation opacity control
|
||||
- Data Cache panel with region downloads
|
||||
- Various dark theme text fixes
|
||||
|
||||
### Iteration 3.10.2: Tool Mode System ✅
|
||||
- **ActiveTool state:** 'none' | 'ruler' | 'rx-placement' | 'site-placement'
|
||||
- Single map click handler dispatches to active tool
|
||||
- Cursor management (default/crosshair/cell per tool)
|
||||
- Ruler snap-to-site (20px threshold)
|
||||
- Event propagation fixes (partial — terrain profile still leaks)
|
||||
|
||||
### Iteration 3.10.3: Calculator Button + Ruler Limit ✅
|
||||
- Calculator button added to right toolbar
|
||||
- Ruler limited to 2 points max (point-to-point only)
|
||||
- Third click starts new measurement
|
||||
|
||||
### Iteration 3.10.4: Pending Fixes 🔧
|
||||
- Terrain Profile click-through (needs stopImmediatePropagation on native event)
|
||||
- TX Height hardcoded to 2m in Link Budget (should read from site config)
|
||||
|
||||
---
|
||||
|
||||
## Current State — What Works
|
||||
|
||||
### Core Features ✅
|
||||
- Multi-site RF coverage planning with multi-sector antennas
|
||||
- GPU-accelerated coverage calculation (RTX 4060, CuPy/CUDA)
|
||||
- 9 propagation models (Free-Space, terrain_los, buildings, materials, dominant_path, street_canyon, reflections, water_reflection, vegetation, atmospheric)
|
||||
- Performance: 11.2s Full preset (17.4x speedup from v3.8.0)
|
||||
- Geographic-scale heatmap with Leaflet tile rendering
|
||||
|
||||
### Terrain Integration ✅
|
||||
- SRTM elevation data (30m and 90m resolution)
|
||||
- Bilinear interpolation for sub-pixel accuracy
|
||||
- Memory-mapped I/O with LRU cache (20 tiles)
|
||||
- Auto-detection SRTM1 vs SRTM3 by file size
|
||||
- Terrain-aware coverage calculation (Line of Sight, terrain loss)
|
||||
- Terrain Profile viewer with elevation chart
|
||||
|
||||
### Analysis Tools ✅
|
||||
- **Link Budget Calculator** — point-to-point path analysis
|
||||
- **Fresnel Zone Visualization** — on terrain profile chart
|
||||
- **Ruler/Distance Measurement** — 2-point with snap-to-site
|
||||
- **Terrain Profile** — elevation cross-section between 2 points
|
||||
- **Coverage Statistics** — Excellent/Good/Fair/Weak breakdown
|
||||
- **Session History** — compare calculation runs
|
||||
|
||||
### Data Management ✅
|
||||
- Export: CSV, GeoJSON coverage data
|
||||
- Import/Export: Site configurations (JSON)
|
||||
- Data Cache: Regional tile pre-download (Ukraine, Eastern Ukraine, Donbas, Central, Western, Kyiv)
|
||||
- 173 terrain tiles (4.3 GB) cached locally
|
||||
|
||||
### Infrastructure ✅
|
||||
- Frontend: React 18 + TypeScript + Vite + Leaflet
|
||||
- Backend: Python FastAPI + CuPy GPU pipeline
|
||||
- Tile Server: terra.eliah.one (Caddy file_server)
|
||||
- Packaging: PyInstaller + Electron (Windows installer)
|
||||
- Desktop app: RFCP - RF Coverage Planner (native window)
|
||||
|
||||
---
|
||||
|
||||
## Known Bugs (for 3.10.4+)
|
||||
|
||||
| # | Bug | Severity | Root Cause |
|
||||
|---|-----|----------|------------|
|
||||
| 1 | Terrain Profile click places ruler point | Medium | stopPropagation not blocking Leaflet's native DOM listener. Need `e.nativeEvent.stopImmediatePropagation()` or move popup outside Leaflet container |
|
||||
| 2 | TX Height shows 2m in Link Budget | Low | Hardcoded default, not reading from site config field |
|
||||
| 3 | Cursor still shows hand in some cases | Low | Leaflet default grab cursor not fully overridden |
|
||||
| 4 | Elevation Colors opacity slider | Low | May need correct layer reference binding |
|
||||
|
||||
---
|
||||
|
||||
## Roadmap — Updated February 4, 2026
|
||||
|
||||
### ✅ COMPLETED (Iterations 1-3.10.3)
|
||||
|
||||
**Phase 1: Foundation** (Dec 2024)
|
||||
- React + TypeScript + Vite + Leaflet setup
|
||||
- Basic site management, coverage calculation
|
||||
|
||||
**Phase 2: Core Features** (Jan 2025, Iterations 1-10.1)
|
||||
- Multi-site, multi-sector, geographic heatmap
|
||||
- Coverage statistics, keyboard shortcuts
|
||||
- Code audit, production polish
|
||||
|
||||
**Phase 3: GPU Acceleration** (Feb 2-3, 2026, Iterations 3.1-3.8)
|
||||
- CuPy/CUDA pipeline: 195s → 11.2s (17.4x)
|
||||
- PyInstaller build with CUDA bundling
|
||||
- Windows native backend (no WSL2)
|
||||
|
||||
**Phase 4: Terrain Integration** (Feb 4, 2026, Iterations 3.9-3.10)
|
||||
- SRTM tile server (terra.eliah.one)
|
||||
- 347 tiles, 4.5 GB, full Ukraine coverage
|
||||
- Terrain-aware propagation, terrain profiles
|
||||
- Link budget calculator, Fresnel zones
|
||||
- Tool mode system, interference modeling
|
||||
|
||||
### 🔧 REMAINING ON CURRENT STACK
|
||||
|
||||
**3.10.4: Final Bugfixes** (1-2 hours)
|
||||
- Terrain Profile click propagation fix
|
||||
- TX Height from site config
|
||||
- Cursor cleanup
|
||||
- Elevation opacity fix
|
||||
|
||||
**3.11: Polish & QA** (optional, 2-3 hours)
|
||||
- Interference C/I heatmap toggle on frontend
|
||||
- Coverage comparison mode (before/after)
|
||||
- Keyboard shortcuts help modal (?)
|
||||
- Settings persistence (localStorage)
|
||||
- Input validation improvements
|
||||
|
||||
**3.12: Offline Package** (optional, 2-3 hours)
|
||||
- SRTM3 tiles bundled in installer (~180 MB gzipped)
|
||||
- SRTM1 as optional "HD Terrain Pack" download
|
||||
- First-run extraction to data/terrain/
|
||||
- Full offline operation without internet
|
||||
|
||||
### 🔮 FUTURE (New Stack — When Inspired)
|
||||
|
||||
**Stack Migration: Tauri + SvelteKit + Rust**
|
||||
- Native performance without Electron overhead
|
||||
- Rust backend replacing Python FastAPI
|
||||
- GPU compute via wgpu or Vulkan
|
||||
- Smaller installer (<100 MB vs current ~1.6 GB)
|
||||
- Already tested Tauri for UMTC Wiki project
|
||||
|
||||
**Advanced RF Features:**
|
||||
- 3D terrain visualization (Three.js or WebGPU)
|
||||
- Drive test data import and comparison
|
||||
- Multiple frequency band planning
|
||||
- Custom propagation model editor
|
||||
- Real-time collaboration (via Matrix?)
|
||||
|
||||
**Field Deployment:**
|
||||
- Live USB with BitLocker encryption
|
||||
- Offline-first with full Ukraine terrain
|
||||
- Integration with UMTC tactical mesh
|
||||
- LoRa/IoT device position planning
|
||||
|
||||
---
|
||||
|
||||
## Tech Specs Quick Reference
|
||||
|
||||
### Backend
|
||||
```
|
||||
Location: D:\root\rfcp\backend
|
||||
Framework: FastAPI + Uvicorn
|
||||
GPU: CuPy + CUDA (RTX 4060)
|
||||
Python: 3.x with numpy, scipy, httpx
|
||||
Build: PyInstaller ONEDIR (~1.6 GB with CUDA)
|
||||
Start: python -m uvicorn app.main:app --host 0.0.0.0 --port 8000
|
||||
```
|
||||
|
||||
### Frontend
|
||||
```
|
||||
Location: D:\root\rfcp\frontend
|
||||
Framework: React 18 + TypeScript + Vite
|
||||
Map: Leaflet + custom geographic heatmap
|
||||
State: Zustand
|
||||
Build: npm run build → dist/
|
||||
Bundle: 163KB gzipped
|
||||
```
|
||||
|
||||
### Tile Server
|
||||
```
|
||||
Domain: terra.eliah.one
|
||||
Server: VPS A (2.56.207.143), Caddy file_server
|
||||
Path: /opt/terra/tiles/srtm1/ and /opt/terra/tiles/srtm3/
|
||||
Index: /api/index → tile_index.json
|
||||
Health: /health → "ok"
|
||||
Tiles: 187 SRTM3 (515 MB) + 160 SRTM1 (3.9 GB)
|
||||
```
|
||||
|
||||
### Key Files
|
||||
```
|
||||
terrain_service.py — SRTM tile loading, bilinear interpolation, elevation profiles
|
||||
gpu_service.py — CuPy/CUDA coverage calculation pipeline
|
||||
coverage_service.py — Propagation models, coverage orchestration
|
||||
routes/terrain.py — /api/terrain/status, /download, /index
|
||||
routes/coverage.py — /api/link-budget, /api/fresnel-profile
|
||||
frontend/src/store/tools.ts — ActiveTool state management
|
||||
frontend/src/components/panels/LinkBudgetPanel.tsx
|
||||
frontend/src/components/map/TerrainProfile.tsx
|
||||
frontend/src/components/map/MeasurementTool.tsx
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Performance Benchmarks
|
||||
|
||||
| Preset | Resolution | Points | Time | GPU |
|
||||
|--------|-----------|--------|------|-----|
|
||||
| Standard | 200m | 1,975 | 7.4s | ✅ |
|
||||
| Full | 50m | 6,639-6,662 | 11.2-11.7s | ✅ |
|
||||
| 50km radius | 200m | 4,966 | ~30s | ✅ |
|
||||
|
||||
**GPU:** NVIDIA RTX 4060 (CUDA)
|
||||
**Speedup:** 17.4x vs CPU-only (v3.7.0 baseline)
|
||||
|
||||
---
|
||||
|
||||
## Session Notes
|
||||
|
||||
Продуктивна сесія. За ~6 годин:
|
||||
- Підняли tile server з нуля (terra.eliah.one)
|
||||
- 347 тайлів terrain data для всієї України
|
||||
- Інтегрували terrain в backend (auto-download, status API)
|
||||
- Додали Link Budget Calculator, Fresnel Zone, Interference modeling
|
||||
- Впровадили Tool Mode System для вирішення click conflicts
|
||||
- Виправили купу UX багів
|
||||
|
||||
Продукт близький до завершення на поточному стеку. Основна функціональність працює, залишились polish баги та optional фічі. Рефактор на Tauri+SvelteKit+Rust — коли буде натхнення, не терміново.
|
||||
|
||||
Half Sword скачаний і чекає. 🗡️
|
||||
193
docs/devlog/gpu_supp/SESSION-2026-02-06-WebGL-Radial-Summary.md
Normal file
193
docs/devlog/gpu_supp/SESSION-2026-02-06-WebGL-Radial-Summary.md
Normal file
@@ -0,0 +1,193 @@
|
||||
# RFCP v3.10.5 Session Summary - 2026-02-06
|
||||
|
||||
## Що зробили сьогодні
|
||||
|
||||
### 1. WebGL Texture-Based Coverage (ЗАВЕРШЕНО ✅)
|
||||
|
||||
**Проблема:** Canvas heatmap був blocky, хотіли smooth interpolation.
|
||||
|
||||
**Рішення:** Texture-based WebGL з smoothstep shader + nearest neighbor fill.
|
||||
|
||||
**Файл:** `frontend/src/components/map/WebGLCoverageLayer.tsx`
|
||||
|
||||
**Як працює:**
|
||||
1. Створюємо texture де кожен pixel = RSRP value
|
||||
2. Nearest neighbor fill для заповнення gaps (circular coverage → rectangular texture)
|
||||
3. Smoothstep shader для C2 continuity interpolation
|
||||
4. Colormap applied AFTER interpolation
|
||||
|
||||
**Статус:** Працює, але все ще blocky на zoom in через nearest neighbor fill.
|
||||
|
||||
---
|
||||
|
||||
### 2. WebGL Radial Gradients Coverage (В ПРОЦЕСІ 🔄)
|
||||
|
||||
**Мета:** Красиві smooth gradients як Canvas heatmap, але GPU-accelerated.
|
||||
|
||||
**Файл:** `frontend/src/components/map/WebGLRadialCoverageLayer.tsx`
|
||||
|
||||
**Як працює:**
|
||||
1. Кожна точка = quad з Gaussian radial falloff
|
||||
2. Additive blending в float framebuffer: (weight × rsrp, weight)
|
||||
3. Final composite pass: normalize (R/G) + colormap
|
||||
|
||||
**Поточний статус:**
|
||||
- ✅ Framebuffer створюється правильно
|
||||
- ✅ Points рендеряться (framebuffer має дані)
|
||||
- ✅ Composite pass працює (final pixel має колір)
|
||||
- ✅ 50m показує beautiful smooth gradients!
|
||||
- ✅ 200m тепер теж показує (після radius fix)
|
||||
- ⚠️ Coverage radius не повний (обрізається раніше ніж 10km)
|
||||
- ⚠️ Темне коло на периферії (falloff занадто різкий?)
|
||||
- ⚠️ Selector dropdown сірий на білому (CSS issue)
|
||||
|
||||
---
|
||||
|
||||
### 3. Coverage Renderer Selector (ЗАВЕРШЕНО ✅)
|
||||
|
||||
**Файл:** `frontend/src/store/settings.ts`
|
||||
|
||||
**Додано:** `coverageRenderer: 'radial' | 'texture' | 'canvas'`
|
||||
|
||||
**UI:** Dropdown в Coverage Settings panel
|
||||
|
||||
**Fallback chain:**
|
||||
- Radial fails → Texture
|
||||
- Texture fails → Canvas
|
||||
|
||||
---
|
||||
|
||||
## Залишилось зробити (Next Session)
|
||||
|
||||
### Priority 1: Fix Radial Coverage Radius
|
||||
|
||||
**Симптом:** Coverage не покриває повні 10km, обрізається раніше.
|
||||
|
||||
**Можливі причини:**
|
||||
1. Canvas bounds не включають padding для point radius
|
||||
2. Points на краю мають gradient що виходить за canvas
|
||||
3. Normalized coordinates calculation wrong at edges
|
||||
|
||||
**Debug:**
|
||||
```javascript
|
||||
// Перевірити bounds vs actual coverage extent
|
||||
console.log('Canvas bounds:', bounds);
|
||||
console.log('Points extent:', {
|
||||
minLat: Math.min(...points.map(p => p.lat)),
|
||||
maxLat: Math.max(...points.map(p => p.lat)),
|
||||
// ...
|
||||
});
|
||||
```
|
||||
|
||||
**Fix approach:**
|
||||
1. Додати padding до canvas bounds = point radius
|
||||
2. Або clip points що виходять за межі
|
||||
|
||||
---
|
||||
|
||||
### Priority 2: Fix Dark Ring on Periphery
|
||||
|
||||
**Симптом:** Темне коло на краю coverage area.
|
||||
|
||||
**Причина:** Точки на периферії мають менше сусідів → менший total weight → темніший колір після normalization.
|
||||
|
||||
**Fix options:**
|
||||
1. Збільшити radius multiplier (3.0× замість 2.5×)
|
||||
2. Або додати edge detection і boost alpha там
|
||||
3. Або використати min weight threshold перед normalization
|
||||
|
||||
---
|
||||
|
||||
### Priority 3: Fix Selector Dropdown Styling
|
||||
|
||||
**Симптом:** Сірий текст на білому фоні (погано видно).
|
||||
|
||||
**Fix:** Update CSS classes в App.tsx для dropdown.
|
||||
|
||||
---
|
||||
|
||||
### Priority 4: Performance Testing
|
||||
|
||||
Протестувати з великою кількістю точок:
|
||||
- 10,000+ points
|
||||
- 50,000+ points
|
||||
- Measure frame time
|
||||
|
||||
Якщо повільно — implement instanced rendering.
|
||||
|
||||
---
|
||||
|
||||
## Files Changed Today
|
||||
|
||||
```
|
||||
frontend/src/components/map/
|
||||
├── WebGLCoverageLayer.tsx # Texture-based (updated with NN fill)
|
||||
├── WebGLRadialCoverageLayer.tsx # NEW - Radial gradients
|
||||
└── GeographicHeatmap.tsx # Canvas fallback (unchanged)
|
||||
|
||||
frontend/src/store/
|
||||
└── settings.ts # Added coverageRenderer option
|
||||
|
||||
frontend/src/
|
||||
└── App.tsx # Integrated renderer selector
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Console Debug Commands
|
||||
|
||||
```javascript
|
||||
// Check which renderer is active
|
||||
document.querySelectorAll('canvas').forEach(c =>
|
||||
console.log(c.className, c.width, c.height)
|
||||
);
|
||||
|
||||
// Check WebGL errors
|
||||
const canvas = document.querySelector('.webgl-radial-coverage');
|
||||
const gl = canvas?.getContext('webgl');
|
||||
console.log('WebGL error:', gl?.getError());
|
||||
|
||||
// Read center pixel
|
||||
gl?.readPixels(canvas.width/2, canvas.height/2, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, new Uint8Array(4));
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## Key Insights Learned
|
||||
|
||||
1. **Texture-based vs Radial:** Texture good for terrain detail accuracy, Radial good for beautiful visualization.
|
||||
|
||||
2. **Float framebuffer:** Need `EXT_color_buffer_float` extension. Fallback: use RGBA8 with encoding.
|
||||
|
||||
3. **Additive blending:** `gl.blendFunc(gl.ONE, gl.ONE)` for accumulation, then `gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA)` for final composite.
|
||||
|
||||
4. **Weighted average in shader:** Store (weight × value, weight), then normalize: value = R / G.
|
||||
|
||||
5. **Radius scaling:** Higher resolution = more points = smaller radius. Lower resolution = fewer points = larger radius to compensate.
|
||||
|
||||
---
|
||||
|
||||
## Git Status
|
||||
|
||||
- ✅ Pushed working WebGL texture-based coverage
|
||||
- 🔄 WebGL radial in progress (functional but incomplete)
|
||||
|
||||
---
|
||||
|
||||
## Next Session Start Point
|
||||
|
||||
1. Відкрити RFCP project
|
||||
2. `npm run dev` в frontend
|
||||
3. Test radial coverage з 50m і 200m
|
||||
4. Fix radius issue (Priority 1)
|
||||
5. Fix dark ring (Priority 2)
|
||||
6. Polish UI (Priority 3)
|
||||
|
||||
---
|
||||
|
||||
## Session Stats
|
||||
|
||||
- **Duration:** ~6 hours
|
||||
- **Iterations:** 15+ fix attempts
|
||||
- **Final result:** Working radial gradients renderer (90% complete)
|
||||
- **Key breakthrough:** Discovering framebuffer had data but composite pass wasn't reading it
|
||||
27
frontend/package-lock.json
generated
27
frontend/package-lock.json
generated
@@ -1194,19 +1194,6 @@
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-x64-gnu": {
|
||||
"version": "4.57.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.57.0.tgz",
|
||||
"integrity": "sha512-OR5p5yG5OKSxHReWmwvM0P+VTPMwoBS45PXTMYaskKQqybkS3Kmugq1W+YbNWArF8/s7jQScgzXUhArzEQ7x0A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/@rollup/rollup-linux-x64-musl": {
|
||||
"version": "4.57.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.57.0.tgz",
|
||||
@@ -3449,6 +3436,20 @@
|
||||
"fsevents": "~2.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/rollup/node_modules/@rollup/rollup-linux-x64-gnu": {
|
||||
"version": "4.57.0",
|
||||
"resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.57.0.tgz",
|
||||
"integrity": "sha512-OR5p5yG5OKSxHReWmwvM0P+VTPMwoBS45PXTMYaskKQqybkS3Kmugq1W+YbNWArF8/s7jQScgzXUhArzEQ7x0A==",
|
||||
"cpu": [
|
||||
"x64"
|
||||
],
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"os": [
|
||||
"linux"
|
||||
]
|
||||
},
|
||||
"node_modules/scheduler": {
|
||||
"version": "0.27.0",
|
||||
"resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
|
||||
|
||||
@@ -6,6 +6,7 @@ import { useSitesStore } from '@/store/sites.ts';
|
||||
import { useCoverageStore } from '@/store/coverage.ts';
|
||||
import { useSettingsStore } from '@/store/settings.ts';
|
||||
import { useHistoryStore, pushToFuture, pushToPast } from '@/store/history.ts';
|
||||
import { useToolStore } from '@/store/tools.ts';
|
||||
import { useToastStore } from '@/components/ui/Toast.tsx';
|
||||
import { useKeyboardShortcuts } from '@/hooks/useKeyboardShortcuts.ts';
|
||||
import { useUnsavedChanges } from '@/hooks/useUnsavedChanges.ts';
|
||||
@@ -13,6 +14,8 @@ import { logger } from '@/utils/logger.ts';
|
||||
import { db } from '@/db/schema.ts';
|
||||
import MapView from '@/components/map/Map.tsx';
|
||||
import GeographicHeatmap from '@/components/map/GeographicHeatmap.tsx';
|
||||
import WebGLCoverageLayer from '@/components/map/WebGLCoverageLayer.tsx';
|
||||
import WebGLRadialCoverageLayer from '@/components/map/WebGLRadialCoverageLayer.tsx';
|
||||
import CoverageBoundary from '@/components/map/CoverageBoundary.tsx';
|
||||
import HeatmapLegend from '@/components/map/HeatmapLegend.tsx';
|
||||
import SiteList from '@/components/panels/SiteList.tsx';
|
||||
@@ -29,6 +32,8 @@ import ToastContainer from '@/components/ui/Toast.tsx';
|
||||
import ThemeToggle from '@/components/ui/ThemeToggle.tsx';
|
||||
import GPUIndicator from '@/components/ui/GPUIndicator.tsx';
|
||||
import TerrainProfile from '@/components/map/TerrainProfile.tsx';
|
||||
import LinkBudgetPanel from '@/components/panels/LinkBudgetPanel.tsx';
|
||||
import LinkBudgetOverlay from '@/components/map/LinkBudgetOverlay.tsx';
|
||||
import Button from '@/components/ui/Button.tsx';
|
||||
import NumberInput from '@/components/ui/NumberInput.tsx';
|
||||
import ConfirmDialog from '@/components/ui/ConfirmDialog.tsx';
|
||||
@@ -60,7 +65,7 @@ async function restoreSites(snapshot: Site[]) {
|
||||
export default function App() {
|
||||
const loadSites = useSitesStore((s) => s.loadSites);
|
||||
const sites = useSitesStore((s) => s.sites);
|
||||
const setPlacingMode = useSitesStore((s) => s.setPlacingMode);
|
||||
const selectedSiteId = useSitesStore((s) => s.selectedSiteId);
|
||||
|
||||
const coverageResult = useCoverageStore((s) => s.result);
|
||||
const isCalculating = useCoverageStore((s) => s.isCalculating);
|
||||
@@ -110,15 +115,20 @@ export default function App() {
|
||||
const setTerrainOpacity = useSettingsStore((s) => s.setTerrainOpacity);
|
||||
const showGrid = useSettingsStore((s) => s.showGrid);
|
||||
const setShowGrid = useSettingsStore((s) => s.setShowGrid);
|
||||
const measurementMode = useSettingsStore((s) => s.measurementMode);
|
||||
const setMeasurementMode = useSettingsStore((s) => s.setMeasurementMode);
|
||||
const showElevationInfo = useSettingsStore((s) => s.showElevationInfo);
|
||||
|
||||
// Tool store (centralized active tool state)
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
const setActiveTool = useToolStore((s) => s.setActiveTool);
|
||||
const clearTool = useToolStore((s) => s.clearTool);
|
||||
const setShowElevationInfo = useSettingsStore((s) => s.setShowElevationInfo);
|
||||
const showBoundary = useSettingsStore((s) => s.showBoundary);
|
||||
const showElevationOverlay = useSettingsStore((s) => s.showElevationOverlay);
|
||||
const setShowElevationOverlay = useSettingsStore((s) => s.setShowElevationOverlay);
|
||||
const elevationOpacity = useSettingsStore((s) => s.elevationOpacity);
|
||||
const setElevationOpacity = useSettingsStore((s) => s.setElevationOpacity);
|
||||
const coverageRenderer = useSettingsStore((s) => s.coverageRenderer);
|
||||
const setCoverageRenderer = useSettingsStore((s) => s.setCoverageRenderer);
|
||||
|
||||
// History (undo/redo)
|
||||
const canUndo = useHistoryStore((s) => s.canUndo);
|
||||
@@ -137,6 +147,8 @@ export default function App() {
|
||||
const [showShortcuts, setShowShortcuts] = useState(false);
|
||||
const [kbDeleteTarget, setKbDeleteTarget] = useState<{ id: string; name: string } | null>(null);
|
||||
const [profileEndpoints, setProfileEndpoints] = useState<{ start: [number, number]; end: [number, number] } | null>(null);
|
||||
const [showLinkBudget, setShowLinkBudget] = useState(false);
|
||||
const [linkBudgetRxPoint, setLinkBudgetRxPoint] = useState<{ lat: number; lon: number } | null>(null);
|
||||
|
||||
// Region wizard for first-run (desktop mode only)
|
||||
const [showWizard, setShowWizard] = useState(false);
|
||||
@@ -213,17 +225,26 @@ export default function App() {
|
||||
loadSites();
|
||||
}, [loadSites]);
|
||||
|
||||
// Handle map click -> open modal with coordinates
|
||||
const handleMapClick = useCallback(
|
||||
// Handle site placement from map click
|
||||
const handleSitePlacement = useCallback(
|
||||
(lat: number, lon: number) => {
|
||||
setModalState({
|
||||
isOpen: true,
|
||||
mode: 'create',
|
||||
initialData: { lat, lon },
|
||||
});
|
||||
setPlacingMode(false);
|
||||
// Tool store clearTool() is called by MapClickHandler after placement
|
||||
},
|
||||
[setPlacingMode]
|
||||
[]
|
||||
);
|
||||
|
||||
// Handle RX point placement for Link Budget
|
||||
const handleRxPlacement = useCallback(
|
||||
(lat: number, lon: number) => {
|
||||
setLinkBudgetRxPoint({ lat, lon });
|
||||
// Tool store clearTool() is called by MapClickHandler after placement
|
||||
},
|
||||
[]
|
||||
);
|
||||
|
||||
const handleEditSite = useCallback((site: Site) => {
|
||||
@@ -668,20 +689,50 @@ export default function App() {
|
||||
{/* Map */}
|
||||
<div className="flex-1 relative">
|
||||
<MapView
|
||||
onMapClick={handleMapClick}
|
||||
onSitePlacement={handleSitePlacement}
|
||||
onRxPlacement={handleRxPlacement}
|
||||
onEditSite={handleEditSite}
|
||||
onProfileRequest={(start, end) => setProfileEndpoints({ start, end })}
|
||||
showLinkBudget={showLinkBudget}
|
||||
onToggleLinkBudget={() => setShowLinkBudget(!showLinkBudget)}
|
||||
>
|
||||
{/* Show partial results during tiled calculation, or final result */}
|
||||
{(coverageResult || (isCalculating && partialPoints.length > 0)) && (
|
||||
<>
|
||||
<GeographicHeatmap
|
||||
points={isCalculating && partialPoints.length > 0 ? partialPoints : (coverageResult?.points ?? [])}
|
||||
visible={heatmapVisible}
|
||||
opacity={settings.heatmapOpacity}
|
||||
radiusMeters={settings.heatmapRadius}
|
||||
rsrpThreshold={settings.rsrpThreshold}
|
||||
/>
|
||||
{/* Render coverage layer based on selected renderer */}
|
||||
{coverageRenderer === 'webgl-radial' && (
|
||||
<WebGLRadialCoverageLayer
|
||||
key="webgl-radial-coverage"
|
||||
points={isCalculating && partialPoints.length > 0 ? partialPoints : (coverageResult?.points ?? [])}
|
||||
visible={heatmapVisible}
|
||||
opacity={settings.heatmapOpacity}
|
||||
minRsrp={-130}
|
||||
maxRsrp={-50}
|
||||
radiusMeters={settings.heatmapRadius}
|
||||
onWebGLFailed={() => setCoverageRenderer('webgl-texture')}
|
||||
/>
|
||||
)}
|
||||
{coverageRenderer === 'webgl-texture' && (
|
||||
<WebGLCoverageLayer
|
||||
key="webgl-coverage"
|
||||
points={isCalculating && partialPoints.length > 0 ? partialPoints : (coverageResult?.points ?? [])}
|
||||
visible={heatmapVisible}
|
||||
opacity={settings.heatmapOpacity}
|
||||
minRsrp={-130}
|
||||
maxRsrp={-50}
|
||||
onWebGLFailed={() => setCoverageRenderer('canvas')}
|
||||
/>
|
||||
)}
|
||||
{coverageRenderer === 'canvas' && (
|
||||
<GeographicHeatmap
|
||||
key="canvas-coverage"
|
||||
points={isCalculating && partialPoints.length > 0 ? partialPoints : (coverageResult?.points ?? [])}
|
||||
visible={heatmapVisible}
|
||||
opacity={settings.heatmapOpacity}
|
||||
radiusMeters={settings.heatmapRadius}
|
||||
rsrpThreshold={settings.rsrpThreshold}
|
||||
/>
|
||||
)}
|
||||
{coverageResult && (
|
||||
<CoverageBoundary
|
||||
points={coverageResult.points.filter(p => p.rsrp >= settings.rsrpThreshold)}
|
||||
@@ -692,7 +743,29 @@ export default function App() {
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{/* Link Budget TX-RX overlay */}
|
||||
{showLinkBudget && linkBudgetRxPoint && (() => {
|
||||
const txSite = sites.find(s => s.id === selectedSiteId);
|
||||
return (
|
||||
<LinkBudgetOverlay
|
||||
txPoint={txSite ? { lat: txSite.lat, lon: txSite.lon } : null}
|
||||
rxPoint={linkBudgetRxPoint}
|
||||
onRxDrag={(lat, lon) => setLinkBudgetRxPoint({ lat, lon })}
|
||||
/>
|
||||
);
|
||||
})()}
|
||||
</MapView>
|
||||
{activeTool === 'rx-placement' && (
|
||||
<div className="absolute top-4 left-1/2 -translate-x-1/2 z-[2000] bg-blue-600 text-white px-4 py-2 rounded-lg shadow-lg text-sm font-medium flex items-center gap-2">
|
||||
<span>Click on map to set RX point</span>
|
||||
<button
|
||||
onClick={() => clearTool()}
|
||||
className="text-white/70 hover:text-white ml-2"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
<HeatmapLegend />
|
||||
<ResultsPanel />
|
||||
{profileEndpoints && (
|
||||
@@ -702,6 +775,19 @@ export default function App() {
|
||||
onClose={() => setProfileEndpoints(null)}
|
||||
/>
|
||||
)}
|
||||
{showLinkBudget && (
|
||||
<div className="absolute top-20 left-4 z-[1500]">
|
||||
<LinkBudgetPanel
|
||||
rxPoint={linkBudgetRxPoint}
|
||||
onRequestMapClick={() => setActiveTool('rx-placement')}
|
||||
onClose={() => {
|
||||
setShowLinkBudget(false);
|
||||
clearTool();
|
||||
setLinkBudgetRxPoint(null);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Side panel */}
|
||||
@@ -793,6 +879,24 @@ export default function App() {
|
||||
unit="%"
|
||||
hint="Transparency of the RF coverage overlay"
|
||||
/>
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-700 dark:text-dark-text">
|
||||
Coverage Renderer
|
||||
</label>
|
||||
<p className="text-xs text-gray-400 dark:text-dark-muted mb-1">
|
||||
Visualization style for coverage overlay
|
||||
</p>
|
||||
<select
|
||||
value={coverageRenderer}
|
||||
onChange={(e) => setCoverageRenderer(e.target.value as 'webgl-radial' | 'webgl-texture' | 'canvas')}
|
||||
className="w-full mt-1 px-2 py-1.5 text-sm bg-white dark:bg-dark-border border border-gray-300 dark:border-dark-border rounded-md text-gray-700 dark:text-dark-text"
|
||||
>
|
||||
<option value="webgl-radial" className="bg-white dark:bg-slate-800 text-gray-700 dark:text-white">WebGL Radial (smooth)</option>
|
||||
<option value="webgl-texture" className="bg-white dark:bg-slate-800 text-gray-700 dark:text-white">WebGL Texture (fast)</option>
|
||||
<option value="canvas" className="bg-white dark:bg-slate-800 text-gray-700 dark:text-white">Canvas (fallback)</option>
|
||||
</select>
|
||||
</div>
|
||||
{coverageRenderer === 'canvas' && (
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-700 dark:text-dark-text">
|
||||
Heatmap Quality
|
||||
@@ -822,6 +926,7 @@ export default function App() {
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{/* Propagation Model Preset */}
|
||||
<div>
|
||||
<label className="text-sm font-medium text-gray-700 dark:text-dark-text">
|
||||
@@ -1098,15 +1203,15 @@ export default function App() {
|
||||
<label className="flex items-center gap-2 cursor-pointer text-sm text-gray-700 dark:text-dark-text">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={measurementMode}
|
||||
onChange={(e) => setMeasurementMode(e.target.checked)}
|
||||
checked={activeTool === 'ruler'}
|
||||
onChange={(e) => e.target.checked ? setActiveTool('ruler') : clearTool()}
|
||||
className="w-4 h-4 rounded border-gray-300 dark:border-dark-border accent-orange-600"
|
||||
/>
|
||||
Distance Measurement
|
||||
</label>
|
||||
{measurementMode && (
|
||||
{activeTool === 'ruler' && (
|
||||
<p className="text-xs text-gray-400 dark:text-dark-muted pl-6">
|
||||
Click to add points. Right-click to finish.
|
||||
Click start and end points. Esc to cancel.
|
||||
</p>
|
||||
)}
|
||||
<label className="flex items-center gap-2 cursor-pointer text-sm text-gray-700 dark:text-dark-text">
|
||||
@@ -1140,7 +1245,7 @@ export default function App() {
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Data Cache Status */}
|
||||
|
||||
@@ -45,6 +45,12 @@ export default function ElevationLayer({ visible, opacity }: ElevationLayerProps
|
||||
const debounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);
|
||||
const abortRef = useRef<AbortController | null>(null);
|
||||
const lastBoundsRef = useRef<string>('');
|
||||
const opacityRef = useRef(opacity);
|
||||
|
||||
// Keep opacity ref in sync
|
||||
useEffect(() => {
|
||||
opacityRef.current = opacity;
|
||||
}, [opacity]);
|
||||
|
||||
const removeOverlay = useCallback(() => {
|
||||
if (overlayRef.current) {
|
||||
@@ -119,21 +125,23 @@ export default function ElevationLayer({ visible, opacity }: ElevationLayerProps
|
||||
// Remove old overlay
|
||||
removeOverlay();
|
||||
|
||||
// Add new overlay
|
||||
// Add new overlay (opacity will be set by the dedicated effect)
|
||||
const leafletBounds = L.latLngBounds(
|
||||
[data.bbox.min_lat, data.bbox.min_lon],
|
||||
[data.bbox.max_lat, data.bbox.max_lon],
|
||||
);
|
||||
overlayRef.current = L.imageOverlay(canvas.toDataURL(), leafletBounds, {
|
||||
opacity,
|
||||
opacity: 0.5, // Default, will be updated by opacity effect
|
||||
interactive: false,
|
||||
zIndex: 97,
|
||||
});
|
||||
overlayRef.current.addTo(map);
|
||||
// Apply current opacity immediately using ref
|
||||
overlayRef.current.setOpacity(opacityRef.current);
|
||||
} catch (_e) {
|
||||
// Silently ignore fetch errors (network issues, aborts, etc.)
|
||||
}
|
||||
}, [map, opacity, removeOverlay]);
|
||||
}, [map, removeOverlay]);
|
||||
|
||||
// Update opacity on existing overlay
|
||||
useEffect(() => {
|
||||
|
||||
83
frontend/src/components/map/LinkBudgetOverlay.tsx
Normal file
83
frontend/src/components/map/LinkBudgetOverlay.tsx
Normal file
@@ -0,0 +1,83 @@
|
||||
/**
|
||||
* Link Budget Overlay
|
||||
*
|
||||
* Shows RX marker and dashed line from TX site to RX point.
|
||||
*/
|
||||
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Marker, Polyline } from 'react-leaflet';
|
||||
import L from 'leaflet';
|
||||
|
||||
interface LinkBudgetOverlayProps {
|
||||
txPoint: { lat: number; lon: number } | null;
|
||||
rxPoint: { lat: number; lon: number } | null;
|
||||
onRxDrag?: (lat: number, lon: number) => void;
|
||||
}
|
||||
|
||||
// Orange circle icon for RX marker
|
||||
const rxIcon = L.divIcon({
|
||||
className: 'rx-marker',
|
||||
html: '<div style="width: 14px; height: 14px; background: #f97316; border: 2px solid white; border-radius: 50%; box-shadow: 0 2px 4px rgba(0,0,0,0.3);"></div>',
|
||||
iconSize: [14, 14],
|
||||
iconAnchor: [7, 7],
|
||||
});
|
||||
|
||||
export default function LinkBudgetOverlay({ txPoint, rxPoint, onRxDrag }: LinkBudgetOverlayProps) {
|
||||
const [markerRef, setMarkerRef] = useState<L.Marker | null>(null);
|
||||
|
||||
// Handle drag events
|
||||
useEffect(() => {
|
||||
if (!markerRef || !onRxDrag) return;
|
||||
|
||||
const handleDrag = () => {
|
||||
const pos = markerRef.getLatLng();
|
||||
onRxDrag(pos.lat, pos.lng);
|
||||
};
|
||||
|
||||
markerRef.on('drag', handleDrag);
|
||||
markerRef.on('dragend', handleDrag);
|
||||
|
||||
return () => {
|
||||
markerRef.off('drag', handleDrag);
|
||||
markerRef.off('dragend', handleDrag);
|
||||
};
|
||||
}, [markerRef, onRxDrag]);
|
||||
|
||||
if (!rxPoint) return null;
|
||||
|
||||
const rxLatLng: [number, number] = [rxPoint.lat, rxPoint.lon];
|
||||
const txLatLng: [number, number] | null = txPoint ? [txPoint.lat, txPoint.lon] : null;
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Dashed line from TX to RX */}
|
||||
{txLatLng && (
|
||||
<Polyline
|
||||
positions={[txLatLng, rxLatLng]}
|
||||
pathOptions={{
|
||||
color: '#f97316',
|
||||
weight: 2,
|
||||
dashArray: '8, 4',
|
||||
opacity: 0.8,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* RX marker (draggable) */}
|
||||
<Marker
|
||||
position={rxLatLng}
|
||||
icon={rxIcon}
|
||||
draggable={!!onRxDrag}
|
||||
ref={(ref) => setMarkerRef(ref)}
|
||||
eventHandlers={{
|
||||
dragend: (e) => {
|
||||
if (onRxDrag) {
|
||||
const pos = e.target.getLatLng();
|
||||
onRxDrag(pos.lat, pos.lng);
|
||||
}
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,10 +1,12 @@
|
||||
import { useRef, useCallback, useEffect } from 'react';
|
||||
import { useRef, useCallback, useEffect, useState } from 'react';
|
||||
import { MapContainer, TileLayer, useMapEvents, useMap } from 'react-leaflet';
|
||||
import 'leaflet/dist/leaflet.css';
|
||||
import type { Map as LeafletMap } from 'leaflet';
|
||||
import L from 'leaflet';
|
||||
import type { Site } from '@/types/index.ts';
|
||||
import { useSitesStore } from '@/store/sites.ts';
|
||||
import { useSettingsStore } from '@/store/settings.ts';
|
||||
import { useToolStore } from '@/store/tools.ts';
|
||||
import { useToastStore } from '@/components/ui/Toast.tsx';
|
||||
import SiteMarker from './SiteMarker.tsx';
|
||||
import MapExtras from './MapExtras.tsx';
|
||||
@@ -14,23 +16,72 @@ import ElevationDisplay from './ElevationDisplay.tsx';
|
||||
import ElevationLayer from './ElevationLayer.tsx';
|
||||
|
||||
interface MapViewProps {
|
||||
onMapClick: (lat: number, lon: number) => void;
|
||||
onSitePlacement: (lat: number, lon: number) => void;
|
||||
onRxPlacement?: (lat: number, lon: number) => void;
|
||||
onEditSite: (site: Site) => void;
|
||||
onProfileRequest?: (start: [number, number], end: [number, number]) => void;
|
||||
showLinkBudget?: boolean;
|
||||
onToggleLinkBudget?: () => void;
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
|
||||
const SNAP_THRESHOLD_PX = 20;
|
||||
|
||||
/**
|
||||
* Unified map click handler that dispatches based on active tool
|
||||
*/
|
||||
function MapClickHandler({
|
||||
onMapClick,
|
||||
onSitePlacement,
|
||||
onRxPlacement,
|
||||
onRulerClick,
|
||||
sites,
|
||||
}: {
|
||||
onMapClick: (lat: number, lon: number) => void;
|
||||
onSitePlacement: (lat: number, lon: number) => void;
|
||||
onRxPlacement?: (lat: number, lon: number) => void;
|
||||
onRulerClick: (lat: number, lon: number) => void;
|
||||
sites: Site[];
|
||||
}) {
|
||||
const isPlacingMode = useSitesStore((s) => s.isPlacingMode);
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
const clearTool = useToolStore((s) => s.clearTool);
|
||||
const map = useMap();
|
||||
|
||||
useMapEvents({
|
||||
click: (e) => {
|
||||
if (isPlacingMode) {
|
||||
onMapClick(e.latlng.lat, e.latlng.lng);
|
||||
switch (activeTool) {
|
||||
case 'ruler':
|
||||
// Snap to nearest site if within threshold
|
||||
const clickPoint = map.latLngToContainerPoint(e.latlng);
|
||||
let snappedLat = e.latlng.lat;
|
||||
let snappedLon = e.latlng.lng;
|
||||
|
||||
for (const site of sites) {
|
||||
const sitePoint = map.latLngToContainerPoint(L.latLng(site.lat, site.lon));
|
||||
const pixelDist = clickPoint.distanceTo(sitePoint);
|
||||
if (pixelDist < SNAP_THRESHOLD_PX) {
|
||||
snappedLat = site.lat;
|
||||
snappedLon = site.lon;
|
||||
break;
|
||||
}
|
||||
}
|
||||
onRulerClick(snappedLat, snappedLon);
|
||||
break;
|
||||
|
||||
case 'rx-placement':
|
||||
if (onRxPlacement) {
|
||||
onRxPlacement(e.latlng.lat, e.latlng.lng);
|
||||
clearTool(); // Single click action
|
||||
}
|
||||
break;
|
||||
|
||||
case 'site-placement':
|
||||
onSitePlacement(e.latlng.lat, e.latlng.lng);
|
||||
clearTool(); // Single click action
|
||||
break;
|
||||
|
||||
case 'none':
|
||||
default:
|
||||
// No action on map click — just pan/zoom
|
||||
break;
|
||||
}
|
||||
},
|
||||
});
|
||||
@@ -38,6 +89,61 @@ function MapClickHandler({
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Component to apply cursor classes based on active tool
|
||||
*/
|
||||
function CursorManager() {
|
||||
const map = useMap();
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
|
||||
useEffect(() => {
|
||||
const container = map.getContainer();
|
||||
// Remove all tool cursors
|
||||
container.classList.remove('tool-ruler', 'tool-rx-placement', 'tool-site-placement');
|
||||
|
||||
switch (activeTool) {
|
||||
case 'ruler':
|
||||
container.classList.add('tool-ruler');
|
||||
break;
|
||||
case 'rx-placement':
|
||||
container.classList.add('tool-rx-placement');
|
||||
break;
|
||||
case 'site-placement':
|
||||
container.classList.add('tool-site-placement');
|
||||
break;
|
||||
default:
|
||||
// Default cursor (arrow)
|
||||
break;
|
||||
}
|
||||
}, [map, activeTool]);
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Right-click handler for ruler mode
|
||||
*/
|
||||
function RulerRightClickHandler({ onRightClick }: { onRightClick: () => void }) {
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
const map = useMap();
|
||||
|
||||
useEffect(() => {
|
||||
if (activeTool !== 'ruler') return;
|
||||
|
||||
const handleContextMenu = (e: L.LeafletMouseEvent) => {
|
||||
L.DomEvent.preventDefault(e.originalEvent);
|
||||
onRightClick();
|
||||
};
|
||||
|
||||
map.on('contextmenu', handleContextMenu);
|
||||
return () => {
|
||||
map.off('contextmenu', handleContextMenu);
|
||||
};
|
||||
}, [map, activeTool, onRightClick]);
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Inner component that exposes the map instance via ref callback
|
||||
*/
|
||||
@@ -49,23 +155,72 @@ function MapRefSetter({ mapRef }: { mapRef: React.MutableRefObject<LeafletMap |
|
||||
return null;
|
||||
}
|
||||
|
||||
export default function MapView({ onMapClick, onEditSite, onProfileRequest, children }: MapViewProps) {
|
||||
export default function MapView({ onSitePlacement, onRxPlacement, onEditSite, onProfileRequest, showLinkBudget, onToggleLinkBudget, children }: MapViewProps) {
|
||||
const sites = useSitesStore((s) => s.sites);
|
||||
const isPlacingMode = useSitesStore((s) => s.isPlacingMode);
|
||||
const showTerrain = useSettingsStore((s) => s.showTerrain);
|
||||
const terrainOpacity = useSettingsStore((s) => s.terrainOpacity);
|
||||
const setShowTerrain = useSettingsStore((s) => s.setShowTerrain);
|
||||
const showGrid = useSettingsStore((s) => s.showGrid);
|
||||
const setShowGrid = useSettingsStore((s) => s.setShowGrid);
|
||||
const measurementMode = useSettingsStore((s) => s.measurementMode);
|
||||
const setMeasurementMode = useSettingsStore((s) => s.setMeasurementMode);
|
||||
const showElevationInfo = useSettingsStore((s) => s.showElevationInfo);
|
||||
const showElevationOverlay = useSettingsStore((s) => s.showElevationOverlay);
|
||||
const setShowElevationOverlay = useSettingsStore((s) => s.setShowElevationOverlay);
|
||||
const elevationOpacity = useSettingsStore((s) => s.elevationOpacity);
|
||||
const addToast = useToastStore((s) => s.addToast);
|
||||
|
||||
// Tool store
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
const setActiveTool = useToolStore((s) => s.setActiveTool);
|
||||
const clearTool = useToolStore((s) => s.clearTool);
|
||||
|
||||
const mapRef = useRef<LeafletMap | null>(null);
|
||||
|
||||
// Ruler points state (managed here since MeasurementTool is now controlled by tool store)
|
||||
const [rulerPoints, setRulerPoints] = useState<[number, number][]>([]);
|
||||
|
||||
// Ruler limited to exactly 2 points (point-to-point measurement)
|
||||
const handleRulerClick = useCallback((lat: number, lon: number) => {
|
||||
setRulerPoints(prev => {
|
||||
if (prev.length === 0) {
|
||||
// First point
|
||||
return [[lat, lon]];
|
||||
} else if (prev.length === 1) {
|
||||
// Second point — measurement complete
|
||||
return [prev[0], [lat, lon]];
|
||||
} else {
|
||||
// Already 2 points — start new measurement
|
||||
return [[lat, lon]];
|
||||
}
|
||||
});
|
||||
}, []);
|
||||
|
||||
const handleRulerRightClick = useCallback(() => {
|
||||
if (rulerPoints.length >= 2) {
|
||||
// Calculate total distance
|
||||
let total = 0;
|
||||
for (let i = 1; i < rulerPoints.length; i++) {
|
||||
const [lat1, lon1] = rulerPoints[i - 1];
|
||||
const [lat2, lon2] = rulerPoints[i];
|
||||
const R = 6371;
|
||||
const dLat = ((lat2 - lat1) * Math.PI) / 180;
|
||||
const dLon = ((lon2 - lon1) * Math.PI) / 180;
|
||||
const a = Math.sin(dLat / 2) ** 2 +
|
||||
Math.cos((lat1 * Math.PI) / 180) * Math.cos((lat2 * Math.PI) / 180) * Math.sin(dLon / 2) ** 2;
|
||||
total += R * 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
|
||||
}
|
||||
addToast(`Distance: ${total.toFixed(2)} km (${(total * 1000).toFixed(0)} m)`, 'info');
|
||||
}
|
||||
setRulerPoints([]);
|
||||
clearTool();
|
||||
}, [rulerPoints, addToast, clearTool]);
|
||||
|
||||
// Clear ruler points when tool changes away from ruler
|
||||
useEffect(() => {
|
||||
if (activeTool !== 'ruler') {
|
||||
setRulerPoints([]);
|
||||
}
|
||||
}, [activeTool]);
|
||||
|
||||
const handleFitToSites = useCallback(() => {
|
||||
if (sites.length === 0 || !mapRef.current) return;
|
||||
const bounds = sites.map((site) => [site.lat, site.lon] as [number, number]);
|
||||
@@ -76,14 +231,24 @@ export default function MapView({ onMapClick, onEditSite, onProfileRequest, chil
|
||||
mapRef.current?.setView([48.4, 35.0], 7);
|
||||
}, []);
|
||||
|
||||
// Toggle ruler tool
|
||||
const handleRulerToggle = useCallback(() => {
|
||||
if (activeTool === 'ruler') {
|
||||
clearTool();
|
||||
} else {
|
||||
setActiveTool('ruler');
|
||||
}
|
||||
}, [activeTool, setActiveTool, clearTool]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<MapContainer
|
||||
center={[48.4, 35.0]}
|
||||
zoom={7}
|
||||
className={`w-full h-full ${isPlacingMode ? 'cursor-crosshair' : ''}`}
|
||||
className="w-full h-full"
|
||||
>
|
||||
<MapRefSetter mapRef={mapRef} />
|
||||
<CursorManager />
|
||||
{/* Base OSM layer */}
|
||||
<TileLayer
|
||||
attribution='© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||
@@ -100,16 +265,21 @@ export default function MapView({ onMapClick, onEditSite, onProfileRequest, chil
|
||||
)}
|
||||
{/* Elevation color overlay from SRTM terrain data */}
|
||||
<ElevationLayer visible={showElevationOverlay} opacity={elevationOpacity} />
|
||||
<MapClickHandler onMapClick={onMapClick} />
|
||||
{/* Unified click handler */}
|
||||
<MapClickHandler
|
||||
onSitePlacement={onSitePlacement}
|
||||
onRxPlacement={onRxPlacement}
|
||||
onRulerClick={handleRulerClick}
|
||||
sites={sites}
|
||||
/>
|
||||
{/* Right-click handler for ruler */}
|
||||
<RulerRightClickHandler onRightClick={handleRulerRightClick} />
|
||||
<MapExtras />
|
||||
{showElevationInfo && <ElevationDisplay />}
|
||||
<CoordinateGrid visible={showGrid} />
|
||||
{/* Ruler visualization (only points and line, no click handling) */}
|
||||
<MeasurementTool
|
||||
enabled={measurementMode}
|
||||
onComplete={(distKm) => {
|
||||
addToast(`Distance: ${distKm.toFixed(2)} km (${(distKm * 1000).toFixed(0)} m)`, 'info');
|
||||
setMeasurementMode(false);
|
||||
}}
|
||||
points={rulerPoints}
|
||||
onProfileRequest={onProfileRequest}
|
||||
/>
|
||||
{sites
|
||||
@@ -163,12 +333,12 @@ export default function MapView({ onMapClick, onEditSite, onProfileRequest, chil
|
||||
Grid
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setMeasurementMode(!measurementMode)}
|
||||
onClick={handleRulerToggle}
|
||||
className={`bg-white dark:bg-dark-surface shadow-lg rounded px-3 py-2 text-sm
|
||||
hover:bg-gray-50 dark:hover:bg-dark-border transition-colors
|
||||
text-gray-700 dark:text-dark-text min-h-[36px]
|
||||
${measurementMode ? 'ring-2 ring-orange-500' : ''}`}
|
||||
title={measurementMode ? 'Exit measurement mode' : 'Measure distance (click points, right-click to finish)'}
|
||||
${activeTool === 'ruler' ? 'ring-2 ring-orange-500' : ''}`}
|
||||
title={activeTool === 'ruler' ? 'Exit measurement mode' : 'Measure point-to-point distance'}
|
||||
>
|
||||
Ruler
|
||||
</button>
|
||||
@@ -182,6 +352,18 @@ export default function MapView({ onMapClick, onEditSite, onProfileRequest, chil
|
||||
>
|
||||
Elev
|
||||
</button>
|
||||
{onToggleLinkBudget && (
|
||||
<button
|
||||
onClick={onToggleLinkBudget}
|
||||
className={`bg-white dark:bg-dark-surface shadow-lg rounded px-3 py-2 text-sm
|
||||
hover:bg-gray-50 dark:hover:bg-dark-border transition-colors
|
||||
text-gray-700 dark:text-dark-text min-h-[36px]
|
||||
${showLinkBudget ? 'ring-2 ring-purple-500' : ''}`}
|
||||
title={showLinkBudget ? 'Close Link Budget Calculator' : 'Open Link Budget Calculator'}
|
||||
>
|
||||
LB
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
||||
@@ -1,10 +1,16 @@
|
||||
import { useEffect, useRef, useState } from 'react';
|
||||
import { useMap, Polyline, Marker } from 'react-leaflet';
|
||||
/**
|
||||
* Ruler/Measurement Tool Visualization
|
||||
*
|
||||
* Pure visualization component - receives points from parent,
|
||||
* click handling is done by the centralized MapClickHandler.
|
||||
*/
|
||||
|
||||
import { useEffect, useRef } from 'react';
|
||||
import { Polyline, Marker } from 'react-leaflet';
|
||||
import L from 'leaflet';
|
||||
|
||||
interface MeasurementToolProps {
|
||||
enabled: boolean;
|
||||
onComplete?: (distanceKm: number) => void;
|
||||
points: [number, number][];
|
||||
onProfileRequest?: (start: [number, number], end: [number, number]) => void;
|
||||
}
|
||||
|
||||
@@ -40,50 +46,18 @@ const dotIcon = L.divIcon({
|
||||
html: '<div style="width:10px;height:10px;background:white;border:2px solid #333;border-radius:50%;"></div>',
|
||||
});
|
||||
|
||||
export default function MeasurementTool({ enabled, onComplete, onProfileRequest }: MeasurementToolProps) {
|
||||
const map = useMap();
|
||||
const [points, setPoints] = useState<[number, number][]>([]);
|
||||
const pointsRef = useRef(points);
|
||||
useEffect(() => {
|
||||
pointsRef.current = points;
|
||||
}, [points]);
|
||||
export default function MeasurementTool({ points, onProfileRequest }: MeasurementToolProps) {
|
||||
const overlayRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// Clear on disable
|
||||
/* eslint-disable react-hooks/set-state-in-effect */
|
||||
// Use Leaflet's DOM event utility to block click propagation to the map
|
||||
useEffect(() => {
|
||||
if (!enabled) {
|
||||
setPoints([]);
|
||||
if (overlayRef.current) {
|
||||
L.DomEvent.disableClickPropagation(overlayRef.current);
|
||||
L.DomEvent.disableScrollPropagation(overlayRef.current);
|
||||
}
|
||||
}, [enabled]);
|
||||
/* eslint-enable react-hooks/set-state-in-effect */
|
||||
}, [points.length]); // Re-run when overlay appears/disappears
|
||||
|
||||
// Click handler: add measurement point
|
||||
useEffect(() => {
|
||||
if (!enabled) return;
|
||||
|
||||
const handleClick = (e: L.LeafletMouseEvent) => {
|
||||
setPoints((prev) => [...prev, [e.latlng.lat, e.latlng.lng]]);
|
||||
};
|
||||
|
||||
const handleRightClick = (e: L.LeafletMouseEvent) => {
|
||||
L.DomEvent.preventDefault(e.originalEvent);
|
||||
const pts = pointsRef.current;
|
||||
if (pts.length >= 2 && onComplete) {
|
||||
onComplete(totalDistance(pts));
|
||||
}
|
||||
setPoints([]);
|
||||
};
|
||||
|
||||
map.on('click', handleClick);
|
||||
map.on('contextmenu', handleRightClick);
|
||||
|
||||
return () => {
|
||||
map.off('click', handleClick);
|
||||
map.off('contextmenu', handleRightClick);
|
||||
};
|
||||
}, [map, enabled, onComplete]);
|
||||
|
||||
if (!enabled || points.length === 0) return null;
|
||||
if (points.length === 0) return null;
|
||||
|
||||
const dist = totalDistance(points);
|
||||
|
||||
@@ -100,6 +74,7 @@ export default function MeasurementTool({ enabled, onComplete, onProfileRequest
|
||||
))}
|
||||
{dist > 0 && (
|
||||
<div
|
||||
ref={overlayRef}
|
||||
style={{
|
||||
position: 'absolute',
|
||||
top: '10px',
|
||||
@@ -110,7 +85,6 @@ export default function MeasurementTool({ enabled, onComplete, onProfileRequest
|
||||
padding: '6px 14px',
|
||||
borderRadius: '6px',
|
||||
zIndex: 2000,
|
||||
pointerEvents: 'none',
|
||||
fontSize: '13px',
|
||||
fontWeight: 600,
|
||||
letterSpacing: '0.3px',
|
||||
@@ -119,11 +93,7 @@ export default function MeasurementTool({ enabled, onComplete, onProfileRequest
|
||||
Distance: {dist.toFixed(2)} km ({(dist * 1000).toFixed(0)} m)
|
||||
{points.length >= 2 && onProfileRequest && (
|
||||
<button
|
||||
onClick={(e) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
onProfileRequest(points[0], points[points.length - 1]);
|
||||
}}
|
||||
onClick={() => onProfileRequest(points[0], points[points.length - 1])}
|
||||
style={{
|
||||
marginLeft: 10,
|
||||
background: 'rgba(255,255,255,0.15)',
|
||||
@@ -133,7 +103,6 @@ export default function MeasurementTool({ enabled, onComplete, onProfileRequest
|
||||
borderRadius: 4,
|
||||
cursor: 'pointer',
|
||||
fontSize: 11,
|
||||
pointerEvents: 'auto',
|
||||
}}
|
||||
>
|
||||
Terrain Profile
|
||||
|
||||
@@ -1,51 +1,77 @@
|
||||
/**
|
||||
* Canvas-based terrain elevation profile viewer.
|
||||
* Canvas-based terrain elevation profile viewer with Fresnel zone visualization.
|
||||
*
|
||||
* Shows elevation cross-section between two geographic points with:
|
||||
* - Green filled terrain area
|
||||
* - Dashed red LOS line from start to end
|
||||
* - Optional Fresnel zone ellipse (light blue)
|
||||
* - Red highlighting where terrain intrudes Fresnel zone
|
||||
* - Hover tooltip with elevation/distance at cursor
|
||||
* - Stats bar: total distance, min/max elevation
|
||||
* - Stats bar: total distance, min/max elevation, Fresnel status
|
||||
*/
|
||||
|
||||
import { useEffect, useRef, useState, useCallback } from 'react';
|
||||
import L from 'leaflet';
|
||||
import { api } from '@/services/api.ts';
|
||||
import type { TerrainProfilePoint } from '@/services/api.ts';
|
||||
import type { FresnelProfileResponse } from '@/services/api.ts';
|
||||
|
||||
interface TerrainProfileProps {
|
||||
start: [number, number]; // [lat, lon]
|
||||
end: [number, number]; // [lat, lon]
|
||||
txHeight?: number; // TX antenna height (m)
|
||||
rxHeight?: number; // RX antenna height (m)
|
||||
frequency?: number; // Frequency (MHz) for Fresnel calculation
|
||||
onClose: () => void;
|
||||
}
|
||||
|
||||
const CANVAS_W = 600;
|
||||
const CANVAS_H = 200;
|
||||
const CANVAS_H = 220;
|
||||
const PAD = { top: 20, right: 20, bottom: 30, left: 50 };
|
||||
const PLOT_W = CANVAS_W - PAD.left - PAD.right;
|
||||
const PLOT_H = CANVAS_H - PAD.top - PAD.bottom;
|
||||
|
||||
export default function TerrainProfile({ start, end, onClose }: TerrainProfileProps) {
|
||||
export default function TerrainProfile({
|
||||
start,
|
||||
end,
|
||||
txHeight = 30,
|
||||
rxHeight = 1.5,
|
||||
frequency = 1800,
|
||||
onClose,
|
||||
}: TerrainProfileProps) {
|
||||
const canvasRef = useRef<HTMLCanvasElement>(null);
|
||||
const [profile, setProfile] = useState<TerrainProfilePoint[] | null>(null);
|
||||
const [fresnelData, setFresnelData] = useState<FresnelProfileResponse | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [hover, setHover] = useState<{ x: number; idx: number } | null>(null);
|
||||
const [showFresnel, setShowFresnel] = useState(true);
|
||||
|
||||
// Fetch profile data
|
||||
// Fetch Fresnel profile data (includes terrain)
|
||||
useEffect(() => {
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
api
|
||||
.getTerrainProfile(start[0], start[1], end[0], end[1], 200)
|
||||
.then((data) => {
|
||||
setProfile(data);
|
||||
.getFresnelProfile({
|
||||
tx_lat: start[0],
|
||||
tx_lon: start[1],
|
||||
tx_height_m: txHeight,
|
||||
rx_lat: end[0],
|
||||
rx_lon: end[1],
|
||||
rx_height_m: rxHeight,
|
||||
frequency_mhz: frequency,
|
||||
num_points: 200,
|
||||
})
|
||||
.then((data: FresnelProfileResponse) => {
|
||||
setFresnelData(data);
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((err) => {
|
||||
.catch((err: Error) => {
|
||||
setError(err.message);
|
||||
setLoading(false);
|
||||
});
|
||||
}, [start, end]);
|
||||
}, [start, end, txHeight, rxHeight, frequency]);
|
||||
|
||||
const profile = fresnelData?.profile;
|
||||
|
||||
// Draw chart
|
||||
const draw = useCallback(
|
||||
@@ -64,16 +90,24 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
// Clear
|
||||
ctx.clearRect(0, 0, CANVAS_W, CANVAS_H);
|
||||
|
||||
const elevations = profile.map((p) => p.elevation);
|
||||
const terrainElevs = profile.map((p) => p.terrain_elevation);
|
||||
const losHeights = profile.map((p) => p.los_height);
|
||||
const fresnelTops = profile.map((p) => p.fresnel_top);
|
||||
const fresnelBottoms = profile.map((p) => p.fresnel_bottom);
|
||||
const distances = profile.map((p) => p.distance);
|
||||
const minElev = Math.min(...elevations);
|
||||
const maxElev = Math.max(...elevations);
|
||||
|
||||
// Calculate bounds including Fresnel zone
|
||||
const allHeights = showFresnel
|
||||
? [...terrainElevs, ...fresnelTops, ...fresnelBottoms]
|
||||
: [...terrainElevs, ...losHeights];
|
||||
const minElev = Math.min(...allHeights);
|
||||
const maxElev = Math.max(...allHeights);
|
||||
const maxDist = distances[distances.length - 1] || 1;
|
||||
|
||||
// Add 10% padding to elevation range
|
||||
const elevRange = maxElev - minElev || 1;
|
||||
const eMin = minElev - elevRange * 0.1;
|
||||
const eMax = maxElev + elevRange * 0.1;
|
||||
const eMax = maxElev + elevRange * 0.15;
|
||||
|
||||
const xScale = (d: number) => PAD.left + (d / maxDist) * PLOT_W;
|
||||
const yScale = (e: number) => PAD.top + PLOT_H - ((e - eMin) / (eMax - eMin)) * PLOT_H;
|
||||
@@ -90,11 +124,48 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
// Fresnel zone fill (light blue)
|
||||
if (showFresnel) {
|
||||
ctx.beginPath();
|
||||
// Top boundary (left to right)
|
||||
ctx.moveTo(xScale(distances[0]), yScale(fresnelTops[0]));
|
||||
for (let i = 1; i < profile.length; i++) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(fresnelTops[i]));
|
||||
}
|
||||
// Bottom boundary (right to left)
|
||||
for (let i = profile.length - 1; i >= 0; i--) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(fresnelBottoms[i]));
|
||||
}
|
||||
ctx.closePath();
|
||||
ctx.fillStyle = 'rgba(59, 130, 246, 0.15)';
|
||||
ctx.fill();
|
||||
|
||||
// Fresnel boundaries (dashed)
|
||||
ctx.setLineDash([3, 3]);
|
||||
ctx.strokeStyle = 'rgba(59, 130, 246, 0.4)';
|
||||
ctx.lineWidth = 1;
|
||||
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(xScale(distances[0]), yScale(fresnelTops[0]));
|
||||
for (let i = 1; i < profile.length; i++) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(fresnelTops[i]));
|
||||
}
|
||||
ctx.stroke();
|
||||
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(xScale(distances[0]), yScale(fresnelBottoms[0]));
|
||||
for (let i = 1; i < profile.length; i++) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(fresnelBottoms[i]));
|
||||
}
|
||||
ctx.stroke();
|
||||
ctx.setLineDash([]);
|
||||
}
|
||||
|
||||
// Terrain fill
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(xScale(distances[0]), yScale(elevations[0]));
|
||||
ctx.moveTo(xScale(distances[0]), yScale(terrainElevs[0]));
|
||||
for (let i = 1; i < profile.length; i++) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(elevations[i]));
|
||||
ctx.lineTo(xScale(distances[i]), yScale(terrainElevs[i]));
|
||||
}
|
||||
ctx.lineTo(xScale(distances[distances.length - 1]), PAD.top + PLOT_H);
|
||||
ctx.lineTo(xScale(distances[0]), PAD.top + PLOT_H);
|
||||
@@ -102,25 +173,39 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
ctx.fillStyle = 'rgba(34, 197, 94, 0.3)';
|
||||
ctx.fill();
|
||||
|
||||
// Highlight Fresnel intrusions (red fill)
|
||||
if (showFresnel) {
|
||||
for (let i = 0; i < profile.length; i++) {
|
||||
if (profile[i].clearance < 0) {
|
||||
const x = xScale(distances[i]);
|
||||
const yTerrain = yScale(terrainElevs[i]);
|
||||
const yFresnel = yScale(fresnelBottoms[i]);
|
||||
const intrusion = Math.min(yFresnel - yTerrain, 20);
|
||||
if (intrusion > 0) {
|
||||
ctx.fillStyle = 'rgba(239, 68, 68, 0.4)';
|
||||
ctx.fillRect(x - 1, yTerrain, 3, intrusion);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Terrain line
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(xScale(distances[0]), yScale(elevations[0]));
|
||||
ctx.moveTo(xScale(distances[0]), yScale(terrainElevs[0]));
|
||||
for (let i = 1; i < profile.length; i++) {
|
||||
ctx.lineTo(xScale(distances[i]), yScale(elevations[i]));
|
||||
ctx.lineTo(xScale(distances[i]), yScale(terrainElevs[i]));
|
||||
}
|
||||
ctx.strokeStyle = '#16a34a';
|
||||
ctx.lineWidth = 1.5;
|
||||
ctx.stroke();
|
||||
|
||||
// LOS dashed line (start elevation to end elevation)
|
||||
// LOS line (solid)
|
||||
ctx.beginPath();
|
||||
ctx.setLineDash([6, 4]);
|
||||
ctx.moveTo(xScale(distances[0]), yScale(elevations[0]));
|
||||
ctx.lineTo(xScale(distances[distances.length - 1]), yScale(elevations[elevations.length - 1]));
|
||||
ctx.moveTo(xScale(distances[0]), yScale(losHeights[0]));
|
||||
ctx.lineTo(xScale(distances[distances.length - 1]), yScale(losHeights[losHeights.length - 1]));
|
||||
ctx.strokeStyle = '#ef4444';
|
||||
ctx.lineWidth = 1.5;
|
||||
ctx.stroke();
|
||||
ctx.setLineDash([]);
|
||||
|
||||
// Y axis labels
|
||||
ctx.fillStyle = '#6b7280';
|
||||
@@ -147,7 +232,7 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
if (hoverIdx !== null && hoverIdx >= 0 && hoverIdx < profile.length) {
|
||||
const p = profile[hoverIdx];
|
||||
const hx = xScale(p.distance);
|
||||
const hy = yScale(p.elevation);
|
||||
const hy = yScale(p.terrain_elevation);
|
||||
|
||||
// Vertical line
|
||||
ctx.beginPath();
|
||||
@@ -157,14 +242,15 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
ctx.lineWidth = 1;
|
||||
ctx.stroke();
|
||||
|
||||
// Dot
|
||||
// Dot on terrain
|
||||
ctx.beginPath();
|
||||
ctx.arc(hx, hy, 4, 0, Math.PI * 2);
|
||||
ctx.fillStyle = '#2563eb';
|
||||
ctx.fill();
|
||||
|
||||
// Tooltip
|
||||
const text = `${Math.round(p.elevation)}m @ ${(p.distance / 1000).toFixed(2)}km`;
|
||||
// Tooltip with clearance info
|
||||
const clearanceText = showFresnel ? ` | F1: ${p.clearance >= 0 ? '+' : ''}${p.clearance.toFixed(0)}m` : '';
|
||||
const text = `${Math.round(p.terrain_elevation)}m @ ${(p.distance / 1000).toFixed(2)}km${clearanceText}`;
|
||||
ctx.font = 'bold 11px monospace';
|
||||
const tw = ctx.measureText(text).width + 10;
|
||||
const tx = Math.min(hx + 8, CANVAS_W - tw - 4);
|
||||
@@ -173,13 +259,13 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
ctx.beginPath();
|
||||
ctx.roundRect(tx, ty, tw, 18, 3);
|
||||
ctx.fill();
|
||||
ctx.fillStyle = 'white';
|
||||
ctx.fillStyle = p.clearance < 0 && showFresnel ? '#fca5a5' : 'white';
|
||||
ctx.textAlign = 'left';
|
||||
ctx.textBaseline = 'middle';
|
||||
ctx.fillText(text, tx + 5, ty + 9);
|
||||
}
|
||||
},
|
||||
[profile]
|
||||
[profile, showFresnel]
|
||||
);
|
||||
|
||||
// Re-draw on profile load or hover change
|
||||
@@ -210,12 +296,40 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
const handleMouseLeave = useCallback(() => setHover(null), []);
|
||||
|
||||
// Stats
|
||||
const minElev = profile ? Math.min(...profile.map((p) => p.elevation)) : 0;
|
||||
const maxElev = profile ? Math.max(...profile.map((p) => p.elevation)) : 0;
|
||||
const totalDist = profile && profile.length > 0 ? profile[profile.length - 1].distance : 0;
|
||||
const minElev = profile ? Math.min(...profile.map((p) => p.terrain_elevation)) : 0;
|
||||
const maxElev = profile ? Math.max(...profile.map((p) => p.terrain_elevation)) : 0;
|
||||
const totalDist = fresnelData?.total_distance_m ?? 0;
|
||||
|
||||
// Status badge
|
||||
const getStatusBadge = () => {
|
||||
if (!fresnelData) return null;
|
||||
if (fresnelData.los_clear && fresnelData.fresnel_clear) {
|
||||
return <span className="text-green-600 dark:text-green-400 font-medium">LOS Clear</span>;
|
||||
} else if (fresnelData.los_clear) {
|
||||
return (
|
||||
<span className="text-yellow-600 dark:text-yellow-400 font-medium">
|
||||
F1 {fresnelData.fresnel_clear_pct}% Clear
|
||||
</span>
|
||||
);
|
||||
} else {
|
||||
return <span className="text-red-500 font-medium">LOS Blocked</span>;
|
||||
}
|
||||
};
|
||||
|
||||
// Ref for the container to block Leaflet events
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// Use Leaflet's DOM event utility to block click propagation to the map
|
||||
useEffect(() => {
|
||||
if (containerRef.current) {
|
||||
L.DomEvent.disableClickPropagation(containerRef.current);
|
||||
L.DomEvent.disableScrollPropagation(containerRef.current);
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div
|
||||
ref={containerRef}
|
||||
className="absolute bottom-6 left-1/2 -translate-x-1/2 z-[1500]
|
||||
bg-white dark:bg-dark-surface rounded-lg shadow-xl border border-gray-200 dark:border-dark-border
|
||||
overflow-hidden"
|
||||
@@ -223,9 +337,20 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
>
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between px-3 py-2 border-b border-gray-100 dark:border-dark-border">
|
||||
<span className="text-xs font-semibold text-gray-700 dark:text-dark-text">
|
||||
Terrain Profile
|
||||
</span>
|
||||
<div className="flex items-center gap-3">
|
||||
<span className="text-xs font-semibold text-gray-700 dark:text-dark-text">
|
||||
Terrain Profile
|
||||
</span>
|
||||
<label className="flex items-center gap-1.5 text-[10px] text-gray-500 cursor-pointer">
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={showFresnel}
|
||||
onChange={(e) => setShowFresnel(e.target.checked)}
|
||||
className="w-3 h-3"
|
||||
/>
|
||||
Fresnel Zone ({frequency} MHz)
|
||||
</label>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-gray-400 hover:text-gray-600 dark:hover:text-white text-sm w-6 h-6 flex items-center justify-center rounded hover:bg-gray-100 dark:hover:bg-dark-border"
|
||||
@@ -237,12 +362,12 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
{/* Canvas */}
|
||||
<div className="px-2 py-1">
|
||||
{loading && (
|
||||
<div className="flex items-center justify-center h-[200px] text-sm text-gray-400">
|
||||
<div className="flex items-center justify-center h-[220px] text-sm text-gray-400">
|
||||
Loading profile...
|
||||
</div>
|
||||
)}
|
||||
{error && (
|
||||
<div className="flex items-center justify-center h-[200px] text-sm text-red-400">
|
||||
<div className="flex items-center justify-center h-[220px] text-sm text-red-400">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
@@ -262,9 +387,17 @@ export default function TerrainProfile({ start, end, onClose }: TerrainProfilePr
|
||||
<span>Distance: {(totalDist / 1000).toFixed(2)} km</span>
|
||||
<span>Min: {Math.round(minElev)} m</span>
|
||||
<span>Max: {Math.round(maxElev)} m</span>
|
||||
<span>
|
||||
LOS: {profile[0].elevation <= profile[profile.length - 1].elevation ? 'Uphill' : 'Downhill'}
|
||||
</span>
|
||||
{showFresnel && fresnelData && (
|
||||
<span>Clearance: {fresnelData.worst_clearance_m.toFixed(0)} m</span>
|
||||
)}
|
||||
{getStatusBadge()}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Recommendation */}
|
||||
{showFresnel && fresnelData && !fresnelData.fresnel_clear && (
|
||||
<div className="px-3 py-1.5 text-[10px] bg-yellow-50 dark:bg-yellow-900/20 text-yellow-700 dark:text-yellow-300 border-t border-yellow-200 dark:border-yellow-800">
|
||||
{fresnelData.recommendation} (~{fresnelData.estimated_loss_db.toFixed(1)} dB loss)
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
669
frontend/src/components/map/WebGLCoverageLayer.tsx
Normal file
669
frontend/src/components/map/WebGLCoverageLayer.tsx
Normal file
@@ -0,0 +1,669 @@
|
||||
/**
|
||||
* WebGL coverage layer using texture-based value interpolation.
|
||||
*
|
||||
* Simple approach (like CloudRF surface raster):
|
||||
* 1. Create texture where each pixel = one grid cell's RSRP value
|
||||
* 2. GPU's GL_LINEAR filtering interpolates between adjacent cells
|
||||
* 3. Fragment shader maps interpolated value to color gradient
|
||||
*/
|
||||
|
||||
import { useEffect, useRef, useMemo, useCallback } from 'react';
|
||||
import { useMap } from 'react-leaflet';
|
||||
|
||||
export interface CoveragePoint {
|
||||
lat: number;
|
||||
lon: number;
|
||||
rsrp: number;
|
||||
}
|
||||
|
||||
interface WebGLCoverageLayerProps {
|
||||
points: CoveragePoint[];
|
||||
opacity: number;
|
||||
minRsrp?: number;
|
||||
maxRsrp?: number;
|
||||
visible: boolean;
|
||||
onWebGLFailed?: () => void;
|
||||
}
|
||||
|
||||
const VERTEX_SHADER = `
|
||||
attribute vec2 a_position;
|
||||
varying vec2 v_uv;
|
||||
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0.0, 1.0);
|
||||
// Map position to UV, flip Y
|
||||
v_uv = vec2((a_position.x + 1.0) * 0.5, 1.0 - (a_position.y + 1.0) * 0.5);
|
||||
}
|
||||
`;
|
||||
|
||||
// Fragment shader with smoothstep interpolation for C2 continuity
|
||||
// This removes visible grid edges with minimal performance cost
|
||||
const FRAGMENT_SHADER = `
|
||||
precision mediump float;
|
||||
|
||||
uniform sampler2D u_coverage;
|
||||
uniform vec2 u_textureSize;
|
||||
|
||||
varying vec2 v_uv;
|
||||
|
||||
// Quintic Hermite smoothstep - gives C2 continuity (smooth 2nd derivatives)
|
||||
// This removes visible "seams" between grid cells
|
||||
vec4 textureSmooth(sampler2D tex, vec2 uv, vec2 texSize) {
|
||||
vec2 p = uv * texSize + 0.5;
|
||||
vec2 i = floor(p);
|
||||
vec2 f = p - i;
|
||||
// Quintic hermite curve: f³(6f² - 15f + 10)
|
||||
f = f * f * f * (f * (f * 6.0 - 15.0) + 10.0);
|
||||
return texture2D(tex, (i + f - 0.5) / texSize);
|
||||
}
|
||||
|
||||
// RSRP to color gradient (red -> orange -> yellow -> green -> cyan)
|
||||
// Applied AFTER interpolation for clean gradients
|
||||
vec3 rsrpToColor(float t) {
|
||||
// t: 0 = weak (red), 1 = strong (cyan)
|
||||
if (t < 0.25) return mix(vec3(1.0, 0.0, 0.0), vec3(1.0, 0.5, 0.0), t / 0.25);
|
||||
if (t < 0.5) return mix(vec3(1.0, 0.5, 0.0), vec3(1.0, 1.0, 0.0), (t - 0.25) / 0.25);
|
||||
if (t < 0.75) return mix(vec3(1.0, 1.0, 0.0), vec3(0.0, 1.0, 0.0), (t - 0.5) / 0.25);
|
||||
return mix(vec3(0.0, 1.0, 0.0), vec3(0.0, 1.0, 1.0), (t - 0.75) / 0.25);
|
||||
}
|
||||
|
||||
void main() {
|
||||
// 1. Sample with smoothstep interpolation (RAW RSRP value)
|
||||
vec4 texel = textureSmooth(u_coverage, v_uv, u_textureSize);
|
||||
|
||||
// 2. Alpha channel indicates coverage presence
|
||||
if (texel.a < 0.1) discard;
|
||||
|
||||
// 3. Apply colormap AFTER interpolation (critical for clean gradients)
|
||||
float rsrp = texel.r;
|
||||
vec3 color = rsrpToColor(rsrp);
|
||||
|
||||
// 4. Smooth boundary fading
|
||||
float boundaryAlpha = smoothstep(0.01, 0.05, rsrp);
|
||||
|
||||
gl_FragColor = vec4(color, boundaryAlpha * 0.85);
|
||||
}
|
||||
`;
|
||||
|
||||
function compileShader(gl: WebGLRenderingContext, source: string, type: number): WebGLShader | null {
|
||||
const shader = gl.createShader(type);
|
||||
if (!shader) return null;
|
||||
gl.shaderSource(shader, source);
|
||||
gl.compileShader(shader);
|
||||
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
|
||||
console.error('Shader error:', gl.getShaderInfoLog(shader));
|
||||
gl.deleteShader(shader);
|
||||
return null;
|
||||
}
|
||||
return shader;
|
||||
}
|
||||
|
||||
function createProgram(gl: WebGLRenderingContext): WebGLProgram | null {
|
||||
const vs = compileShader(gl, VERTEX_SHADER, gl.VERTEX_SHADER);
|
||||
const fs = compileShader(gl, FRAGMENT_SHADER, gl.FRAGMENT_SHADER);
|
||||
if (!vs || !fs) return null;
|
||||
|
||||
const program = gl.createProgram();
|
||||
if (!program) return null;
|
||||
gl.attachShader(program, vs);
|
||||
gl.attachShader(program, fs);
|
||||
gl.linkProgram(program);
|
||||
|
||||
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
|
||||
console.error('Program error:', gl.getProgramInfoLog(program));
|
||||
return null;
|
||||
}
|
||||
return program;
|
||||
}
|
||||
|
||||
interface GridInfo {
|
||||
width: number;
|
||||
height: number;
|
||||
minLat: number;
|
||||
maxLat: number;
|
||||
minLon: number;
|
||||
maxLon: number;
|
||||
latStep: number;
|
||||
lonStep: number;
|
||||
}
|
||||
|
||||
function detectGrid(points: CoveragePoint[]): GridInfo | null {
|
||||
if (points.length < 4) return null;
|
||||
|
||||
// Calculate bounds directly from points (no rounding)
|
||||
let minLat = Infinity, maxLat = -Infinity;
|
||||
let minLon = Infinity, maxLon = -Infinity;
|
||||
|
||||
for (const p of points) {
|
||||
if (p.lat < minLat) minLat = p.lat;
|
||||
if (p.lat > maxLat) maxLat = p.lat;
|
||||
if (p.lon < minLon) minLon = p.lon;
|
||||
if (p.lon > maxLon) maxLon = p.lon;
|
||||
}
|
||||
|
||||
// Find grid step by looking at sorted unique coordinates
|
||||
const lats = new Set<number>();
|
||||
const lons = new Set<number>();
|
||||
for (const p of points) {
|
||||
lats.add(Math.round(p.lat * 1000000) / 1000000); // 6 decimal places
|
||||
lons.add(Math.round(p.lon * 1000000) / 1000000);
|
||||
}
|
||||
|
||||
const sortedLats = Array.from(lats).sort((a, b) => a - b);
|
||||
const sortedLons = Array.from(lons).sort((a, b) => a - b);
|
||||
|
||||
// Calculate step from median difference between adjacent points
|
||||
const latDiffs: number[] = [];
|
||||
const lonDiffs: number[] = [];
|
||||
for (let i = 1; i < sortedLats.length; i++) {
|
||||
latDiffs.push(sortedLats[i] - sortedLats[i-1]);
|
||||
}
|
||||
for (let i = 1; i < sortedLons.length; i++) {
|
||||
lonDiffs.push(sortedLons[i] - sortedLons[i-1]);
|
||||
}
|
||||
|
||||
latDiffs.sort((a, b) => a - b);
|
||||
lonDiffs.sort((a, b) => a - b);
|
||||
|
||||
const latStep = latDiffs[Math.floor(latDiffs.length / 2)] || (maxLat - minLat) / 10;
|
||||
const lonStep = lonDiffs[Math.floor(lonDiffs.length / 2)] || (maxLon - minLon) / 10;
|
||||
|
||||
// Calculate grid dimensions from actual extent and step
|
||||
const width = Math.max(2, Math.round((maxLon - minLon) / lonStep) + 1);
|
||||
const height = Math.max(2, Math.round((maxLat - minLat) / latStep) + 1);
|
||||
|
||||
return {
|
||||
width,
|
||||
height,
|
||||
minLat,
|
||||
maxLat,
|
||||
minLon,
|
||||
maxLon,
|
||||
latStep,
|
||||
lonStep,
|
||||
};
|
||||
}
|
||||
|
||||
interface TextureResult {
|
||||
texture: WebGLTexture;
|
||||
width: number;
|
||||
height: number;
|
||||
}
|
||||
|
||||
function createCoverageTexture(
|
||||
gl: WebGLRenderingContext,
|
||||
points: CoveragePoint[],
|
||||
grid: GridInfo,
|
||||
minRsrp: number,
|
||||
maxRsrp: number
|
||||
): TextureResult | null {
|
||||
const { width, height, minLat, maxLat, minLon, maxLon } = grid;
|
||||
|
||||
const latRange = maxLat - minLat;
|
||||
const lonRange = maxLon - minLon;
|
||||
const rsrpRange = maxRsrp - minRsrp;
|
||||
|
||||
// Step 1: Create sparse grid with actual point positions
|
||||
// Store normalized RSRP value (0-1) at each grid cell that has data
|
||||
const sparseGrid = new Map<number, number>(); // key = gy * width + gx, value = normalized RSRP
|
||||
|
||||
for (const p of points) {
|
||||
const gx = Math.round((p.lon - minLon) / lonRange * (width - 1));
|
||||
const gy = Math.round((p.lat - minLat) / latRange * (height - 1));
|
||||
|
||||
if (gx >= 0 && gx < width && gy >= 0 && gy < height) {
|
||||
const normalized = Math.max(0, Math.min(1, (p.rsrp - minRsrp) / rsrpRange));
|
||||
const key = gy * width + gx;
|
||||
// Keep the stronger signal if multiple points map to same cell
|
||||
if (!sparseGrid.has(key) || sparseGrid.get(key)! < normalized) {
|
||||
sparseGrid.set(key, normalized);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Step 2: For each empty cell, find nearest filled cell using expanding search
|
||||
// This fills the circular coverage area properly
|
||||
const data = new Uint8Array(width * height * 4);
|
||||
const maxSearchRadius = Math.max(width, height); // Max distance to search
|
||||
let filledCount = 0;
|
||||
|
||||
for (let gy = 0; gy < height; gy++) {
|
||||
for (let gx = 0; gx < width; gx++) {
|
||||
const key = gy * width + gx;
|
||||
|
||||
if (sparseGrid.has(key)) {
|
||||
// Cell has actual data
|
||||
const value = Math.round(sparseGrid.get(key)! * 255);
|
||||
const idx = key * 4;
|
||||
data[idx] = value;
|
||||
data[idx + 1] = 0;
|
||||
data[idx + 2] = 0;
|
||||
data[idx + 3] = 255;
|
||||
filledCount++;
|
||||
} else {
|
||||
// Find nearest cell with data using expanding square search
|
||||
let found = false;
|
||||
let nearestValue = 0;
|
||||
let nearestDistSq = Infinity;
|
||||
|
||||
// Search in expanding radius
|
||||
for (let r = 1; r <= maxSearchRadius && !found; r++) {
|
||||
// Check cells at distance r (square perimeter)
|
||||
for (let dy = -r; dy <= r && !found; dy++) {
|
||||
for (let dx = -r; dx <= r; dx++) {
|
||||
// Only check perimeter cells (optimization)
|
||||
if (Math.abs(dx) !== r && Math.abs(dy) !== r) continue;
|
||||
|
||||
const nx = gx + dx;
|
||||
const ny = gy + dy;
|
||||
if (nx < 0 || nx >= width || ny < 0 || ny >= height) continue;
|
||||
|
||||
const nkey = ny * width + nx;
|
||||
if (sparseGrid.has(nkey)) {
|
||||
const distSq = dx * dx + dy * dy;
|
||||
if (distSq < nearestDistSq) {
|
||||
nearestDistSq = distSq;
|
||||
nearestValue = sparseGrid.get(nkey)!;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// If we found something at this radius, use it (nearest neighbor)
|
||||
if (nearestDistSq < Infinity) {
|
||||
found = true;
|
||||
}
|
||||
}
|
||||
|
||||
if (found) {
|
||||
// Fill with nearest neighbor value
|
||||
// Apply distance-based alpha fade for smooth edges
|
||||
const dist = Math.sqrt(nearestDistSq);
|
||||
const maxDist = 3; // Fade out over 3 cells
|
||||
const alpha = dist <= maxDist ? 255 : Math.max(0, 255 - (dist - maxDist) * 50);
|
||||
|
||||
const value = Math.round(nearestValue * 255);
|
||||
const idx = key * 4;
|
||||
data[idx] = value;
|
||||
data[idx + 1] = 0;
|
||||
data[idx + 2] = 0;
|
||||
data[idx + 3] = Math.round(alpha);
|
||||
filledCount++;
|
||||
}
|
||||
// If not found, leave as transparent (alpha = 0)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
console.log('[WebGL] Texture created (nearest-neighbor filled):', {
|
||||
textureSize: `${width}x${height}`,
|
||||
originalPoints: sparseGrid.size,
|
||||
filledCells: filledCount,
|
||||
totalCells: width * height,
|
||||
fillPercent: (filledCount / (width * height) * 100).toFixed(1) + '%'
|
||||
});
|
||||
|
||||
const texture = gl.createTexture();
|
||||
if (!texture) return null;
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, data);
|
||||
|
||||
// LINEAR filtering for smooth interpolation between filled cells
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
|
||||
return { texture, width, height };
|
||||
}
|
||||
|
||||
export default function WebGLCoverageLayer({
|
||||
points,
|
||||
opacity,
|
||||
minRsrp = -130,
|
||||
maxRsrp = -50,
|
||||
visible,
|
||||
onWebGLFailed,
|
||||
}: WebGLCoverageLayerProps) {
|
||||
const map = useMap();
|
||||
|
||||
// Refs for WebGL resources
|
||||
const canvasRef = useRef<HTMLCanvasElement | null>(null);
|
||||
const glRef = useRef<WebGLRenderingContext | null>(null);
|
||||
const programRef = useRef<WebGLProgram | null>(null);
|
||||
const textureRef = useRef<WebGLTexture | null>(null);
|
||||
const quadBufferRef = useRef<WebGLBuffer | null>(null);
|
||||
|
||||
// Track what data the current texture was built from
|
||||
const lastPointsHashRef = useRef<string>('');
|
||||
const boundsRef = useRef<{ minLat: number; maxLat: number; minLon: number; maxLon: number } | null>(null);
|
||||
const textureSizeRef = useRef<{ width: number; height: number }>({ width: 1, height: 1 });
|
||||
|
||||
// Stable ref for callback to avoid re-initialization
|
||||
const onWebGLFailedRef = useRef(onWebGLFailed);
|
||||
onWebGLFailedRef.current = onWebGLFailed;
|
||||
|
||||
// Track if initialized to prevent re-runs
|
||||
const initializedRef = useRef(false);
|
||||
|
||||
// Compute stable hash for points data
|
||||
const pointsHash = useMemo(() => {
|
||||
if (points.length === 0) return '';
|
||||
const first = points[0];
|
||||
const last = points[points.length - 1];
|
||||
return `${points.length}:${first.lat.toFixed(5)}:${last.lon.toFixed(5)}:${first.rsrp.toFixed(1)}`;
|
||||
}, [points]);
|
||||
|
||||
// Render function - only draws, no resource creation
|
||||
const render = useCallback(() => {
|
||||
const canvas = canvasRef.current;
|
||||
const gl = glRef.current;
|
||||
const program = programRef.current;
|
||||
const texture = textureRef.current;
|
||||
const bounds = boundsRef.current;
|
||||
|
||||
// DEBUG: Check what's missing if we can't render
|
||||
if (!canvas || !gl || !program || !texture || !bounds) {
|
||||
console.log('[WebGL] Render skipped - missing:', {
|
||||
canvas: !!canvas,
|
||||
gl: !!gl,
|
||||
program: !!program,
|
||||
texture: !!texture,
|
||||
bounds: !!bounds
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// Position canvas over coverage area
|
||||
const nw = map.latLngToLayerPoint([bounds.maxLat, bounds.minLon]);
|
||||
const se = map.latLngToLayerPoint([bounds.minLat, bounds.maxLon]);
|
||||
const width = Math.abs(se.x - nw.x);
|
||||
const height = Math.abs(se.y - nw.y);
|
||||
|
||||
if (width < 1 || height < 1) return;
|
||||
|
||||
canvas.style.transform = `translate(${nw.x}px, ${nw.y}px)`;
|
||||
canvas.style.width = `${width}px`;
|
||||
canvas.style.height = `${height}px`;
|
||||
|
||||
// DEBUG: Log every reposition
|
||||
console.log('[WebGL] Canvas repositioned:', {
|
||||
transform: canvas.style.transform,
|
||||
width: canvas.style.width,
|
||||
height: canvas.style.height,
|
||||
zoom: map.getZoom()
|
||||
});
|
||||
|
||||
// Get texture size for shader uniform
|
||||
const texSize = textureSizeRef.current;
|
||||
|
||||
// Set canvas resolution
|
||||
const dpr = Math.min(window.devicePixelRatio || 1, 2);
|
||||
const canvasW = Math.min(Math.round(width * dpr), 2048);
|
||||
const canvasH = Math.min(Math.round(height * dpr), 2048);
|
||||
|
||||
if (canvas.width !== canvasW || canvas.height !== canvasH) {
|
||||
canvas.width = canvasW;
|
||||
canvas.height = canvasH;
|
||||
}
|
||||
|
||||
// Render
|
||||
gl.viewport(0, 0, canvasW, canvasH);
|
||||
gl.clearColor(0, 0, 0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.useProgram(program);
|
||||
|
||||
// Bind quad buffer
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, quadBufferRef.current);
|
||||
const posLoc = gl.getAttribLocation(program, 'a_position');
|
||||
gl.enableVertexAttribArray(posLoc);
|
||||
gl.vertexAttribPointer(posLoc, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
// Bind texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture);
|
||||
gl.uniform1i(gl.getUniformLocation(program, 'u_coverage'), 0);
|
||||
|
||||
// Set texture size uniform (texSize already defined above for blur)
|
||||
const textureSizeLocation = gl.getUniformLocation(program, 'u_textureSize');
|
||||
if (textureSizeLocation) {
|
||||
gl.uniform2f(textureSizeLocation, texSize.width, texSize.height);
|
||||
}
|
||||
|
||||
// Draw
|
||||
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
||||
|
||||
gl.disableVertexAttribArray(posLoc);
|
||||
}, [map]);
|
||||
|
||||
// Effect 1: Initialize WebGL (canvas, context, program, quad buffer) - runs ONCE
|
||||
useEffect(() => {
|
||||
if (!visible) return;
|
||||
|
||||
// Skip if already initialized
|
||||
if (initializedRef.current && canvasRef.current && glRef.current) {
|
||||
return;
|
||||
}
|
||||
|
||||
const pane = map.getPane('overlayPane');
|
||||
if (!pane) return;
|
||||
|
||||
// Create canvas if needed
|
||||
if (!canvasRef.current) {
|
||||
// Remove any leftover canvas elements from previous sessions
|
||||
const existingCanvases = pane.querySelectorAll('canvas.webgl-coverage');
|
||||
existingCanvases.forEach(c => c.remove());
|
||||
console.log('[WebGL] Removed', existingCanvases.length, 'leftover canvas elements');
|
||||
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.className = 'webgl-coverage'; // Add class for identification
|
||||
canvas.style.position = 'absolute';
|
||||
canvas.style.pointerEvents = 'none';
|
||||
canvas.style.transformOrigin = '0 0';
|
||||
pane.appendChild(canvas);
|
||||
canvasRef.current = canvas;
|
||||
}
|
||||
|
||||
const canvas = canvasRef.current;
|
||||
|
||||
// Initialize WebGL if needed
|
||||
if (!glRef.current) {
|
||||
const gl = canvas.getContext('webgl', { alpha: true, premultipliedAlpha: false });
|
||||
if (!gl) {
|
||||
console.error('[WebGL] WebGL not available');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
glRef.current = gl;
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);
|
||||
}
|
||||
|
||||
const gl = glRef.current;
|
||||
|
||||
// Create program if needed
|
||||
if (!programRef.current) {
|
||||
const program = createProgram(gl);
|
||||
if (!program) {
|
||||
console.error('[WebGL] Failed to create program');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
programRef.current = program;
|
||||
}
|
||||
|
||||
// Create quad buffer if needed
|
||||
if (!quadBufferRef.current) {
|
||||
const buf = gl.createBuffer();
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, buf);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
|
||||
-1, -1, 1, -1, -1, 1, 1, 1
|
||||
]), gl.STATIC_DRAW);
|
||||
quadBufferRef.current = buf;
|
||||
}
|
||||
|
||||
initializedRef.current = true;
|
||||
console.log('[WebGL] Initialized (should appear ONCE)');
|
||||
}, [visible, map]); // Removed onWebGLFailed - use ref instead
|
||||
|
||||
// Effect 2: Create texture when points data changes
|
||||
useEffect(() => {
|
||||
if (!visible || points.length === 0 || !glRef.current) return;
|
||||
|
||||
// Skip if same data
|
||||
if (pointsHash === lastPointsHashRef.current && textureRef.current) {
|
||||
return;
|
||||
}
|
||||
|
||||
const gl = glRef.current;
|
||||
const grid = detectGrid(points);
|
||||
if (!grid) return;
|
||||
|
||||
// Delete old texture
|
||||
if (textureRef.current) {
|
||||
gl.deleteTexture(textureRef.current);
|
||||
textureRef.current = null;
|
||||
}
|
||||
|
||||
// Create new texture (returns texture + dimensions)
|
||||
const result = createCoverageTexture(gl, points, grid, minRsrp, maxRsrp);
|
||||
if (!result) {
|
||||
console.error('[WebGL] Failed to create texture');
|
||||
return;
|
||||
}
|
||||
|
||||
textureRef.current = result.texture;
|
||||
lastPointsHashRef.current = pointsHash;
|
||||
|
||||
// Store texture size for shader uniform
|
||||
textureSizeRef.current = { width: result.width, height: result.height };
|
||||
|
||||
// Store bounds for rendering (with half-cell padding)
|
||||
const canvasBounds = {
|
||||
minLat: grid.minLat - grid.latStep / 2,
|
||||
maxLat: grid.maxLat + grid.latStep / 2,
|
||||
minLon: grid.minLon - grid.lonStep / 2,
|
||||
maxLon: grid.maxLon + grid.lonStep / 2,
|
||||
};
|
||||
boundsRef.current = canvasBounds;
|
||||
|
||||
// FULL DEBUG: Compare data extent vs canvas bounds
|
||||
const lats = points.map(p => p.lat);
|
||||
const lons = points.map(p => p.lon);
|
||||
const dataMinLat = Math.min(...lats);
|
||||
const dataMaxLat = Math.max(...lats);
|
||||
const dataMinLon = Math.min(...lons);
|
||||
const dataMaxLon = Math.max(...lons);
|
||||
|
||||
console.log('[WebGL] FULL DEBUG:', {
|
||||
// Data extent (actual points)
|
||||
dataMinLat: dataMinLat.toFixed(6),
|
||||
dataMaxLat: dataMaxLat.toFixed(6),
|
||||
dataMinLon: dataMinLon.toFixed(6),
|
||||
dataMaxLon: dataMaxLon.toFixed(6),
|
||||
dataLatRange: (dataMaxLat - dataMinLat).toFixed(6),
|
||||
dataLonRange: (dataMaxLon - dataMinLon).toFixed(6),
|
||||
|
||||
// Grid detection result
|
||||
gridWidth: grid.width,
|
||||
gridHeight: grid.height,
|
||||
gridMinLat: grid.minLat.toFixed(6),
|
||||
gridMaxLat: grid.maxLat.toFixed(6),
|
||||
gridMinLon: grid.minLon.toFixed(6),
|
||||
gridMaxLon: grid.maxLon.toFixed(6),
|
||||
gridLatStep: grid.latStep.toFixed(6),
|
||||
gridLonStep: grid.lonStep.toFixed(6),
|
||||
|
||||
// Texture size
|
||||
textureWidth: result.width,
|
||||
textureHeight: result.height,
|
||||
|
||||
// Canvas bounds (what we use for rendering)
|
||||
canvasMinLat: canvasBounds.minLat.toFixed(6),
|
||||
canvasMaxLat: canvasBounds.maxLat.toFixed(6),
|
||||
canvasMinLon: canvasBounds.minLon.toFixed(6),
|
||||
canvasMaxLon: canvasBounds.maxLon.toFixed(6),
|
||||
canvasLatRange: (canvasBounds.maxLat - canvasBounds.minLat).toFixed(6),
|
||||
canvasLonRange: (canvasBounds.maxLon - canvasBounds.minLon).toFixed(6),
|
||||
|
||||
// Comparison
|
||||
latCoveragePercent: ((canvasBounds.maxLat - canvasBounds.minLat) / (dataMaxLat - dataMinLat) * 100).toFixed(1) + '%',
|
||||
lonCoveragePercent: ((canvasBounds.maxLon - canvasBounds.minLon) / (dataMaxLon - dataMinLon) * 100).toFixed(1) + '%',
|
||||
|
||||
// Expected
|
||||
expectedRange: '~0.18 degrees for 20km radius',
|
||||
pointCount: points.length
|
||||
});
|
||||
|
||||
// Initial render
|
||||
render();
|
||||
}, [visible, points, pointsHash, minRsrp, maxRsrp, render]);
|
||||
|
||||
// Effect 3: Set up map event listeners for re-rendering on move/zoom
|
||||
// Note: Set up listeners even without texture - render() will check for texture
|
||||
useEffect(() => {
|
||||
if (!visible) return;
|
||||
|
||||
let frameId = 0;
|
||||
let moveCount = 0;
|
||||
const onMapChange = () => {
|
||||
moveCount++;
|
||||
if (moveCount <= 3 || moveCount % 10 === 0) {
|
||||
console.log('[WebGL] Map event #' + moveCount + ', triggering render');
|
||||
}
|
||||
cancelAnimationFrame(frameId);
|
||||
frameId = requestAnimationFrame(render);
|
||||
};
|
||||
|
||||
map.on('move', onMapChange);
|
||||
map.on('zoom', onMapChange);
|
||||
map.on('resize', onMapChange);
|
||||
|
||||
console.log('[WebGL] Map listeners attached');
|
||||
|
||||
return () => {
|
||||
map.off('move', onMapChange);
|
||||
map.off('zoom', onMapChange);
|
||||
map.off('resize', onMapChange);
|
||||
cancelAnimationFrame(frameId);
|
||||
console.log('[WebGL] Map listeners detached');
|
||||
};
|
||||
}, [visible, map, render]);
|
||||
|
||||
// Effect 4: Update opacity without recreating anything
|
||||
useEffect(() => {
|
||||
if (canvasRef.current) {
|
||||
canvasRef.current.style.opacity = String(opacity);
|
||||
}
|
||||
}, [opacity]);
|
||||
|
||||
// Effect 5: Hide/show canvas based on visibility
|
||||
useEffect(() => {
|
||||
if (canvasRef.current) {
|
||||
canvasRef.current.style.display = visible ? 'block' : 'none';
|
||||
}
|
||||
}, [visible]);
|
||||
|
||||
// Cleanup on unmount
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
const gl = glRef.current;
|
||||
if (gl) {
|
||||
if (textureRef.current) gl.deleteTexture(textureRef.current);
|
||||
if (quadBufferRef.current) gl.deleteBuffer(quadBufferRef.current);
|
||||
if (programRef.current) gl.deleteProgram(programRef.current);
|
||||
}
|
||||
if (canvasRef.current) {
|
||||
canvasRef.current.remove();
|
||||
canvasRef.current = null;
|
||||
}
|
||||
glRef.current = null;
|
||||
programRef.current = null;
|
||||
textureRef.current = null;
|
||||
quadBufferRef.current = null;
|
||||
};
|
||||
}, []);
|
||||
|
||||
return null;
|
||||
}
|
||||
632
frontend/src/components/map/WebGLRadialCoverageLayer.tsx
Normal file
632
frontend/src/components/map/WebGLRadialCoverageLayer.tsx
Normal file
@@ -0,0 +1,632 @@
|
||||
/**
|
||||
* WebGL Radial Gradients Coverage Layer
|
||||
*
|
||||
* Uses multi-pass additive blending to render smooth radial gradients
|
||||
* around each coverage point, similar to Canvas GeographicHeatmap but GPU-accelerated.
|
||||
*
|
||||
* Approach:
|
||||
* 1. Render each point as a quad with radial falloff (only when data changes)
|
||||
* 2. Use additive blending to accumulate (weight * rsrp, weight)
|
||||
* 3. Final pass: normalize and apply colormap (on every frame)
|
||||
*/
|
||||
|
||||
import { useEffect, useRef, useMemo, useCallback } from 'react';
|
||||
import { useMap } from 'react-leaflet';
|
||||
|
||||
// Logging: 0=off, 1=errors, 2=info, 3=debug
|
||||
const LOG_LEVEL = 2;
|
||||
const log = (level: number, ...args: unknown[]) => {
|
||||
if (level <= LOG_LEVEL) console.log('[WebGL Radial]', ...args);
|
||||
};
|
||||
|
||||
export interface CoveragePoint {
|
||||
lat: number;
|
||||
lon: number;
|
||||
rsrp: number;
|
||||
}
|
||||
|
||||
interface WebGLRadialCoverageLayerProps {
|
||||
points: CoveragePoint[];
|
||||
opacity: number;
|
||||
minRsrp?: number;
|
||||
maxRsrp?: number;
|
||||
visible: boolean;
|
||||
radiusMeters?: number;
|
||||
onWebGLFailed?: () => void;
|
||||
}
|
||||
|
||||
// Point accumulation vertex shader
|
||||
const POINT_VERTEX_SHADER = `
|
||||
attribute vec2 a_position; // quad vertices (-1 to 1)
|
||||
attribute vec2 a_pointPos; // point position in normalized coords
|
||||
attribute float a_pointRsrp; // normalized RSRP (0-1)
|
||||
attribute float a_pointRadius; // radius in normalized coords
|
||||
|
||||
varying vec2 v_localPos;
|
||||
varying float v_rsrp;
|
||||
|
||||
void main() {
|
||||
// Expand quad around point center
|
||||
vec2 pos = a_pointPos + a_position * a_pointRadius;
|
||||
gl_Position = vec4(pos * 2.0 - 1.0, 0.0, 1.0); // Map 0-1 to clip space -1 to 1
|
||||
|
||||
v_localPos = a_position; // -1 to 1 within the quad
|
||||
v_rsrp = a_pointRsrp;
|
||||
}
|
||||
`;
|
||||
|
||||
// Point accumulation fragment shader
|
||||
const POINT_FRAGMENT_SHADER = `
|
||||
precision highp float;
|
||||
|
||||
varying vec2 v_localPos;
|
||||
varying float v_rsrp;
|
||||
|
||||
void main() {
|
||||
// Radial distance from center (0 at center, 1 at edge)
|
||||
float dist = length(v_localPos);
|
||||
|
||||
// Discard outside circle
|
||||
if (dist > 1.0) discard;
|
||||
|
||||
// Radial falloff - softer gaussian for better edge coverage
|
||||
// exp(-2) = 0.135 at edge vs exp(-3) = 0.05, giving more contribution from edge points
|
||||
float weight = exp(-dist * dist * 2.0);
|
||||
|
||||
// Output: (weight * rsrp, weight, 0, 0)
|
||||
// Using RG channels for accumulation
|
||||
gl_FragColor = vec4(weight * v_rsrp, weight, 0.0, 1.0);
|
||||
}
|
||||
`;
|
||||
|
||||
// Final compositing vertex shader
|
||||
const COMPOSITE_VERTEX_SHADER = `
|
||||
attribute vec2 a_position;
|
||||
varying vec2 v_uv;
|
||||
|
||||
void main() {
|
||||
gl_Position = vec4(a_position, 0.0, 1.0);
|
||||
v_uv = (a_position + 1.0) * 0.5;
|
||||
}
|
||||
`;
|
||||
|
||||
// Final compositing fragment shader
|
||||
const COMPOSITE_FRAGMENT_SHADER = `
|
||||
precision highp float;
|
||||
|
||||
uniform sampler2D u_accumTexture;
|
||||
uniform float u_opacity;
|
||||
|
||||
varying vec2 v_uv;
|
||||
|
||||
vec3 rsrpToColor(float t) {
|
||||
// t: 0 = weak (red), 1 = strong (cyan)
|
||||
if (t < 0.25) return mix(vec3(1.0, 0.0, 0.0), vec3(1.0, 0.5, 0.0), t / 0.25);
|
||||
if (t < 0.5) return mix(vec3(1.0, 0.5, 0.0), vec3(1.0, 1.0, 0.0), (t - 0.25) / 0.25);
|
||||
if (t < 0.75) return mix(vec3(1.0, 1.0, 0.0), vec3(0.0, 1.0, 0.0), (t - 0.5) / 0.25);
|
||||
return mix(vec3(0.0, 1.0, 0.0), vec3(0.0, 1.0, 1.0), (t - 0.75) / 0.25);
|
||||
}
|
||||
|
||||
void main() {
|
||||
vec4 accum = texture2D(u_accumTexture, v_uv);
|
||||
|
||||
float totalValue = accum.r;
|
||||
float totalWeight = accum.g;
|
||||
|
||||
// No coverage - discard if weight is truly zero
|
||||
if (totalWeight < 0.0001) discard;
|
||||
|
||||
// Weighted average RSRP
|
||||
float avgRsrp = clamp(totalValue / totalWeight, 0.0, 1.0);
|
||||
|
||||
// Color mapping
|
||||
vec3 color = rsrpToColor(avgRsrp);
|
||||
|
||||
// Alpha based on weight (fade at edges)
|
||||
float alpha = min(1.0, totalWeight * 0.1) * u_opacity;
|
||||
|
||||
gl_FragColor = vec4(color, alpha);
|
||||
}
|
||||
`;
|
||||
|
||||
function compileShader(gl: WebGLRenderingContext, source: string, type: number): WebGLShader | null {
|
||||
const shader = gl.createShader(type);
|
||||
if (!shader) return null;
|
||||
gl.shaderSource(shader, source);
|
||||
gl.compileShader(shader);
|
||||
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
|
||||
console.error('[WebGL Radial] Shader error:', gl.getShaderInfoLog(shader));
|
||||
gl.deleteShader(shader);
|
||||
return null;
|
||||
}
|
||||
return shader;
|
||||
}
|
||||
|
||||
function createProgram(gl: WebGLRenderingContext, vsSource: string, fsSource: string): WebGLProgram | null {
|
||||
const vs = compileShader(gl, vsSource, gl.VERTEX_SHADER);
|
||||
const fs = compileShader(gl, fsSource, gl.FRAGMENT_SHADER);
|
||||
if (!vs || !fs) return null;
|
||||
|
||||
const program = gl.createProgram();
|
||||
if (!program) return null;
|
||||
gl.attachShader(program, vs);
|
||||
gl.attachShader(program, fs);
|
||||
gl.linkProgram(program);
|
||||
|
||||
if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
|
||||
console.error('[WebGL Radial] Program error:', gl.getProgramInfoLog(program));
|
||||
return null;
|
||||
}
|
||||
|
||||
// Clean up shaders after linking
|
||||
gl.deleteShader(vs);
|
||||
gl.deleteShader(fs);
|
||||
|
||||
return program;
|
||||
}
|
||||
|
||||
interface Bounds {
|
||||
minLat: number;
|
||||
maxLat: number;
|
||||
minLon: number;
|
||||
maxLon: number;
|
||||
}
|
||||
|
||||
export default function WebGLRadialCoverageLayer({
|
||||
points,
|
||||
opacity,
|
||||
minRsrp = -130,
|
||||
maxRsrp = -50,
|
||||
visible,
|
||||
radiusMeters = 400,
|
||||
onWebGLFailed,
|
||||
}: WebGLRadialCoverageLayerProps) {
|
||||
const map = useMap();
|
||||
|
||||
// Refs for WebGL resources
|
||||
const canvasRef = useRef<HTMLCanvasElement | null>(null);
|
||||
const glRef = useRef<WebGLRenderingContext | null>(null);
|
||||
const pointProgramRef = useRef<WebGLProgram | null>(null);
|
||||
const compositeProgramRef = useRef<WebGLProgram | null>(null);
|
||||
const accumTextureRef = useRef<WebGLTexture | null>(null);
|
||||
const framebufferRef = useRef<WebGLFramebuffer | null>(null);
|
||||
const quadBufferRef = useRef<WebGLBuffer | null>(null);
|
||||
const pointBufferRef = useRef<WebGLBuffer | null>(null);
|
||||
const boundsRef = useRef<Bounds | null>(null);
|
||||
const initializedRef = useRef(false);
|
||||
const lastPointsHashRef = useRef<string>('');
|
||||
const instExtRef = useRef<ANGLE_instanced_arrays | null>(null);
|
||||
|
||||
// Track if points need to be re-rendered (expensive pass)
|
||||
const needsPointRenderRef = useRef(true);
|
||||
|
||||
// Stable ref for callback
|
||||
const onWebGLFailedRef = useRef(onWebGLFailed);
|
||||
onWebGLFailedRef.current = onWebGLFailed;
|
||||
|
||||
// Track framebuffer size
|
||||
const fbSizeRef = useRef<{ width: number; height: number }>({ width: 0, height: 0 });
|
||||
|
||||
// Compute points hash for change detection
|
||||
const pointsHash = useMemo(() => {
|
||||
if (points.length === 0) return 'empty';
|
||||
const first = points[0];
|
||||
const last = points[points.length - 1];
|
||||
return `${points.length}:${first.lat.toFixed(5)}:${last.lon.toFixed(5)}:${first.rsrp.toFixed(1)}`;
|
||||
}, [points]);
|
||||
|
||||
// Calculate bounds from points
|
||||
const calculateBounds = useCallback((pts: CoveragePoint[]): Bounds | null => {
|
||||
if (pts.length === 0) return null;
|
||||
|
||||
let minLat = Infinity, maxLat = -Infinity;
|
||||
let minLon = Infinity, maxLon = -Infinity;
|
||||
|
||||
for (const p of pts) {
|
||||
if (p.lat < minLat) minLat = p.lat;
|
||||
if (p.lat > maxLat) maxLat = p.lat;
|
||||
if (p.lon < minLon) minLon = p.lon;
|
||||
if (p.lon > maxLon) maxLon = p.lon;
|
||||
}
|
||||
|
||||
// Padding needs to accommodate the radial gradient of edge points
|
||||
// Each point's gradient extends beyond its center, use 12% of range as padding
|
||||
const latRangeRaw = maxLat - minLat;
|
||||
const lonRangeRaw = maxLon - minLon;
|
||||
const latPaddingGradient = latRangeRaw * 0.12;
|
||||
const lonPaddingGradient = lonRangeRaw * 0.12;
|
||||
const latPaddingRadius = radiusMeters / 111000;
|
||||
const lonPaddingRadius = radiusMeters / (111000 * Math.cos((minLat + maxLat) / 2 * Math.PI / 180));
|
||||
|
||||
const latPadding = Math.max(latPaddingGradient, latPaddingRadius);
|
||||
const lonPadding = Math.max(lonPaddingGradient, lonPaddingRadius);
|
||||
|
||||
log(2, 'Bounds padding:', { latPadding: latPadding.toFixed(5), lonPadding: lonPadding.toFixed(5) });
|
||||
|
||||
return {
|
||||
minLat: minLat - latPadding,
|
||||
maxLat: maxLat + latPadding,
|
||||
minLon: minLon - lonPadding,
|
||||
maxLon: maxLon + lonPadding,
|
||||
};
|
||||
}, [radiusMeters]);
|
||||
|
||||
// Render function - split into point accumulation (expensive) and composite (cheap)
|
||||
const render = useCallback(() => {
|
||||
const canvas = canvasRef.current;
|
||||
const gl = glRef.current;
|
||||
const pointProgram = pointProgramRef.current;
|
||||
const compositeProgram = compositeProgramRef.current;
|
||||
const framebuffer = framebufferRef.current;
|
||||
const accumTexture = accumTextureRef.current;
|
||||
const quadBuffer = quadBufferRef.current;
|
||||
const bounds = boundsRef.current;
|
||||
|
||||
if (!canvas || !gl || !pointProgram || !compositeProgram || !framebuffer ||
|
||||
!accumTexture || !quadBuffer || !bounds) {
|
||||
return;
|
||||
}
|
||||
|
||||
log(3, 'render() points:', points.length, 'needsPointRender:', needsPointRenderRef.current);
|
||||
|
||||
// Position canvas over coverage area
|
||||
const nw = map.latLngToLayerPoint([bounds.maxLat, bounds.minLon]);
|
||||
const se = map.latLngToLayerPoint([bounds.minLat, bounds.maxLon]);
|
||||
const width = Math.abs(se.x - nw.x);
|
||||
const height = Math.abs(se.y - nw.y);
|
||||
|
||||
if (width < 1 || height < 1) return;
|
||||
|
||||
canvas.style.transform = `translate(${nw.x}px, ${nw.y}px)`;
|
||||
canvas.style.width = `${width}px`;
|
||||
canvas.style.height = `${height}px`;
|
||||
|
||||
// Set canvas resolution
|
||||
const dpr = Math.min(window.devicePixelRatio || 1, 2);
|
||||
const canvasW = Math.min(Math.round(width * dpr), 2048);
|
||||
const canvasH = Math.min(Math.round(height * dpr), 2048);
|
||||
|
||||
// Resize canvas and framebuffer if needed (with tolerance to avoid subpixel jitter)
|
||||
const needsResize = Math.abs(canvas.width - canvasW) > 2 || Math.abs(canvas.height - canvasH) > 2;
|
||||
if (needsResize) {
|
||||
canvas.width = canvasW;
|
||||
canvas.height = canvasH;
|
||||
|
||||
// Resize accumulation texture
|
||||
gl.bindTexture(gl.TEXTURE_2D, accumTexture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, canvasW, canvasH, 0, gl.RGBA, gl.FLOAT, null);
|
||||
|
||||
fbSizeRef.current = { width: canvasW, height: canvasH };
|
||||
needsPointRenderRef.current = true; // Must re-render points after resize
|
||||
}
|
||||
|
||||
// === Pass 1: Accumulate points into framebuffer (only when needed) ===
|
||||
if (needsPointRenderRef.current) {
|
||||
const t0 = performance.now();
|
||||
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
|
||||
gl.viewport(0, 0, canvas.width, canvas.height);
|
||||
gl.clearColor(0, 0, 0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.useProgram(pointProgram);
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.ONE, gl.ONE); // Additive blending
|
||||
|
||||
// Get attribute locations
|
||||
const posLoc = gl.getAttribLocation(pointProgram, 'a_position');
|
||||
const pointPosLoc = gl.getAttribLocation(pointProgram, 'a_pointPos');
|
||||
const pointRsrpLoc = gl.getAttribLocation(pointProgram, 'a_pointRsrp');
|
||||
const pointRadiusLoc = gl.getAttribLocation(pointProgram, 'a_pointRadius');
|
||||
|
||||
// Calculate radius in normalized coords
|
||||
const latRange = bounds.maxLat - bounds.minLat;
|
||||
const lonRange = bounds.maxLon - bounds.minLon;
|
||||
|
||||
// Calculate radius: ensure smooth overlap between adjacent points
|
||||
const gridDim = Math.sqrt(points.length);
|
||||
const avgCellLat = latRange / gridDim;
|
||||
const avgCellLon = lonRange / gridDim;
|
||||
|
||||
// For smooth coverage we need each point's gradient to reach ~2 cells in every direction
|
||||
// Denser grids (more points) need relatively larger multiplier because edge effects matter more
|
||||
const baseMultiplier = 3.5;
|
||||
const densityBoost = Math.max(1.0, gridDim / 50); // 1.0 at 50pts, 1.6 at 80pts
|
||||
const radiusMultiplier = baseMultiplier * densityBoost;
|
||||
|
||||
const normalizedRadiusLat = (avgCellLat * radiusMultiplier) / latRange;
|
||||
const normalizedRadiusLon = (avgCellLon * radiusMultiplier) / lonRange;
|
||||
const normalizedRadius = Math.max(normalizedRadiusLat, normalizedRadiusLon);
|
||||
const rsrpRange = maxRsrp - minRsrp;
|
||||
|
||||
const instExt = instExtRef.current;
|
||||
const pointBuffer = pointBufferRef.current;
|
||||
|
||||
if (instExt && pointBuffer) {
|
||||
// === INSTANCED RENDERING: 1 draw call for ALL points ===
|
||||
|
||||
// Build instance data buffer: [posX, posY, rsrp, radius] × N points
|
||||
const instanceData = new Float32Array(points.length * 4);
|
||||
for (let i = 0; i < points.length; i++) {
|
||||
const p = points[i];
|
||||
const normX = (p.lon - bounds.minLon) / lonRange;
|
||||
const normY = (p.lat - bounds.minLat) / latRange;
|
||||
const normRsrp = Math.max(0, Math.min(1, (p.rsrp - minRsrp) / rsrpRange));
|
||||
instanceData[i * 4 + 0] = normX;
|
||||
instanceData[i * 4 + 1] = normY;
|
||||
instanceData[i * 4 + 2] = normRsrp;
|
||||
instanceData[i * 4 + 3] = normalizedRadius;
|
||||
}
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, pointBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, instanceData, gl.DYNAMIC_DRAW);
|
||||
|
||||
// Bind quad buffer for a_position (per-vertex)
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, quadBuffer);
|
||||
gl.enableVertexAttribArray(posLoc);
|
||||
gl.vertexAttribPointer(posLoc, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
// Bind instance buffer for per-instance attributes
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, pointBuffer);
|
||||
const stride = 4 * 4; // 4 floats × 4 bytes
|
||||
|
||||
gl.enableVertexAttribArray(pointPosLoc);
|
||||
gl.vertexAttribPointer(pointPosLoc, 2, gl.FLOAT, false, stride, 0);
|
||||
instExt.vertexAttribDivisorANGLE(pointPosLoc, 1); // per-instance
|
||||
|
||||
gl.enableVertexAttribArray(pointRsrpLoc);
|
||||
gl.vertexAttribPointer(pointRsrpLoc, 1, gl.FLOAT, false, stride, 8);
|
||||
instExt.vertexAttribDivisorANGLE(pointRsrpLoc, 1); // per-instance
|
||||
|
||||
gl.enableVertexAttribArray(pointRadiusLoc);
|
||||
gl.vertexAttribPointer(pointRadiusLoc, 1, gl.FLOAT, false, stride, 12);
|
||||
instExt.vertexAttribDivisorANGLE(pointRadiusLoc, 1); // per-instance
|
||||
|
||||
// ONE draw call for ALL points!
|
||||
instExt.drawArraysInstancedANGLE(gl.TRIANGLE_STRIP, 0, 4, points.length);
|
||||
|
||||
// Reset divisors
|
||||
instExt.vertexAttribDivisorANGLE(pointPosLoc, 0);
|
||||
instExt.vertexAttribDivisorANGLE(pointRsrpLoc, 0);
|
||||
instExt.vertexAttribDivisorANGLE(pointRadiusLoc, 0);
|
||||
|
||||
gl.disableVertexAttribArray(posLoc);
|
||||
gl.disableVertexAttribArray(pointPosLoc);
|
||||
gl.disableVertexAttribArray(pointRsrpLoc);
|
||||
gl.disableVertexAttribArray(pointRadiusLoc);
|
||||
|
||||
const t1 = performance.now();
|
||||
log(2, 'Instanced render:', points.length, 'points in 1 call,', (t1 - t0).toFixed(1) + 'ms');
|
||||
} else {
|
||||
// === FALLBACK: per-point draw calls ===
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, quadBuffer);
|
||||
gl.enableVertexAttribArray(posLoc);
|
||||
gl.vertexAttribPointer(posLoc, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
for (const p of points) {
|
||||
const normX = (p.lon - bounds.minLon) / lonRange;
|
||||
const normY = (p.lat - bounds.minLat) / latRange;
|
||||
const normRsrp = Math.max(0, Math.min(1, (p.rsrp - minRsrp) / rsrpRange));
|
||||
|
||||
gl.vertexAttrib2f(pointPosLoc, normX, normY);
|
||||
gl.vertexAttrib1f(pointRsrpLoc, normRsrp);
|
||||
gl.vertexAttrib1f(pointRadiusLoc, normalizedRadius);
|
||||
|
||||
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
||||
}
|
||||
|
||||
gl.disableVertexAttribArray(posLoc);
|
||||
|
||||
const t1 = performance.now();
|
||||
log(2, 'Fallback render:', points.length, 'points in', points.length, 'calls,', (t1 - t0).toFixed(1) + 'ms');
|
||||
}
|
||||
|
||||
log(3, 'Grid estimate:', { points: points.length, gridDim: gridDim.toFixed(1), densityBoost: densityBoost.toFixed(2), radiusMultiplier: radiusMultiplier.toFixed(1), normalizedRadius: normalizedRadius.toFixed(4) });
|
||||
needsPointRenderRef.current = false;
|
||||
}
|
||||
|
||||
// === Pass 2: Composite to screen (always runs) ===
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
||||
gl.viewport(0, 0, canvas.width, canvas.height);
|
||||
gl.clearColor(0, 0, 0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.useProgram(compositeProgram);
|
||||
gl.enable(gl.BLEND);
|
||||
gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); // Normal blending
|
||||
|
||||
// Bind quad buffer
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, quadBuffer);
|
||||
const compositePos = gl.getAttribLocation(compositeProgram, 'a_position');
|
||||
gl.enableVertexAttribArray(compositePos);
|
||||
gl.vertexAttribPointer(compositePos, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
// Bind accumulation texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, accumTexture);
|
||||
gl.uniform1i(gl.getUniformLocation(compositeProgram, 'u_accumTexture'), 0);
|
||||
gl.uniform1f(gl.getUniformLocation(compositeProgram, 'u_opacity'), opacity);
|
||||
|
||||
gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
|
||||
gl.disableVertexAttribArray(compositePos);
|
||||
|
||||
}, [map, points, minRsrp, maxRsrp, opacity]);
|
||||
|
||||
// Effect 1: Initialize WebGL
|
||||
useEffect(() => {
|
||||
if (!visible) return;
|
||||
if (initializedRef.current && canvasRef.current && glRef.current) return;
|
||||
|
||||
const pane = map.getPane('overlayPane');
|
||||
if (!pane) return;
|
||||
|
||||
// Remove any leftover canvas
|
||||
const existing = pane.querySelectorAll('canvas.webgl-radial-coverage');
|
||||
existing.forEach(c => c.remove());
|
||||
|
||||
// Create canvas
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.className = 'webgl-radial-coverage';
|
||||
canvas.style.position = 'absolute';
|
||||
canvas.style.pointerEvents = 'none';
|
||||
canvas.style.transformOrigin = '0 0';
|
||||
pane.appendChild(canvas);
|
||||
canvasRef.current = canvas;
|
||||
|
||||
// Initialize WebGL
|
||||
const gl = canvas.getContext('webgl', { alpha: true, premultipliedAlpha: false });
|
||||
if (!gl) {
|
||||
console.error('[WebGL Radial] WebGL not available');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
glRef.current = gl;
|
||||
|
||||
// Check for float texture support
|
||||
const floatExt = gl.getExtension('OES_texture_float');
|
||||
gl.getExtension('OES_texture_float_linear'); // Enable if available
|
||||
if (!floatExt) {
|
||||
console.error('[WebGL Radial] OES_texture_float not supported');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
|
||||
// Check for instanced rendering support
|
||||
const instExt = gl.getExtension('ANGLE_instanced_arrays');
|
||||
if (instExt) {
|
||||
log(2, 'Instanced rendering supported');
|
||||
instExtRef.current = instExt;
|
||||
} else {
|
||||
log(1, 'Instanced rendering NOT supported, using fallback');
|
||||
}
|
||||
|
||||
gl.enable(gl.BLEND);
|
||||
|
||||
// Create point program
|
||||
const pointProgram = createProgram(gl, POINT_VERTEX_SHADER, POINT_FRAGMENT_SHADER);
|
||||
if (!pointProgram) {
|
||||
console.error('[WebGL Radial] Failed to create point program');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
pointProgramRef.current = pointProgram;
|
||||
|
||||
// Create composite program
|
||||
const compositeProgram = createProgram(gl, COMPOSITE_VERTEX_SHADER, COMPOSITE_FRAGMENT_SHADER);
|
||||
if (!compositeProgram) {
|
||||
console.error('[WebGL Radial] Failed to create composite program');
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
compositeProgramRef.current = compositeProgram;
|
||||
|
||||
// Create quad buffer (fullscreen quad)
|
||||
const quadBuffer = gl.createBuffer();
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, quadBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
|
||||
-1, -1,
|
||||
1, -1,
|
||||
-1, 1,
|
||||
1, 1,
|
||||
]), gl.STATIC_DRAW);
|
||||
quadBufferRef.current = quadBuffer;
|
||||
|
||||
// Create point buffer (will be filled per-point for now, TODO: instancing)
|
||||
const pointBuffer = gl.createBuffer();
|
||||
pointBufferRef.current = pointBuffer;
|
||||
|
||||
// Create accumulation texture (float RGBA)
|
||||
// Use NEAREST filtering - float textures require OES_texture_float_linear for LINEAR
|
||||
const accumTexture = gl.createTexture();
|
||||
gl.bindTexture(gl.TEXTURE_2D, accumTexture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 1, 0, gl.RGBA, gl.FLOAT, null);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
accumTextureRef.current = accumTexture;
|
||||
|
||||
// Create framebuffer
|
||||
const framebuffer = gl.createFramebuffer();
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
|
||||
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, accumTexture, 0);
|
||||
framebufferRef.current = framebuffer;
|
||||
|
||||
// Check framebuffer status
|
||||
const status = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
|
||||
if (status !== gl.FRAMEBUFFER_COMPLETE) {
|
||||
console.error('[WebGL Radial] Framebuffer not complete:', status);
|
||||
onWebGLFailedRef.current?.();
|
||||
return;
|
||||
}
|
||||
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
||||
|
||||
initializedRef.current = true;
|
||||
|
||||
}, [visible, map]);
|
||||
|
||||
// Effect 2: Update bounds when points change
|
||||
useEffect(() => {
|
||||
if (!visible || points.length === 0) return;
|
||||
if (pointsHash === lastPointsHashRef.current) return;
|
||||
|
||||
const bounds = calculateBounds(points);
|
||||
if (!bounds) return;
|
||||
|
||||
boundsRef.current = bounds;
|
||||
lastPointsHashRef.current = pointsHash;
|
||||
needsPointRenderRef.current = true; // Mark for point re-render
|
||||
|
||||
render();
|
||||
}, [visible, points, pointsHash, calculateBounds, render]);
|
||||
|
||||
// Effect 3: Map event listeners
|
||||
useEffect(() => {
|
||||
if (!visible) return;
|
||||
|
||||
let frameId = 0;
|
||||
const onMapChange = () => {
|
||||
cancelAnimationFrame(frameId);
|
||||
frameId = requestAnimationFrame(render);
|
||||
};
|
||||
|
||||
map.on('move', onMapChange);
|
||||
map.on('zoom', onMapChange);
|
||||
map.on('resize', onMapChange);
|
||||
|
||||
return () => {
|
||||
map.off('move', onMapChange);
|
||||
map.off('zoom', onMapChange);
|
||||
map.off('resize', onMapChange);
|
||||
cancelAnimationFrame(frameId);
|
||||
};
|
||||
}, [visible, map, render]);
|
||||
|
||||
// Effect 4: Visibility toggle
|
||||
useEffect(() => {
|
||||
if (canvasRef.current) {
|
||||
canvasRef.current.style.display = visible ? 'block' : 'none';
|
||||
}
|
||||
}, [visible]);
|
||||
|
||||
// Cleanup on unmount
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
const gl = glRef.current;
|
||||
if (gl) {
|
||||
if (accumTextureRef.current) gl.deleteTexture(accumTextureRef.current);
|
||||
if (framebufferRef.current) gl.deleteFramebuffer(framebufferRef.current);
|
||||
if (quadBufferRef.current) gl.deleteBuffer(quadBufferRef.current);
|
||||
if (pointBufferRef.current) gl.deleteBuffer(pointBufferRef.current);
|
||||
if (pointProgramRef.current) gl.deleteProgram(pointProgramRef.current);
|
||||
if (compositeProgramRef.current) gl.deleteProgram(compositeProgramRef.current);
|
||||
}
|
||||
if (canvasRef.current) {
|
||||
canvasRef.current.remove();
|
||||
canvasRef.current = null;
|
||||
}
|
||||
};
|
||||
}, []);
|
||||
|
||||
return null;
|
||||
}
|
||||
361
frontend/src/components/panels/LinkBudgetPanel.tsx
Normal file
361
frontend/src/components/panels/LinkBudgetPanel.tsx
Normal file
@@ -0,0 +1,361 @@
|
||||
/**
|
||||
* Link Budget Calculator Panel
|
||||
*
|
||||
* Shows complete RF link budget from transmitter to receiver:
|
||||
* - TX: power, gain, cable loss, EIRP
|
||||
* - Path: distance, FSPL, terrain loss
|
||||
* - RX: gain, sensitivity, margin
|
||||
*/
|
||||
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useSitesStore } from '@/store/sites.ts';
|
||||
import { api } from '@/services/api.ts';
|
||||
import type { LinkBudgetResponse } from '@/services/api.ts';
|
||||
import Button from '@/components/ui/Button.tsx';
|
||||
|
||||
interface LinkBudgetPanelProps {
|
||||
/** Optional RX coordinates from map click */
|
||||
rxPoint?: { lat: number; lon: number } | null;
|
||||
/** Callback to enable map click mode */
|
||||
onRequestMapClick?: () => void;
|
||||
/** Callback when panel is closed */
|
||||
onClose?: () => void;
|
||||
}
|
||||
|
||||
export default function LinkBudgetPanel({
|
||||
rxPoint,
|
||||
onRequestMapClick,
|
||||
onClose,
|
||||
}: LinkBudgetPanelProps) {
|
||||
const sites = useSitesStore((s) => s.sites);
|
||||
const selectedSiteId = useSitesStore((s) => s.selectedSiteId);
|
||||
|
||||
// TX parameters (from selected site or manual)
|
||||
const selectedSite = sites.find((s) => s.id === selectedSiteId);
|
||||
|
||||
// TX height override for what-if scenarios (null = use site default)
|
||||
const [txHeightOverride, setTxHeightOverride] = useState<number | null>(null);
|
||||
const txHeight = txHeightOverride ?? selectedSite?.height ?? 30;
|
||||
|
||||
// Reset height override when site changes
|
||||
useEffect(() => {
|
||||
setTxHeightOverride(null);
|
||||
}, [selectedSiteId]);
|
||||
|
||||
// RX coordinates
|
||||
const [rxLat, setRxLat] = useState<string>(rxPoint?.lat?.toFixed(6) || '');
|
||||
const [rxLon, setRxLon] = useState<string>(rxPoint?.lon?.toFixed(6) || '');
|
||||
|
||||
// Additional TX/RX parameters
|
||||
const [txCableLoss, setTxCableLoss] = useState<number>(2);
|
||||
const [rxGain, setRxGain] = useState<number>(0);
|
||||
const [rxCableLoss, setRxCableLoss] = useState<number>(0);
|
||||
const [rxSensitivity, setRxSensitivity] = useState<number>(-100);
|
||||
const [rxHeight, setRxHeight] = useState<number>(1.5);
|
||||
|
||||
// Result
|
||||
const [result, setResult] = useState<LinkBudgetResponse | null>(null);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
|
||||
// Update RX coordinates when rxPoint changes
|
||||
useEffect(() => {
|
||||
if (rxPoint) {
|
||||
setRxLat(rxPoint.lat.toFixed(6));
|
||||
setRxLon(rxPoint.lon.toFixed(6));
|
||||
}
|
||||
}, [rxPoint]);
|
||||
|
||||
const calculateLinkBudget = async () => {
|
||||
if (!selectedSite) {
|
||||
setError('Select a site first');
|
||||
return;
|
||||
}
|
||||
|
||||
const rxLatNum = parseFloat(rxLat);
|
||||
const rxLonNum = parseFloat(rxLon);
|
||||
if (isNaN(rxLatNum) || isNaN(rxLonNum)) {
|
||||
setError('Enter valid RX coordinates');
|
||||
return;
|
||||
}
|
||||
|
||||
setLoading(true);
|
||||
setError(null);
|
||||
|
||||
try {
|
||||
const response = await api.calculateLinkBudget({
|
||||
tx_lat: selectedSite.lat,
|
||||
tx_lon: selectedSite.lon,
|
||||
tx_power_dbm: selectedSite.power,
|
||||
tx_gain_dbi: selectedSite.gain,
|
||||
tx_cable_loss_db: txCableLoss,
|
||||
tx_height_m: txHeight,
|
||||
rx_lat: rxLatNum,
|
||||
rx_lon: rxLonNum,
|
||||
rx_gain_dbi: rxGain,
|
||||
rx_cable_loss_db: rxCableLoss,
|
||||
rx_sensitivity_dbm: rxSensitivity,
|
||||
rx_height_m: rxHeight,
|
||||
frequency_mhz: selectedSite.frequency,
|
||||
});
|
||||
setResult(response);
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : 'Calculation failed');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const marginColor = result
|
||||
? result.margin_db >= 10
|
||||
? 'text-green-600 dark:text-green-400'
|
||||
: result.margin_db >= 0
|
||||
? 'text-yellow-600 dark:text-yellow-400'
|
||||
: 'text-red-600 dark:text-red-400'
|
||||
: '';
|
||||
|
||||
return (
|
||||
<div
|
||||
className="bg-white dark:bg-dark-surface border border-gray-200 dark:border-dark-border rounded-lg shadow-sm p-4 space-y-4 w-80"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
onMouseDown={(e) => e.stopPropagation()}
|
||||
onPointerDown={(e) => e.stopPropagation()}
|
||||
>
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between">
|
||||
<h3 className="text-sm font-semibold text-gray-800 dark:text-dark-text flex items-center gap-2">
|
||||
<span className="text-lg">📡</span>
|
||||
Link Budget Calculator
|
||||
</h3>
|
||||
{onClose && (
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-gray-400 hover:text-gray-600 dark:hover:text-white text-sm"
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* TX Section */}
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs font-medium text-gray-500 dark:text-dark-muted uppercase">
|
||||
Transmitter
|
||||
</div>
|
||||
{selectedSite ? (
|
||||
<div className="text-xs space-y-1 bg-gray-50 dark:bg-dark-bg p-2 rounded text-gray-700 dark:text-dark-text">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Site:</span>
|
||||
<span className="font-medium">{selectedSite.name}</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Power:</span>
|
||||
<span>{selectedSite.power} dBm</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Gain:</span>
|
||||
<span>{selectedSite.gain} dBi</span>
|
||||
</div>
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Height:</span>
|
||||
<div className="flex items-center">
|
||||
<input
|
||||
type="number"
|
||||
value={txHeight}
|
||||
onChange={(e) => setTxHeightOverride(parseFloat(e.target.value) || 30)}
|
||||
className="w-16 text-right text-xs px-1 py-0.5 border rounded dark:bg-dark-bg dark:border-dark-border dark:text-dark-text"
|
||||
min="1"
|
||||
max="300"
|
||||
step="1"
|
||||
/>
|
||||
<span className="text-gray-400 dark:text-dark-muted ml-1">m</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Frequency:</span>
|
||||
<span>{selectedSite.frequency} MHz</span>
|
||||
</div>
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Cable Loss:</span>
|
||||
<input
|
||||
type="number"
|
||||
value={txCableLoss}
|
||||
onChange={(e) => setTxCableLoss(parseFloat(e.target.value) || 0)}
|
||||
className="w-16 text-right text-xs px-1 py-0.5 border rounded dark:bg-dark-bg dark:border-dark-border dark:text-dark-text"
|
||||
step="0.5"
|
||||
/>
|
||||
<span className="text-gray-400 dark:text-dark-muted ml-1">dB</span>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="text-xs text-gray-400 dark:text-dark-muted italic">Select a site on the map</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* RX Section */}
|
||||
<div className="space-y-2">
|
||||
<div className="text-xs font-medium text-gray-500 dark:text-dark-muted uppercase">
|
||||
Receiver
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">Latitude</label>
|
||||
<input
|
||||
type="text"
|
||||
value={rxLat}
|
||||
onChange={(e) => setRxLat(e.target.value)}
|
||||
placeholder="48.4500"
|
||||
className="w-full text-xs px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">Longitude</label>
|
||||
<input
|
||||
type="text"
|
||||
value={rxLon}
|
||||
onChange={(e) => setRxLon(e.target.value)}
|
||||
placeholder="35.0400"
|
||||
className="w-full text-xs px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
{onRequestMapClick && (
|
||||
<Button size="sm" variant="secondary" onClick={onRequestMapClick} className="w-full">
|
||||
📍 Click on Map to Set RX Point
|
||||
</Button>
|
||||
)}
|
||||
<div className="grid grid-cols-2 gap-2 text-xs">
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">RX Gain (dBi)</label>
|
||||
<input
|
||||
type="number"
|
||||
value={rxGain}
|
||||
onChange={(e) => setRxGain(parseFloat(e.target.value) || 0)}
|
||||
className="w-full px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">RX Height (m)</label>
|
||||
<input
|
||||
type="number"
|
||||
value={rxHeight}
|
||||
onChange={(e) => setRxHeight(parseFloat(e.target.value) || 1.5)}
|
||||
className="w-full px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">Sensitivity (dBm)</label>
|
||||
<input
|
||||
type="number"
|
||||
value={rxSensitivity}
|
||||
onChange={(e) => setRxSensitivity(parseFloat(e.target.value) || -100)}
|
||||
className="w-full px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[10px] text-gray-400 dark:text-dark-muted">Cable Loss (dB)</label>
|
||||
<input
|
||||
type="number"
|
||||
value={rxCableLoss}
|
||||
onChange={(e) => setRxCableLoss(parseFloat(e.target.value) || 0)}
|
||||
className="w-full px-2 py-1 border rounded dark:bg-dark-bg dark:border-dark-border text-gray-800 dark:text-dark-text"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Calculate Button */}
|
||||
<Button
|
||||
onClick={calculateLinkBudget}
|
||||
disabled={loading || !selectedSite}
|
||||
className="w-full"
|
||||
>
|
||||
{loading ? 'Calculating...' : 'Calculate Link Budget'}
|
||||
</Button>
|
||||
|
||||
{/* Error */}
|
||||
{error && (
|
||||
<div className="text-xs text-red-500 bg-red-50 dark:bg-red-900/20 p-2 rounded">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Results */}
|
||||
{result && (
|
||||
<div className="space-y-2 border-t pt-3 dark:border-dark-border">
|
||||
<div className="text-xs font-medium text-gray-500 dark:text-dark-muted uppercase">
|
||||
Results
|
||||
</div>
|
||||
|
||||
{/* Path Info */}
|
||||
<div className="text-xs space-y-1 bg-gray-50 dark:bg-dark-bg p-2 rounded text-gray-700 dark:text-dark-text">
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">Distance:</span>
|
||||
<span className="font-medium">{result.distance_km.toFixed(2)} km</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span className="text-gray-500 dark:text-dark-muted">LOS:</span>
|
||||
<span className={result.los_clear ? 'text-green-600 dark:text-green-400' : 'text-red-500 dark:text-red-400'}>
|
||||
{result.los_clear ? '✓ Clear' : '✗ Blocked'}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Link Budget Table */}
|
||||
<div className="text-xs space-y-1 bg-blue-50 dark:bg-blue-900/20 p-2 rounded text-gray-700 dark:text-dark-text">
|
||||
<div className="flex justify-between">
|
||||
<span>EIRP:</span>
|
||||
<span className="font-mono">{result.eirp_dbm.toFixed(1)} dBm</span>
|
||||
</div>
|
||||
<div className="flex justify-between text-gray-500 dark:text-dark-muted">
|
||||
<span>- FSPL:</span>
|
||||
<span className="font-mono">{result.fspl_db.toFixed(1)} dB</span>
|
||||
</div>
|
||||
<div className="flex justify-between text-gray-500 dark:text-dark-muted">
|
||||
<span>- Terrain Loss:</span>
|
||||
<span className="font-mono">{result.terrain_loss_db.toFixed(1)} dB</span>
|
||||
</div>
|
||||
<div className="flex justify-between border-t pt-1 dark:border-dark-border">
|
||||
<span>= Total Path Loss:</span>
|
||||
<span className="font-mono font-medium">{result.total_path_loss_db.toFixed(1)} dB</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Final Result */}
|
||||
<div className="text-xs space-y-1 bg-gray-100 dark:bg-dark-border p-2 rounded text-gray-700 dark:text-dark-text">
|
||||
<div className="flex justify-between">
|
||||
<span>Received Power:</span>
|
||||
<span className="font-mono font-medium">{result.rx_power_dbm.toFixed(1)} dBm</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
<span>RX Sensitivity:</span>
|
||||
<span className="font-mono">{rxSensitivity} dBm</span>
|
||||
</div>
|
||||
<div className={`flex justify-between font-bold ${marginColor}`}>
|
||||
<span>Link Margin:</span>
|
||||
<span className="font-mono">{result.margin_db.toFixed(1)} dB</span>
|
||||
</div>
|
||||
<div className={`text-center text-sm font-bold mt-2 ${marginColor}`}>
|
||||
{result.status === 'OK' ? '✓ LINK OK' : '✗ LINK FAIL'}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Obstructions */}
|
||||
{result.obstructions && result.obstructions.length > 0 && (
|
||||
<div className="text-xs text-orange-600 dark:text-orange-400 bg-orange-50 dark:bg-orange-900/20 p-2 rounded">
|
||||
<div className="font-medium mb-1">⚠ Terrain Obstructions:</div>
|
||||
{result.obstructions.slice(0, 3).map((obs, i) => (
|
||||
<div key={i}>
|
||||
@ {(obs.distance_m / 1000).toFixed(2)} km: +{obs.height_above_los_m.toFixed(1)} m above LOS
|
||||
</div>
|
||||
))}
|
||||
{result.obstructions.length > 3 && (
|
||||
<div className="text-gray-500">...and {result.obstructions.length - 3} more</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
import { useState, useCallback, useMemo } from 'react';
|
||||
import type { Site } from '@/types/index.ts';
|
||||
import { useSitesStore } from '@/store/sites.ts';
|
||||
import { useToolStore } from '@/store/tools.ts';
|
||||
import { useToastStore } from '@/components/ui/Toast.tsx';
|
||||
import Button from '@/components/ui/Button.tsx';
|
||||
import ConfirmDialog from '@/components/ui/ConfirmDialog.tsx';
|
||||
@@ -75,9 +76,20 @@ export default function SiteList({ onEditSite, onAddSite }: SiteListProps) {
|
||||
const deleteSite = useSitesStore((s) => s.deleteSite);
|
||||
const selectSite = useSitesStore((s) => s.selectSite);
|
||||
const selectedSiteId = useSitesStore((s) => s.selectedSiteId);
|
||||
const isPlacingMode = useSitesStore((s) => s.isPlacingMode);
|
||||
const togglePlacingMode = useSitesStore((s) => s.togglePlacingMode);
|
||||
const selectedSiteIds = useSitesStore((s) => s.selectedSiteIds);
|
||||
|
||||
// Tool store for site placement mode
|
||||
const activeTool = useToolStore((s) => s.activeTool);
|
||||
const setActiveTool = useToolStore((s) => s.setActiveTool);
|
||||
const clearTool = useToolStore((s) => s.clearTool);
|
||||
const isPlacingMode = activeTool === 'site-placement';
|
||||
const togglePlacingMode = useCallback(() => {
|
||||
if (isPlacingMode) {
|
||||
clearTool();
|
||||
} else {
|
||||
setActiveTool('site-placement');
|
||||
}
|
||||
}, [isPlacingMode, setActiveTool, clearTool]);
|
||||
const toggleSiteSelection = useSitesStore((s) => s.toggleSiteSelection);
|
||||
const selectAllSites = useSitesStore((s) => s.selectAllSites);
|
||||
const clearSelection = useSitesStore((s) => s.clearSelection);
|
||||
|
||||
@@ -2,6 +2,7 @@ import { useEffect } from 'react';
|
||||
import { useSitesStore } from '@/store/sites.ts';
|
||||
import { useCoverageStore } from '@/store/coverage.ts';
|
||||
import { useSettingsStore } from '@/store/settings.ts';
|
||||
import { useToolStore } from '@/store/tools.ts';
|
||||
import { useToastStore } from '@/components/ui/Toast.tsx';
|
||||
|
||||
interface ShortcutHandlers {
|
||||
@@ -63,7 +64,7 @@ export function useKeyboardShortcuts({
|
||||
// Escape always works
|
||||
if (e.key === 'Escape') {
|
||||
useSitesStore.getState().selectSite(null);
|
||||
useSitesStore.getState().setPlacingMode(false);
|
||||
useToolStore.getState().clearTool();
|
||||
onCloseForm();
|
||||
return;
|
||||
}
|
||||
@@ -76,7 +77,7 @@ export function useKeyboardShortcuts({
|
||||
switch (e.key.toUpperCase()) {
|
||||
case 'S': // Shift+S: New site (place mode)
|
||||
e.preventDefault();
|
||||
useSitesStore.getState().setPlacingMode(true);
|
||||
useToolStore.getState().setActiveTool('site-placement');
|
||||
useToastStore.getState().addToast('Click on map to place new site', 'info');
|
||||
return;
|
||||
case 'C': // Shift+C: Clear coverage
|
||||
|
||||
@@ -35,6 +35,31 @@
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 0;
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
/* Remove grab cursor from interactive layers */
|
||||
.leaflet-interactive {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
/* Grabbing only when actually dragging */
|
||||
.leaflet-container.leaflet-dragging,
|
||||
.leaflet-container:active {
|
||||
cursor: grabbing !important;
|
||||
}
|
||||
|
||||
/* Tool-specific cursors (applied via JS class toggle) */
|
||||
.leaflet-container.tool-ruler {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.tool-rx-placement {
|
||||
cursor: crosshair !important;
|
||||
}
|
||||
|
||||
.leaflet-container.tool-site-placement {
|
||||
cursor: cell !important;
|
||||
}
|
||||
|
||||
/* Dark mode map tiles (invert brightness slightly) */
|
||||
|
||||
@@ -271,6 +271,51 @@ class ApiService {
|
||||
const data = await response.json();
|
||||
return data.profile ?? data;
|
||||
}
|
||||
|
||||
// === Link Budget API ===
|
||||
|
||||
async calculateLinkBudget(request: LinkBudgetRequest): Promise<LinkBudgetResponse> {
|
||||
const response = await fetch(`${API_BASE}/api/coverage/link-budget`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const error = await response.json().catch(() => ({ detail: 'Link budget calculation failed' }));
|
||||
throw new Error(error.detail || 'Link budget calculation failed');
|
||||
}
|
||||
return response.json();
|
||||
}
|
||||
|
||||
// === Fresnel Profile API ===
|
||||
|
||||
async getFresnelProfile(request: FresnelProfileRequest): Promise<FresnelProfileResponse> {
|
||||
const response = await fetch(`${API_BASE}/api/coverage/fresnel-profile`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const error = await response.json().catch(() => ({ detail: 'Fresnel profile calculation failed' }));
|
||||
throw new Error(error.detail || 'Fresnel profile calculation failed');
|
||||
}
|
||||
return response.json();
|
||||
}
|
||||
|
||||
// === Interference API ===
|
||||
|
||||
async calculateInterference(request: CoverageRequest): Promise<InterferenceResponse> {
|
||||
const response = await fetch(`${API_BASE}/api/coverage/interference`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify(request),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const error = await response.json().catch(() => ({ detail: 'Interference calculation failed' }));
|
||||
throw new Error(error.detail || 'Interference calculation failed');
|
||||
}
|
||||
return response.json();
|
||||
}
|
||||
}
|
||||
|
||||
// === Region types ===
|
||||
@@ -328,4 +373,113 @@ export interface TerrainProfilePoint {
|
||||
distance: number;
|
||||
}
|
||||
|
||||
// === Link Budget types ===
|
||||
|
||||
export interface LinkBudgetRequest {
|
||||
tx_lat: number;
|
||||
tx_lon: number;
|
||||
tx_power_dbm: number;
|
||||
tx_gain_dbi: number;
|
||||
tx_cable_loss_db: number;
|
||||
tx_height_m: number;
|
||||
rx_lat: number;
|
||||
rx_lon: number;
|
||||
rx_gain_dbi: number;
|
||||
rx_cable_loss_db: number;
|
||||
rx_sensitivity_dbm: number;
|
||||
rx_height_m: number;
|
||||
frequency_mhz: number;
|
||||
}
|
||||
|
||||
export interface LinkBudgetResponse {
|
||||
distance_km: number;
|
||||
distance_m: number;
|
||||
tx_elevation_m: number;
|
||||
rx_elevation_m: number;
|
||||
eirp_dbm: number;
|
||||
fspl_db: number;
|
||||
terrain_loss_db: number;
|
||||
total_path_loss_db: number;
|
||||
los_clear: boolean;
|
||||
obstructions: { distance_m: number; height_above_los_m: number }[];
|
||||
rx_power_dbm: number;
|
||||
margin_db: number;
|
||||
status: 'OK' | 'FAIL';
|
||||
link_budget: {
|
||||
tx_power_dbm: number;
|
||||
tx_gain_dbi: number;
|
||||
tx_cable_loss_db: number;
|
||||
rx_gain_dbi: number;
|
||||
rx_cable_loss_db: number;
|
||||
rx_sensitivity_dbm: number;
|
||||
};
|
||||
}
|
||||
|
||||
// === Fresnel Profile types ===
|
||||
|
||||
export interface FresnelProfileRequest {
|
||||
tx_lat: number;
|
||||
tx_lon: number;
|
||||
tx_height_m: number;
|
||||
rx_lat: number;
|
||||
rx_lon: number;
|
||||
rx_height_m: number;
|
||||
frequency_mhz: number;
|
||||
num_points?: number;
|
||||
}
|
||||
|
||||
export interface FresnelProfilePoint {
|
||||
distance: number;
|
||||
lat: number;
|
||||
lon: number;
|
||||
terrain_elevation: number;
|
||||
los_height: number;
|
||||
fresnel_top: number;
|
||||
fresnel_bottom: number;
|
||||
f1_radius: number;
|
||||
clearance: number;
|
||||
}
|
||||
|
||||
export interface FresnelProfileResponse {
|
||||
profile: FresnelProfilePoint[];
|
||||
total_distance_m: number;
|
||||
tx_elevation: number;
|
||||
rx_elevation: number;
|
||||
frequency_mhz: number;
|
||||
wavelength_m: number;
|
||||
los_clear: boolean;
|
||||
fresnel_clear: boolean;
|
||||
fresnel_clear_pct: number;
|
||||
worst_clearance_m: number;
|
||||
estimated_loss_db: number;
|
||||
recommendation: string;
|
||||
}
|
||||
|
||||
// === Interference types ===
|
||||
|
||||
export interface InterferencePoint {
|
||||
lat: number;
|
||||
lon: number;
|
||||
ci_ratio_db: number;
|
||||
best_server_idx: number;
|
||||
best_server_rsrp: number;
|
||||
}
|
||||
|
||||
export interface InterferenceResponse {
|
||||
points: InterferencePoint[];
|
||||
count: number;
|
||||
stats: {
|
||||
min_ci_db: number;
|
||||
max_ci_db: number;
|
||||
avg_ci_db: number;
|
||||
good_coverage_pct: number;
|
||||
marginal_coverage_pct: number;
|
||||
interference_dominant_pct: number;
|
||||
};
|
||||
computation_time: number;
|
||||
sites: { name: string; frequency_mhz: number }[];
|
||||
frequency_groups: Record<number, number>;
|
||||
warning: string | null;
|
||||
}
|
||||
|
||||
export const api = new ApiService();
|
||||
|
||||
@@ -3,6 +3,8 @@ import { persist } from 'zustand/middleware';
|
||||
|
||||
type Theme = 'light' | 'dark' | 'system';
|
||||
|
||||
type CoverageRenderer = 'webgl-texture' | 'webgl-radial' | 'canvas';
|
||||
|
||||
interface SettingsState {
|
||||
theme: Theme;
|
||||
showTerrain: boolean;
|
||||
@@ -13,6 +15,8 @@ interface SettingsState {
|
||||
showBoundary: boolean;
|
||||
showElevationOverlay: boolean;
|
||||
elevationOpacity: number;
|
||||
useWebGLCoverage: boolean;
|
||||
coverageRenderer: CoverageRenderer;
|
||||
setTheme: (theme: Theme) => void;
|
||||
setShowBoundary: (show: boolean) => void;
|
||||
setShowTerrain: (show: boolean) => void;
|
||||
@@ -22,6 +26,8 @@ interface SettingsState {
|
||||
setShowElevationInfo: (show: boolean) => void;
|
||||
setShowElevationOverlay: (show: boolean) => void;
|
||||
setElevationOpacity: (opacity: number) => void;
|
||||
setUseWebGLCoverage: (use: boolean) => void;
|
||||
setCoverageRenderer: (renderer: CoverageRenderer) => void;
|
||||
}
|
||||
|
||||
function applyTheme(theme: Theme) {
|
||||
@@ -47,6 +53,8 @@ export const useSettingsStore = create<SettingsState>()(
|
||||
showBoundary: false,
|
||||
showElevationOverlay: false,
|
||||
elevationOpacity: 0.5,
|
||||
useWebGLCoverage: true, // Default to WebGL smooth rendering
|
||||
coverageRenderer: 'webgl-radial' as CoverageRenderer, // Default to radial gradients
|
||||
setTheme: (theme: Theme) => {
|
||||
set({ theme });
|
||||
applyTheme(theme);
|
||||
@@ -59,9 +67,24 @@ export const useSettingsStore = create<SettingsState>()(
|
||||
setShowBoundary: (show: boolean) => set({ showBoundary: show }),
|
||||
setShowElevationOverlay: (show: boolean) => set({ showElevationOverlay: show }),
|
||||
setElevationOpacity: (opacity: number) => set({ elevationOpacity: opacity }),
|
||||
setUseWebGLCoverage: (use: boolean) => set({ useWebGLCoverage: use }),
|
||||
setCoverageRenderer: (renderer: CoverageRenderer) => set({ coverageRenderer: renderer }),
|
||||
}),
|
||||
{
|
||||
name: 'rfcp-settings',
|
||||
version: 3, // v3: Add coverageRenderer setting
|
||||
migrate: (persistedState: unknown, version: number) => {
|
||||
const state = persistedState as Partial<SettingsState>;
|
||||
if (version < 2) {
|
||||
// v2: Reset useWebGLCoverage to true (was stuck on false from early WebGL failures)
|
||||
state.useWebGLCoverage = true;
|
||||
}
|
||||
if (version < 3) {
|
||||
// v3: Add coverageRenderer, default to radial
|
||||
state.coverageRenderer = 'webgl-radial';
|
||||
}
|
||||
return state as SettingsState;
|
||||
},
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
26
frontend/src/store/tools.ts
Normal file
26
frontend/src/store/tools.ts
Normal file
@@ -0,0 +1,26 @@
|
||||
/**
|
||||
* Tool Mode Store
|
||||
*
|
||||
* Single source of truth for which tool is currently active.
|
||||
* Only the active tool receives map click events.
|
||||
*/
|
||||
|
||||
import { create } from 'zustand';
|
||||
|
||||
export type ActiveTool =
|
||||
| 'none' // Default — pan/zoom only, no click actions
|
||||
| 'ruler' // Distance measurement, click to add points
|
||||
| 'rx-placement' // Link Budget RX point, single click
|
||||
| 'site-placement'; // Place new site on map
|
||||
|
||||
interface ToolState {
|
||||
activeTool: ActiveTool;
|
||||
setActiveTool: (tool: ActiveTool) => void;
|
||||
clearTool: () => void;
|
||||
}
|
||||
|
||||
export const useToolStore = create<ToolState>((set) => ({
|
||||
activeTool: 'none',
|
||||
setActiveTool: (tool) => set({ activeTool: tool }),
|
||||
clearTool: () => set({ activeTool: 'none' }),
|
||||
}));
|
||||
6
installer/package-lock.json
generated
Normal file
6
installer/package-lock.json
generated
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"name": "installer",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {}
|
||||
}
|
||||
1
installer/package.json
Normal file
1
installer/package.json
Normal file
@@ -0,0 +1 @@
|
||||
{}
|
||||
7
rfcp-backend.log.txt
Normal file
7
rfcp-backend.log.txt
Normal file
@@ -0,0 +1,7 @@
|
||||
[CUDA DLL Hook] Added DLL directory: C:\Program Files\RFCP\resources\backend\rfcp-server\_internal
|
||||
[RFCP] run_server.py starting...
|
||||
[RFCP] Frozen mode, base dir: C:\Program Files\RFCP\resources\backend\rfcp-server
|
||||
[err] Traceback (most recent call last):
|
||||
File "run_server.py", line 33, in <module>
|
||||
[err] PermissionError: [Errno 13] Permission denied: 'C:\\Program Files\\RFCP\\resources\\backend\\rfcp-server\\rfcp-server.log'
|
||||
[PYI-17768:ERROR] Failed to execute script 'run_server' due to unhandled exception!
|
||||
43
rfcp-main.log.txt
Normal file
43
rfcp-main.log.txt
Normal file
@@ -0,0 +1,43 @@
|
||||
[2026-02-04T18:01:12.043Z] Log file: C:\Users\ether\AppData\Roaming\rfcp-desktop\logs\rfcp-main.log
|
||||
[2026-02-04T18:01:12.049Z] Platform: win32, Electron: 28.3.3
|
||||
[2026-02-04T18:01:12.049Z] isDev: false
|
||||
[2026-02-04T18:01:12.050Z] userData: C:\Users\ether\AppData\Roaming\rfcp-desktop
|
||||
[2026-02-04T18:01:12.050Z] resourcesPath: C:\Program Files\RFCP\resources
|
||||
[2026-02-04T18:01:12.145Z] Data path: C:\Users\ether\AppData\Roaming\rfcp-desktop\data
|
||||
[2026-02-04T18:01:12.146Z] Starting production backend: C:\Program Files\RFCP\resources\backend\rfcp-server\rfcp-server.exe
|
||||
[2026-02-04T18:01:12.146Z] Backend cwd: C:\Program Files\RFCP\resources\backend\rfcp-server
|
||||
[2026-02-04T18:01:12.578Z] Backend PID: 17768
|
||||
[2026-02-04T18:01:13.206Z] [Backend] [CUDA DLL Hook] Added DLL directory: C:\Program Files\RFCP\resources\backend\rfcp-server\_internal
|
||||
[RFCP] run_server.py starting...
|
||||
[RFCP] Frozen mode, base dir: C:\Program Files\RFCP\resources\backend\rfcp-server
|
||||
[2026-02-04T18:01:13.214Z] [Backend:err] Traceback (most recent call last):
|
||||
File "run_server.py", line 33, in <module>
|
||||
[2026-02-04T18:01:13.215Z] [Backend:err] PermissionError: [Errno 13] Permission denied: 'C:\\Program Files\\RFCP\\resources\\backend\\rfcp-server\\rfcp-server.log'
|
||||
[PYI-17768:ERROR] Failed to execute script 'run_server' due to unhandled exception!
|
||||
[2026-02-04T18:01:13.300Z] Backend exited: code=1, signal=null
|
||||
[2026-02-04T18:01:42.980Z] Backend failed to start within 30s
|
||||
[2026-02-04T18:02:08.444Z] [CLOSE] before-quit fired, isQuitting=false
|
||||
[2026-02-04T18:02:08.445Z] [SHUTDOWN] Starting graceful shutdown...
|
||||
[2026-02-04T18:02:08.447Z] [SHUTDOWN] Backend did not respond — force killing
|
||||
[2026-02-04T18:02:08.447Z] [KILL] killBackend() called, platform=win32, PID=17768
|
||||
[2026-02-04T18:02:08.447Z] [KILL] Running: taskkill /F /T /PID 17768
|
||||
[2026-02-04T18:02:09.459Z] [KILL] Primary kill failed: Command failed: taskkill /F /T /PID 17768, trying SIGKILL fallback
|
||||
[2026-02-04T18:02:09.459Z] [KILL] Fallback SIGKILL sent via process handle
|
||||
[2026-02-04T18:02:09.459Z] [KILL] Backend cleanup complete (PID was 17768)
|
||||
[2026-02-04T18:02:09.459Z] [KILL] === Starting aggressive kill ===
|
||||
[2026-02-04T18:02:09.459Z] [KILL] Strategy 1: taskkill /F /IM
|
||||
[2026-02-04T18:02:09.636Z] [KILL] Strategy 1: No processes or already killed
|
||||
[2026-02-04T18:02:09.636Z] [KILL] Strategy 3: PowerShell Stop-Process
|
||||
[2026-02-04T18:02:10.206Z] [KILL] Strategy 3: PowerShell failed or no processes
|
||||
[2026-02-04T18:02:10.206Z] [KILL] Strategy 4: PowerShell CimInstance Terminate
|
||||
[2026-02-04T18:02:10.691Z] [KILL] Strategy 4: SUCCESS
|
||||
[2026-02-04T18:02:10.691Z] [KILL] === Kill sequence complete ===
|
||||
[2026-02-04T18:02:11.194Z] [SHUTDOWN] Shutdown complete
|
||||
[2026-02-04T18:02:11.214Z] [KILL] === Starting aggressive kill ===
|
||||
[2026-02-04T18:02:11.214Z] [KILL] Strategy 1: taskkill /F /IM
|
||||
[2026-02-04T18:02:11.378Z] [KILL] Strategy 1: No processes or already killed
|
||||
[2026-02-04T18:02:11.378Z] [KILL] Strategy 3: PowerShell Stop-Process
|
||||
[2026-02-04T18:02:11.655Z] [KILL] Strategy 3: PowerShell failed or no processes
|
||||
[2026-02-04T18:02:11.655Z] [KILL] Strategy 4: PowerShell CimInstance Terminate
|
||||
[2026-02-04T18:02:12.087Z] [KILL] Strategy 4: SUCCESS
|
||||
[2026-02-04T18:02:12.087Z] [KILL] === Kill sequence complete ===
|
||||
Reference in New Issue
Block a user