Проблема с Google Maps API v3

Question

Я пытаюсь выполнить следующие действия с помощью Google Maps API:

• Display 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); 

Answer 1

Геокодирование использует асинхронный запрос. Вы должны создать маркер внутри обратного вызова геокода()

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" 
      }); 
     } 
    });