Proof of Concept - Eine interaktive Web-Anwendung für Routenplanung mit GraphHopper-Integration, speziell optimiert für die Identifikation und Planung von Routen entlang von Straßen ohne Mapillary-Abdeckung. Die Anwendung visualisiert Mapillary Coverage-Daten und hilft dabei, Lücken in der Street View-Abdeckung zu identifizieren.
- Mapillary Coverage Routing: Routenplanung mit Fokus auf Mapillary-Abdeckung - identifiziere Straßen ohne Street View-Abdeckung
- Farbcodierte Route-Visualisierung: Darstellung der Route basierend auf Mapillary Coverage, Surface und Road Class - sofort sichtbar, welche Abschnitte noch keine Mapillary-Abdeckung haben
- Missing Streets Layer: Visualisierung von Straßen ohne Mapillary-Abdeckung (Daten von OSM Verkehrswende) als Kontext-Layer
- Interaktive Routenplanung: Start- und Endpunkt per Klick oder Geocoding setzen
- Multi-Profile Routing: Unterstützung für verschiedene Verkehrsmittel (Auto, Fahrrad, etc.)
- Höhenprofil: Interaktives Canvas-basiertes Höhenprofil mit Hover-Funktionalität und Encoded Values Overlay
- Kontext-Layer: Radinfrastruktur (OpenStreetMap, FixMyCity) und Mapillary Missing Streets mit Toggle-Funktionalität
- Permalink: Vollständige State-Speicherung in der URL (Kartenposition, Route, Profil, Layer)
- GPX-Export: Export berechneter Routen als GPX-Datei für Navigation oder weitere Analyse
- MapLibre GL JS (v5.6.0): Kartenvisualisierung
- GraphHopper Routing API: Routenberechnung auf Basis von angepasstem Fork vizsim/graphhopper:bikelanes_ec
- Photon Geocoder: Adresssuche und Geocoding
- GraphHopper API: Routenberechnung (Server-Instanz: ghroute.vizsim.de)
- OpenStreetMap: Basiskartendaten
- OSM Verkehrswende: Mapillary Missing Streets Daten - osm-verkehrswende.org
- FixMyCity / tilda-geo.de: Vektortiles für Radinfrastruktur - tilda-geo.de
- Mapterhorn: Terrain und Hillshade DEM-Daten - mapterhorn.com
- Sonny's Terrain Models: Höhenmodelle für Elevation-Daten (CC BY 4.0) - sonny.4lima.de
missing_mapillary_gh-routing/
├── index.html # Haupt-HTML-Datei
├── main.js # Haupt-Initialisierung
├── style.css # Stylesheet
├── style.json # MapLibre Style-Konfiguration
├── logo.svg # Logo
├── js/
│ ├── config/ # Konfiguration
│ │ ├── config.js # Lokale Konfiguration (nicht versioniert)
│ │ └── config.public.js # Öffentliche Konfiguration
│ ├── routing/ # Routing-Module
│ │ ├── routing.js # Haupt-Routing-Logik & API-Calls
│ │ ├── routingUI.js # UI Event Handler Setup
│ │ ├── routeState.js # State Management
│ │ ├── routeRecalculator.js # Zentrale Route-Recalculations
│ │ ├── routeVisualization.js # Route-Farben & Hover
│ │ ├── routeInfoFormatter.js # Route-Info Formatierung
│ │ ├── colorSchemes.js # Farb-Schemas
│ │ ├── customModel.js # Custom Routing Model
│ │ ├── gpxExport.js # GPX-Export
│ │ ├── waypointOptimizer.js # Waypoint-Optimierung
│ │ ├── markers/ # Marker-Management
│ │ │ ├── markerFactory.js # Marker-Erstellung (Start, End, Waypoints)
│ │ │ └── waypointContextMenu.js # Waypoint Context-Menü
│ │ ├── waypoints/ # Waypoint-Management
│ │ │ ├── waypointList.js # Waypoint List UI (Drag & Drop)
│ │ │ └── waypointManager.js # Waypoint CRUD Operations
│ │ ├── coordinates/ # Coordinate-Management
│ │ │ └── coordinateTooltips.js # Tooltip Management
│ │ └── heightgraph/ # Höhenprofil-Module
│ │ ├── heightgraph.js
│ │ ├── heightgraphCanvas.js
│ │ ├── heightgraphConfig.js
│ │ ├── heightgraphDrawing.js
│ │ ├── heightgraphInteractivity.js
│ │ ├── heightgraphStats.js
│ │ └── heightgraphUtils.js
│ ├── mapdata/ # Karten-Datenquellen & Layer
│ │ ├── sources.js # Datenquellen-Definitionen
│ │ ├── basicLayers.js # Basis-Layer
│ │ ├── bikeLanesLayers.js # Radinfrastruktur-Layer
│ │ └── missingStreetsLayers.js # Mapillary Missing Streets Layer
│ ├── ui/ # UI-Komponenten
│ │ ├── setupBaseLayerControls.js # Basemap Controls
│ │ ├── panelPositioning.js # Panel-Positionierung
│ │ ├── toggleHandlers.js # Toggle-Handler (Layer, Theme, etc.)
│ │ ├── contextMenu.js # Haupt-Context-Menü
│ │ ├── contextMenuBase.js # Context-Menü Basis-Utility
│ │ ├── mapThemeSwitcher.js # Map Theme Switching
│ │ └── mapThemeInitializer.js # Map Theme Initialisierung
│ └── utils/ # Utilities
│ ├── permalink.js # Permalink-Funktionalität
│ ├── geocoder.js # Geocoding
│ └── constants.js # Konstanten
└── thumbs/ # Thumbnails für Basemaps
Die Anwendung kann direkt im Browser geöffnet werden: https://vizsim.github.io/missing_mapillary_gh-routing/
Die Anwendung nutzt eine eigene GraphHopper-Instanz, die auf ghroute.vizsim.de erreichbar ist.
Die Lizenz wird in Kürze hinzugefügt.
- MapLibre GL JS: Open-Source Kartenbibliothek
- GraphHopper: Routenberechnung
- OpenStreetMap: Community-getriebene Kartendaten
- Mapillary: Street View Fotos und Coverage-Daten
- OSM Verkehrswende: Mapillary Missing Streets Daten - osm-verkehrswende.org
- FixMyCity / tilda-geo.de: Vektortiles für Radinfrastruktur - tilda-geo.de
- Mapterhorn: Terrain und Hillshade DEM-Daten - mapterhorn.com
- Sonny's Terrain Models: Höhenmodelle (CC BY 4.0) - sonny.4lima.de