Telegramme modifizieren
Verfasst: 29. Jan 2019, 10:00
Ich möchte folgende Meldung so modifizieren, dass Google Maps(meine HTML Datei )die Koordinaten verarbeiten kann und die Route zu den Koordinaten anzeigt.
#K01;N1234567E7654321;416/H1 Ölspur///Musterstraße 1//Musterstadt/// ////droht in Kanalisation zu laufen/<NUL><NUL>
-->Html Datei-->
Danke und Lg
#K01;N1234567E7654321;416/H1 Ölspur///Musterstraße 1//Musterstadt/// ////droht in Kanalisation zu laufen/<NUL><NUL>
-->Html Datei-->
Code: Alles auswählen
<!DOCTYPE html>
<html>
<head>
<style>
#KarteRoute, #KarteZiel{
float: left;
width: 100%;
height: 100%;
margin: 0;
}
#RouteZumEinsatzort{
float: left;
width: 100%;
height: 100%;
margin: 0;
}
</style>
</head>
<body>
<div id="container" >
<div id="KarteRoute"></div>
<div id="RouteZumEinsatzort"></div>
<div id="KarteZiel"></div>
<script type="text/javascript" src="xxxxxxxxxxxxxxxxxxxxxxxx"></script>
<script type="text/javascript">
function initialize()
{
var myOptions = {mapTypeId: google.maps.MapTypeId.ROADMAP};
KarteRoute = new google.maps.Map(document.getElementById("KarteRoute"), myOptions);
RouteZumEinsatzort.setMap(KarteRoute);
RouteZumEinsatzort.setPanel(document.getElementById("RouteZumEinsatzort")); //Wegbeschreibung
var myOptions_Ziel = {mapTypeId: google.maps.MapTypeId.ROADMAP};
KarteZiel = new google.maps.Map(document.getElementById("KarteZiel"), myOptions_Ziel);
RouteZumEinsatzortZiel.setMap(KarteZiel);
}
function showRoute()
{
//Einsatzort = new google.maps.LatLng(45.1234567876543,6.1234567898765);
if (!Standort.equals(Einsatzort)){
var dest_url = {origin:Standort, destination:Einsatzort, travelMode:google.maps.DirectionsTravelMode.DRIVING};
direction_service.route(dest_url, function(response, status){
if (status == google.maps.DirectionsStatus.OK){
RouteZumEinsatzort.setDirections(response);
}});
var dest_url_Ziel = {origin:Standort, destination:Einsatzort, travelMode:google.maps.DirectionsTravelMode.DRIVING};
direction_service.route(dest_url_Ziel, function(response, status){
if (status == google.maps.DirectionsStatus.OK){
RouteZumEinsatzortZiel.setOptions({ preserveViewport: true });
RouteZumEinsatzortZiel.setDirections(response);
}});
var marker = new google.maps.Marker({ position: Einsatzort, title: "Einsatzort", map: KarteZiel});
KarteZiel.setCenter(Einsatzort);
KarteZiel.setZoom(ZoomEinsatzort);
}
else
{
var marker = new google.maps.Marker({ position: Standort, title: "Standort", map: KarteRoute});
KarteRoute.setZoom(ZoomStartPosition);
KarteRoute.setCenter(Standort);
var marker = new google.maps.Marker({ position: Standort, title: "Standort", map: KarteZiel});
KarteZiel.setZoom(ZoomStartPosition);
KarteZiel.setCenter(Standort);
}
}
var rendererOptions = {draggable: true};
var RouteZumEinsatzort = new google.maps.DirectionsRenderer(rendererOptions);
var RouteZumEinsatzortZiel = new google.maps.DirectionsRenderer(rendererOptions);
var direction_service = new google.maps.DirectionsService();
var KarteRoute;
var KarteZiel;
//var geocoder = new google.maps.Geocoder();
var Standort = new google.maps.LatLng(45.1234567876543,6.1234567898765);//Hier die Start Addresse in Geo-Koordinaten eingeben (die gleiche wie im BosMon)
var Einsatzort = new google.maps.LatLng(%koordinaten.latitude%, %koordinaten.longitude%);
var ZoomStartPosition = 16;
var ZoomEinsatzort = 16;
//document.getElementById('KarteRoute').style.width = '800px';
document.getElementById('KarteRoute').style.height = '800px';
//document.getElementById('KarteZiel').style.width = '800px';
document.getElementById('KarteZiel').style.height = '800px';
initialize();
showRoute();
</script>
</div>
</body>
</html>