Gå til innhold

[Løst] Geolocation script hvor er feilen?

poande05

Av poande05
i Programmering og webutvikling

Anbefalte innlegg

poande05

poande05

Skrevet
Skrevet (endret)

Hei. Leker meg med google maps og geolocation. Hvorfor virker ikke dette?

 

altså, det jeg prøver å gjøre er å vise en rute fra der brukeren er til en rundkjøring på nesttun. Setter bergen sentrum først, så vil jeg endre det med geolocation...

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
 html { height: 100% }
 body { height: 100%; margin: 0; padding: 0 }
 #map_canvas { height: 100% }
</style>
<script type="text/javascript"
   src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var fromWhere  = new google.maps.LatLng(60.388808310445015, 5.329720973968506);
var latlng = new google.maps.LatLng(60.3144318955972, 5.355277061462402);

   function handleNoGeolocation() {
     alert("fikk ikke din posisjon. Viser fra Bergen Sentrum");
   }



 function initialize() {


     if(navigator.geolocation) {
   navigator.geolocation.getCurrentPosition(function(position) {
    fromWhere = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
   }, function() {
     handleNoGeolocation();
   });

   }

   else {
     handleNoGeolocation();
   } 
   directionsDisplay = new google.maps.DirectionsRenderer();
   var myOptions = {
     zoom: 16,
     center: latlng,
     mapTypeId: google.maps.MapTypeId.ROADMAP
   };
   var map = new google.maps.Map(document.getElementById("map_canvas"),
       myOptions);
   directionsDisplay.setMap(map);    
   var marker = new google.maps.Marker({
     position: latlng, 
     map: map, 
     title:"Hello World!" 
 });
   var start = fromWhere;
 var end = latlng;
 var request = {
   origin:start,
   destination:end,
   travelMode: google.maps.TravelMode.DRIVING
 };
 directionsService.route(request, function(result, status) {
   if (status == google.maps.DirectionsStatus.OK) {
     directionsDisplay.setDirections(result);
   }
 });
}

</script>
</head>
<body onload="initialize()">
 <div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>

 

det ser ut som at fromWhere ikke blir satt... Men jeg har prøvd med en alert etter at jeg setter fromWhere med geolocation og den blir faktisk satt.

Endret av poande05
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
poande05

poande05

Skrevet
  • Forfatter
Skrevet

ok fant ut av det. Det ser ut som at funksjonen navigator.geolocation.getCurrentPosition() jobber i bakgrunnen mens scriptet går videre eller noe. Løst ved å sette lasting av rute inne i if-klausulen. Syns uansett det var litt rart...

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
 html { height: 100% }
 body { height: 100%; margin: 0; padding: 0 }
 #map_canvas { height: 100% }
</style>
<script type="text/javascript"
   src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var directionsDisplay = new google.maps.DirectionsRenderer();
var directionsService = new google.maps.DirectionsService();
var fromWhere;
var latlng = new google.maps.LatLng(60.3144318955972, 5.355277061462402);

 function initialize() {

      var myOptions = {
     zoom: 16,
     center: latlng,
     mapTypeId: google.maps.MapTypeId.ROADMAP
   };
   var map = new google.maps.Map(document.getElementById("map_canvas"),
       myOptions);    
   var marker = new google.maps.Marker({
     position: latlng, 
     map: map, 
     title:"Hello World!" 
 });

     if(navigator.geolocation) {
   navigator.geolocation.getCurrentPosition(function(position) {
    fromWhere = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
      var request = {
   origin:fromWhere,
   destination:latlng,
   travelMode: google.maps.TravelMode.DRIVING
 };
     directionsDisplay.setMap(map);
 directionsService.route(request, function(result, status) {
   if (status == google.maps.DirectionsStatus.OK) {
     directionsDisplay.setDirections(result);
   }
 });

   }, function() {
     handleNoGeolocation();
   });

   }

   else {
     handleNoGeolocation();
   }





}

   function handleNoGeolocation() {
     alert("fikk ikke din posisjon. Viser fra Bergen Sentrum");
     fromWhere = new google.maps.LatLng(60.388808310445015, 5.329720973968506);
       var request = {
   origin:fromWhere,
   destination:latlng,
   travelMode: google.maps.TravelMode.DRIVING
 };
     directionsDisplay.setMap(map);
 directionsService.route(request, function(result, status) {
   if (status == google.maps.DirectionsStatus.OK) {
     directionsDisplay.setDirections(result);
   }
 });
   }

</script>
</head>
<body onload="initialize()">
 <div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...