Блог

Итак, пользователь выбирает страну, затем с помощью виджетов автозаполнения они могут выбрать район, город и область, в которых они живут. Выбранные ими значения объединяются в адрес, который следует использовать для вызова Google Maps API и отображения карты, на которой отмечен адрес… К сожалению, это не работает… Я получаю это исключение в Firebug:

неперехваченное исключение: [Исключение… «Компонент вернул код ошибки: 0x80004005 (NS_ERROR_FAILURE) [nsIDOMViewCSS.getComputedStyle]» nsresult: «0x80004005 (NS_ERROR_FAILURE)» местоположение: «JS frame ::http://maps.gstatic.com/intl/en_us/mapfiles/api-3/4/11a/main.js :: Xk :: строка 55″ данные: нет]

Вот мой код:

тег скрипта с этим src="http://maps.google.com/maps/api/js?sensor=false"

 var address = selectedArea   ', '   selectedCity   ', '   selectedDistrict   ', Lebanon';

var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': address }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        var map = new google.maps.Map($("#addressMap"));
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
    } else {
        alert("Geocode was not successful for the following reason: "   status);
    }
});
  

Итак, что происходит?

При создании объекта map вы предоставляете объект jQuery, но он исключает объект DOM. Попробуйте сам объект DOM.

Я также добавил некоторые параметры, уровень масштабирования и тип карты.

Вот окончательный код:

 var address = selectedArea   ', '   selectedCity   ', '   selectedDistrict   ', Lebanon';

var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': address }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        var mapOptions = { zoom: 8, mapTypeId: google.maps.MapTypeId.ROADMAP };
        var map = new google.maps.Map(document.getElementById('addressMap'), mapOptions);
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
    } else {
        alert("Geocode was not successful for the following reason: "   status);
    }
});