2012-08-04 71 views
3

我使用谷歌地圖API 3和谷歌地理編碼器。問題是它沒有正確加載地圖我正在通過ajax調用數據並調用函數showAddress(elemId, address) 其中elementId是div id將在哪裏渲染地圖。 這裏的谷歌地圖代碼谷歌地圖api 3 ajax電話

var geocoder; 
var map; 

    // run every mouse over 
function init_gmap(elemId) { 
    var mapOptions = { 
     zoom: 6 
    }; 
    map = new google.maps.Map(document.getElementById(elemId), 
     mapOptions) 
} 

    // find the address 
function showAddress(elemId, address) { 
     // todo: some caching? 
     init_gmap(elemId); // need to call this every time cause we're showing a new map 

     if (geocoder) 
     { 
      geocoder.geocode({ 'address': address}, function(results, status) { 
       if (status == google.maps.GeocoderStatus.OK) 
       { 
        map.setCenter(results[0].geometry.location); 
        var marker = new google.maps.Marker({ 
         map: map, 
         position: results[0].geometry.location 
        }); 

        var infowindow = new google.maps.InfoWindow({ 
        map: map, 
        position: results[0].geometry.location, 
        content: address 
        }); 

        google.maps.event.trigger(map, 'resize') 


       } 
       else 
       { 

        alert("Geocode was not successful for the following reason: " + status); 
       } 
      }); 
     } 
} 

任何建議嗎?

謝謝。

更新代碼:

<script type="text/javascript"> 
//<![CDATA[ 

var geocoder; 
var map; 
var lat; 
var lng; 
var marker; 

    // run every mouse over 
function init_gmap(elemId,address) { 
    geocoder = new google.maps.Geocoder(); 
    geocoder.geocode({ 'address': address}, function(results, status){ 
//  console.log(results[0].geometry.location.YA); 
     lat = results[0].geometry.location.Ya; 
     lng = results[0].geometry.location.Za; 
      var mapOptions = { 
       zoom: 15, 
       center: new google.maps.LatLng(lat, lng), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      map = new google.maps.Map(document.getElementById(elemId), 
       mapOptions) 
    }); 

} 

    // find the address 
function showAddress(elemId, address) { 
     // todo: some caching? 
     init_gmap(elemId,address); // need to call this every time cause we're showing a new map 
     marker = "marker_"+elemId; 
     marker = new google.maps.Marker({ 
      map: map, 
      position: new google.maps.LatLng(lat, lng) 
     }); 

     var infowindow = new google.maps.InfoWindow({ 
     map: map, 
     position: new google.maps.LatLng(lat, lng), 
     content: address 
     }); 

} 
</script> 

回答

2

爲了初始化需要中心的mapTypeId增加在MapOptions,(所有這些都是必需的,因爲在documentation提到的)地圖。例如:

var mapOptions = { 
     center: new google.maps.LatLng(40.178873, -96.767578), 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     zoom: 6 
} 
+0

感謝您的幫助,現在的工作。現在還有一個問題標記沒有顯示:( – 2012-08-04 11:04:26

+0

這裏是我的更新代碼 – 2012-08-04 11:04:48

+0

我建議你用乾淨的代碼發佈一個關於Maker的問題的新問題,因爲每個問題只能有一個接受的答案。:-) – Marcelo 2012-08-04 12:00:23