-1

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

目的是制作一张地图，向学生展示故事所指的国家/地区。我曾经使用剪切和粘贴解决方案实现过它，但是在切换 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);

这是此答案中带有调整大小/居中解决方案的 slideToggle 代码，但同样，我如何将地理编码数据放入 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>

我如何连接这三个之间的点？

4

1 回答 1

0

这是一个非常简单的示例，它根据地理编码地址设置地图的中心。

关键是这样的：

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

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

于 2012-12-18T11:28:25.497 回答