Lade Karte...
🤖 AI Route Generator
Claude is thinking...
⋮⋮
👕 Kleiderschrank
🌡️ Route & Wetter
Keine aktive Route. Bitte zuerst eine Route planen.
💬 Zusätzliche Hinweise (optional)
~$0.004 pro Empfehlung · KI-gestützt
✅ Dein Outfit für heute
🔗 Produkt-URL einfügen
📸 Oder Foto hochladen
👕
Noch keine Klamotten hinzugefügt.
Füge Kleidungsstücke über "Hinzufügen" ein.
∿ Höhenprofil ▲
🎨 Design
🎯

Willkommen!

Schritt 1/5

⋮⋮
Lass uns gemeinsam die wichtigsten Features entdecken!
0.00000°, 0.00000°
0m
Surface
🔄
🔬
Settings

X-RAY MAGNIFIER

📐 Größe 250px
🔭 Zoom Level +4
🗺️ Modus
⚙️ Features
🛣️ Route anzeigen
🎨 Surface-Farben
📍 POI Layer
📊 Koordinaten
📈 Mini-Profil
📏 Measure Tool
🎯 Smart Focus
🎬 Aktionen
💡 LEERTASTE = Freeze/Unfreeze
L = Toggle Magnifier
S = Screenshot

Meine Routen

Gespeicherte Routen: 0
Gesamt-Distanz: 0 km
∿ HÖHENPROFIL
25 km/h
⏳ Berechne...
Wetter Details
// ── Mobile Elevation Badge ──────────────────────────────────── // ── Bottom Sheet: swipe down pill to dismiss ──────────────── (function initBottomSheetDismiss() { let sheetTouchStartY = 0; let sheetTouchTarget = null; let isDraggingHandle = false; document.addEventListener('touchstart', e => { const panel = e.target.closest('.floating-panel'); if (!panel) return; sheetTouchTarget = panel; sheetTouchStartY = e.touches[0].clientY; // Only allow swipe-dismiss when touching near top (drag handle area) const rect = panel.getBoundingClientRect(); isDraggingHandle = (e.touches[0].clientY - rect.top) < 40; }, { passive: true }); document.addEventListener('touchend', e => { if (!sheetTouchTarget || !isDraggingHandle) { sheetTouchTarget = null; return; } const deltaY = e.changedTouches[0].clientY - sheetTouchStartY; // Swipe down > 60px from handle → close panel if (deltaY > 60) { const type = sheetTouchTarget.dataset.type; if (type) { sheetTouchTarget.remove(); const btn = document.querySelector(`[data-panel="${type}"]`); if (btn) btn.classList.remove('active'); } } sheetTouchTarget = null; isDraggingHandle = false; }, { passive: true }); })(); window.showElevationBadge = function() { const isMobile = window.matchMedia('(pointer: coarse)').matches; if (!isMobile) return; const badge = document.getElementById('elevationBadge'); if (badge) { badge.style.display = 'flex'; if (window.routeStats) { const dist = (window.routeStats.totalDistance/1000).toFixed(1); const asc = Math.round(window.routeStats.totalAscent); badge.querySelector('.badge-text').textContent = `∿ ${dist} km ↑${asc} m`; } } }; window.toggleElevationFromBadge = function() { const profile = document.getElementById('elevationProfile'); const badge = document.getElementById('elevationBadge'); if (!profile) return; if (profile.classList.contains('show')) { profile.classList.remove('show'); if (badge) badge.style.display = 'flex'; } else { profile.classList.add('show'); if (badge) badge.style.display = 'none'; // Force full chart render (forceRender=true bypasses mobile check) if (typeof showElevationProfile === 'function') { showElevationProfile(true); } // Resize after paint so Chart.js measures container correctly setTimeout(() => { if (window.elevationChart) { window.elevationChart.resize(); window.elevationChart.update(); } if (typeof window.drawProfileHighlights === 'function') { window.drawProfileHighlights(); } }, 100); } }; window.setupChartTogglesData = function() { if (typeof setupChartToggles === 'function') setupChartToggles(); }; // Wire up elevation toolbar button to hide badge document.addEventListener('DOMContentLoaded', () => { const _elevBtn = document.querySelector('[data-panel="elevation"]'); if (_elevBtn) { _elevBtn.addEventListener('click', () => { const badge = document.getElementById('elevationBadge'); const profile = document.getElementById('elevationProfile'); if (badge && profile && !profile.classList.contains('show')) { badge.style.display = 'none'; } }); } });