feat: show peer scanners on 3D map
- Added peer scanner markers to MapLibre 3D view - Peer scanners shown with cyan icon and absolute position - Styled with distinct color and shadow Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -961,6 +961,19 @@ body {
|
|||||||
z-index: 100;
|
z-index: 100;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.marker-3d.peer-scanner .marker-icon {
|
||||||
|
background: #00c8ff;
|
||||||
|
box-shadow: 0 0 15px rgba(0, 200, 255, 0.6), 0 2px 6px rgba(0, 0, 0, 0.4);
|
||||||
|
border: 2px solid #ffffff;
|
||||||
|
width: 22px;
|
||||||
|
height: 22px;
|
||||||
|
z-index: 90;
|
||||||
|
}
|
||||||
|
|
||||||
|
.marker-3d.peer-scanner .marker-floor {
|
||||||
|
background: rgba(0, 200, 255, 0.9);
|
||||||
|
}
|
||||||
|
|
||||||
/* Floor Controls */
|
/* Floor Controls */
|
||||||
.floor-section {
|
.floor-section {
|
||||||
display: block;
|
display: block;
|
||||||
|
|||||||
@@ -1445,6 +1445,41 @@ function update3DMarkers() {
|
|||||||
scannerMarker._deviceId = '__scanner__';
|
scannerMarker._deviceId = '__scanner__';
|
||||||
map3dMarkers.push(scannerMarker);
|
map3dMarkers.push(scannerMarker);
|
||||||
|
|
||||||
|
// Add peer scanner markers (absolute positions)
|
||||||
|
fetch('/api/peers')
|
||||||
|
.then(r => r.json())
|
||||||
|
.then(data => {
|
||||||
|
(data.peers || []).forEach(peer => {
|
||||||
|
if (peer.latitude && peer.longitude) {
|
||||||
|
const peerFloor = peer.floor ?? 0;
|
||||||
|
const peerOffset = (peerFloor - groundFloor) * pixelsPerFloor;
|
||||||
|
|
||||||
|
const peerEl = document.createElement('div');
|
||||||
|
peerEl.className = 'marker-3d peer-scanner';
|
||||||
|
peerEl.innerHTML = `<div class="marker-icon">📡</div><div class="marker-floor">F${peerFloor}</div>`;
|
||||||
|
peerEl.title = `${peer.name || peer.scanner_id} - Floor ${peerFloor}`;
|
||||||
|
|
||||||
|
const peerMarker = new maplibregl.Marker({
|
||||||
|
element: peerEl,
|
||||||
|
offset: [0, -peerOffset]
|
||||||
|
})
|
||||||
|
.setLngLat([peer.longitude, peer.latitude])
|
||||||
|
.setPopup(new maplibregl.Popup().setHTML(`
|
||||||
|
<strong>📡 ${peer.name || peer.scanner_id}</strong><br>
|
||||||
|
Floor: ${peerFloor}<br>
|
||||||
|
Lat: ${peer.latitude.toFixed(6)}<br>
|
||||||
|
Lon: ${peer.longitude.toFixed(6)}<br>
|
||||||
|
<div style="font-size:0.7rem;color:#888;margin-top:4px;">Peer scanner (read-only)</div>
|
||||||
|
`))
|
||||||
|
.addTo(map3d);
|
||||||
|
|
||||||
|
peerMarker._deviceId = `__peer_${peer.scanner_id}__`;
|
||||||
|
map3dMarkers.push(peerMarker);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(err => console.log('[Peers] Error loading peers:', err));
|
||||||
|
|
||||||
if (!scanData) return;
|
if (!scanData) return;
|
||||||
|
|
||||||
const wifi = filters.wifi ? (scanData.wifi_networks || []) : [];
|
const wifi = filters.wifi ? (scanData.wifi_networks || []) : [];
|
||||||
|
|||||||
Reference in New Issue
Block a user