Moin, ich hoffe ihr könnt mir helfen.
Ich bin momentan mit 3 Freunden für 1 Jahr im Ausland unterwegs.
Um ein bisschen die Erlebnisse nach Deutschland zu teilen wollte ich einen Blog einrichten.
Mit jedem neuen Blogeintrag wird die Position in Form von Latitude und Longitude + Stadtnamen gespeichert, diese sollen dann auf einer anderen Seite des Blogs auf einer google maps karte markiert werden (was so weit auch funktioniert)
Nun möchte ich allerdings dass man auf der Karte unseren Reiseweg nachvollziehen kann, die Punkte also in der richtigen Reihenfolge verbunden werden, und das klappt plötzlich nicht mehr so gut.
Ich befasse mich jetzt erst 2 Tage mit der Google maps api, denke allerdings dass ich alles soweit verstanden habe und finde den fehler einfach nicht
die routen werden teilweise doppelt gezeichnet und einmal per luftlinie was ich überhaupt nicht verstehe, momentan befinden sich 3 Punkte in der Datenbank (melbourne, sydney und brisbane)
die route wird wie folgt gezeichnet
http://www1.xup.to/exec/ximg.php?fid=36369440
http://www1.xup.to/exec/ximg.php?fid=82389552
((es sollte Melborune -> Sydney -> Brisbane, von unten nach oben, sein))
Link zur live-version kann ich bei nachfrage per pn zuschicken da mein Name in der Adresse vorkommt
kompletter code:
der oben festehaltene fehler stammt aus einem chrome-browser, in firefox lädt die map überhaupt nicht.. liegt das an mir oder an google?
danke schonmal
Ich bin momentan mit 3 Freunden für 1 Jahr im Ausland unterwegs.
Um ein bisschen die Erlebnisse nach Deutschland zu teilen wollte ich einen Blog einrichten.
Mit jedem neuen Blogeintrag wird die Position in Form von Latitude und Longitude + Stadtnamen gespeichert, diese sollen dann auf einer anderen Seite des Blogs auf einer google maps karte markiert werden (was so weit auch funktioniert)
Nun möchte ich allerdings dass man auf der Karte unseren Reiseweg nachvollziehen kann, die Punkte also in der richtigen Reihenfolge verbunden werden, und das klappt plötzlich nicht mehr so gut.
Ich befasse mich jetzt erst 2 Tage mit der Google maps api, denke allerdings dass ich alles soweit verstanden habe und finde den fehler einfach nicht
die routen werden teilweise doppelt gezeichnet und einmal per luftlinie was ich überhaupt nicht verstehe, momentan befinden sich 3 Punkte in der Datenbank (melbourne, sydney und brisbane)
die route wird wie folgt gezeichnet
http://www1.xup.to/exec/ximg.php?fid=36369440
http://www1.xup.to/exec/ximg.php?fid=82389552
((es sollte Melborune -> Sydney -> Brisbane, von unten nach oben, sein))
Link zur live-version kann ich bei nachfrage per pn zuschicken da mein Name in der Adresse vorkommt
kompletter code:
Code:
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js"></script> <script type="text/javascript"> $(document).ready(function() { var path = new google.maps.MVCArray(), service = new google.maps.DirectionsService(), poly; var map = new google.maps.Map(document.getElementById("map"), { zoom: 3, mapTypeId: 'roadmap', center: new google.maps.LatLng(-37.813611100000000000,144.963055599999960000) }); poly = new google.maps.Polyline({ map: map }); var infoWindow = new google.maps.InfoWindow; downloadUrl("marker.php", function(data) { var xml = data.responseXML; var markers = xml.documentElement.getElementsByTagName("marker"); var latlngbounds = new google.maps.LatLngBounds(); for (var i = 0; i < markers.length; i++) { var name = markers[i].getAttribute("name"); var id = markers[i].getAttribute("id"); var point = new google.maps.LatLng( parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute("lng")) ); var html = "<b>" + name + "</b><br/><a href='index.php?page=showblog&id=" + id + "'>Zum Blog -></a>"; var marker = new google.maps.Marker({ map: map, position: point, }); if (path.getLength() === 0) { path.push(marker.position); poly.setPath(path); } else { service.route({ origin: path.getAt(path.getLength() - 1), destination: marker.position, travelMode: google.maps.DirectionsTravelMode.DRIVING }, function(result, status) { if (status == google.maps.DirectionsStatus.OK) { for (var i = 0, len = result.routes[0].overview_path.length; i < len; i++) { path.push(result.routes[0].overview_path[i]); } } }); } latlngbounds.extend(marker.position); bindInfoWindow(marker, map, infoWindow, html); } map.setCenter(latlngbounds.getCenter()); map.fitBounds(latlngbounds); }); }); function bindInfoWindow(marker, map, infoWindow, html) { google.maps.event.addListener(marker, 'click', function() { infoWindow.setContent(html); infoWindow.open(map, marker); }); } function downloadUrl(url, callback) { var request = window.ActiveXObject ? new ActiveXObject('Microsoft.XMLHTTP') : new XMLHttpRequest; request.onreadystatechange = function() { if (request.readyState == 4) { request.onreadystatechange = doNothing; callback(request, request.status); } }; request.open('GET', url, true); request.send(null); } function doNothing() {} </script> <div id="map" style="width: 1200px; height: 800px; margin-bottom:-50px;"></div>
danke schonmal
Kommentar