Google maps api 3 将地理编码的谷歌地图添加到div

我花了一整天的时间看文档和示例，但我正在彻底改变自己。我希望我能找到正确的方法来做这件事。我正在使用jQuery

这样做的目的是制作一张地图，让学生们知道这个国家的地理位置。我曾经用a实现过它，但在切换div时它不起作用——简而言之，我觉得我需要重做它，但有点力不从心。我找到了地理编码的代码：

var geocoder = new google.maps.Geocoder();
var address = $("#infopanel .map a.header").text();
map = $("#infopanel .map div");

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

这是添加地图的代码，但请注意，我无法将地理编码的结果输入到mapOptions的中心变量中：

var mapOptions = {
    center: new google.maps.LatLng(*geocoded-data*),
    zoom: 3,
    mapTypeId: google.maps.MapTypeId.TERRAIN,
    panControl: false,
    zoomControl: true,
    mapTypeControl: false,
    scaleControl: false,
    streetViewControl: false,
    overviewMapControl: false
   };

    new google.maps.Map(map,mapOptions);

这是带有resize/center解决方案的幻灯片切换代码，但同样，如何将地理编码数据输入setCenter：

$("#infopanel ul li > div").slideToggle("fast"); // hide the content
$("#infopanel a.header").click(function(e){ // toggle the content.
var hascontent = $(this).next("div");
if (hascontent.length == 1) {
    e.preventDefault();
    $(this).next().slideToggle("slow", function () {
        google.maps.event.trigger(map, "resize"); // resize map
        map.setCenter(*geocoded-data*); // center map
        });
    }
});

对于上下文，下面是它将全部放在其中的HTML：

<li class="map"><a href="" class="header">Zimbabwe</a>
    <div style="width:220px;height:220px;"><a href="http://maps.google.com.au/maps?q=Zimbabwe&amp;z=3">Find Zimbabwe on Google Maps</a></div>
</li>

---

如何将这三个点连接起来？

下面是一个非常简单的示例，它设置了

关键是：

  if (status != google.maps.GeocoderStatus.ZERO_RESULTS) {
      map.setCenter(results[0].geometry.location);

---

它将地图的中心设置为地理编码操作成功时返回的值。

阅读此问题后，我使用goMap插件解决了此问题（）。我仍然不确定上述问题的答案是什么。我的主要问题是从传递到其他函数的地理编码结果中获取信息。我可能没有正确的代码来居中标记，但这不是问题的全部。正如你在我的评论中所看到的，我最终找到了一个解决方案。