2012-03-30 125 views
0

我試圖完成與谷歌地圖API如下:問題與谷歌地圖API V3

  • 顯示to_address作爲地圖上的標記
  • 獲取用戶的位置
  • 生成和顯示方向基於GPS /用戶輸入信息

我已經得到了最後兩個工作就好了。我現在遇到的問題是,如果未提供位置,則會在地圖上顯示to_address作爲標記。

這是我正在使用的代碼。請記住最後2個步驟按預期工作。我知道我可以用latlng來完成這個任務,但這不是我的選擇。我需要提供一個地址。

var geocoder; 
var directionDisplay; 
var directionsService = new google.maps.DirectionsService(); 
var to_pos; 
var to_address = '11161 84th ave delta bc'; 

function initialize() { 

    directionsDisplay = new google.maps.DirectionsRenderer(); 


    geocoder = new google.maps.Geocoder(); 

    geocoder.geocode({ 
     'address': to_address 
    }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      to_pos = results[0].geometry.location; 
     } 
    }); 

    var myOptions = { 
     zoom: 7, 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: to_pos 
    }; 
    var map = new google.maps.Map(document.getElementById('map_canvas'), myOptions); 

    directionsDisplay.setMap(map); 
    directionsDisplay.setPanel(document.getElementById('directions')); 

    var control = document.getElementById('d_options'); 

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

      var infowindow = new google.maps.Marker({ 
       position: pos, 
       map: map, 
       title: "You" 
      }); 

      map.setCenter(pos); 
      $('#from').val(pos); 
      $('#d_options').trigger('collapse'); 
      calcRoute(); 

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

function calcRoute() { 
    var start = document.getElementById('from').value; 
    var end = to_address; 
    $('#results').show(); 
    var request = { 
     origin: start, 
     destination: end, 
     travelMode: google.maps.DirectionsTravelMode.DRIVING 
    }; 
    directionsService.route(request, function (response, status) { 
     if (status == google.maps.DirectionsStatus.OK) { 
      directionsDisplay.setDirections(response); 
     } 
    }); 
} 


google.maps.event.addDomListener(window, 'load', initialize); 

回答

0

地理編碼使用異步請求。您必須在地理編碼回調中創建標記()

geocoder.geocode({ 
     'address': to_address 
    }, function (results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 
      var to_pos = results[0].geometry.location; 

      new google.maps.Marker({ 
       position: new google.maps.LatLng(to_pos.lat(),to_pos.lng()), 
       map: map, 
       title: "Destination" 
      }); 
     } 
    });