Fix connection error handling in index_owntrack.html
- Add HTTP status check before parsing JSON - Clear old markers and polylines on refresh to prevent stacking - Improve error logging for better debugging 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -87,12 +87,25 @@
|
|||||||
// Auto-Refresh State
|
// Auto-Refresh State
|
||||||
let autoRefreshEnabled = true;
|
let autoRefreshEnabled = true;
|
||||||
let refreshInterval = null;
|
let refreshInterval = null;
|
||||||
|
let markers = [];
|
||||||
|
let polylines = [];
|
||||||
|
|
||||||
async function loadLocations() {
|
async function loadLocations() {
|
||||||
try {
|
try {
|
||||||
const response = await fetch(API_URL);
|
const response = await fetch(API_URL);
|
||||||
|
|
||||||
|
if (!response.ok) {
|
||||||
|
throw new Error(`HTTP error! status: ${response.status}`);
|
||||||
|
}
|
||||||
|
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
|
|
||||||
|
// Alte Marker und Linien entfernen
|
||||||
|
markers.forEach(marker => map.removeLayer(marker));
|
||||||
|
polylines.forEach(polyline => map.removeLayer(polyline));
|
||||||
|
markers = [];
|
||||||
|
polylines = [];
|
||||||
|
|
||||||
document.getElementById('status').innerHTML =
|
document.getElementById('status').innerHTML =
|
||||||
`Punkte: ${data.total_points || 0}<br>` +
|
`Punkte: ${data.total_points || 0}<br>` +
|
||||||
`Status: ${data.success ? '✅ Verbunden' : '❌ Fehler'}`;
|
`Status: ${data.success ? '✅ Verbunden' : '❌ Fehler'}`;
|
||||||
@@ -114,22 +127,25 @@
|
|||||||
popupContent += `<br>🚗 Speed: ${speedKmh} km/h`;
|
popupContent += `<br>🚗 Speed: ${speedKmh} km/h`;
|
||||||
}
|
}
|
||||||
|
|
||||||
L.marker([loc.latitude, loc.longitude])
|
const marker = L.marker([loc.latitude, loc.longitude])
|
||||||
.addTo(map)
|
.addTo(map)
|
||||||
.bindPopup(popupContent)
|
.bindPopup(popupContent)
|
||||||
.openPopup();
|
.openPopup();
|
||||||
|
|
||||||
|
markers.push(marker);
|
||||||
|
|
||||||
map.setView([loc.latitude, loc.longitude], 15);
|
map.setView([loc.latitude, loc.longitude], 15);
|
||||||
|
|
||||||
// Historie als Linie
|
// Historie als Linie
|
||||||
if (data.history && data.history.length > 1) {
|
if (data.history && data.history.length > 1) {
|
||||||
const coords = data.history.map(h => [h.latitude, h.longitude]);
|
const coords = data.history.map(h => [h.latitude, h.longitude]);
|
||||||
L.polyline(coords, {color: 'blue', weight: 3}).addTo(map);
|
const polyline = L.polyline(coords, {color: 'blue', weight: 3}).addTo(map);
|
||||||
|
polylines.push(polyline);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
document.getElementById('status').innerHTML = '❌ Verbindungsfehler';
|
document.getElementById('status').innerHTML = '❌ Verbindungsfehler';
|
||||||
console.error(error);
|
console.error('Load error:', error);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user