谷歌地图V3 - 我无法调和关闭 [英] Google Maps V3 - I cannot reconcile closure

查看:90
本文介绍了谷歌地图V3 - 我无法调和关闭的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道这是一个普遍的问题,但我已经盯着,看了一下google,看了一会儿,但我看不出有什么不对。

我从我的MySql Table,反向地理编码英国邮政编码,围绕结果绘制一个圆圈,但我无法理解为什么我的闭包功能无法正常工作。

据我了解闭包原则是关于访问我试图用函数完成的循环范围之外的变量 - 但对于我的生活,我无法完成它。



我确信有人会为我的明显错误提供答案,我会很感激任何人都可以提供的帮助。

  var mapOptions = {
zoom:8,
center:new google.maps.LatLng(37.09024,-95.712891),
mapTypeId:google.maps.MapTypeId.ROADMAP
};

var infowindow = new google.maps.InfoWindow({
content:contentString
});

var geocoder = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);
var contentString;
var i

downloadUrl(getXML.php,function(data){

var xml = data.responseXML;
var markers = xml .documentElement.getElementsByTagName(marker);
for(i = 0; i< markers.length; i ++){
var name = markers [i] .getAttribute(name);
contentString =(name);
var postcode = markers [i] .getAttribute(postcode);
var dateadded = markers [i] .getAttribute(dateadded);
var extra = markers [i] .getAttribute(extra);

geocoder.geocode({
'address':postcode
},function(results,status) {
if(status == google.maps.GeocoderStatus.OK){
map.setCenter(results [0] .geometry.location);
var marker = new google.maps.Marker ({
map:map,
clickable:true,
position:results [0] .geometry.location
})
google.maps.event.addListener(marker,'click',(function(marker,i)){
return function(){
infowindow.setContent(name);
infowindow.open(map,marker);
}
})(marker,i));

var circle = new google.maps.Circle({
map:map,
radius:12070.99,// 15英里以米为单位
fillColor:'#AA0000 '
});
circle.bindTo('center',marker,'position');
$ b} else {
alert('由于以下原因,地理编码不成功:'+ status');
}

});

}

});


解决方案

)和地理编码器(geocodeMarker)

  var mapOptions = {
zoom:8,
center:new google.maps.LatLng(37.09024,-95.712891),
mapTypeId:google.maps.MapTypeId.ROADMAP
};

var infowindow = new google.maps.InfoWindow({
content:contentString
});

var geocoder = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions);
var contentString;
var i;
函数createMarker(latlng,name,html)
{
var marker = new google.maps.Marker({
map:map,
clickable:true,
位置:latlng
})
google.maps.event.addListener(marker,'click',function(){
infowindow.setContent(name);
infowindow .open(map,marker);
});

var circle = new google.maps.Circle({
map:map,
radius:12070.99,// 15英里以米为单位
fillColor:'#AA0000 '
});
circle.bindTo('center',marker,'position');


函数geocodeMarker(postcode,name,html)
{
geocoder.geocode({
'address':postcode
} ,function(results,status){
if(status == google.maps.GeocoderStatus.OK){
map.setCenter(results [0] .geometry.location);
createMarker(结果[0] .geometry.location,html);
} else {
alert('由于以下原因,Geocode不成功:'+ status';
}

});


downloadUrl(getXML.php,function(data){

var xml = xmlParse(data);
var markers = xml .documentElement.getElementsByTagName(marker);
for(i = 0; i< markers.length; i ++){
var name = markers [i] .getAttribute(name);
contentString =(name);
var postcode = markers [i] .getAttribute(postcode);
var dateadded = markers [i] .getAttribute(dateadded);
var extra = markers [i] .getAttribute(extra);
geocodeMarker(postcode,name,contentString);

}

});


I know this is a common problem but I have stared, read googled and stared some more but I cannot see what is wrong.

I populate my maps from a MySql Table, reverse geocode the UK Postcode, draw a circle around the result but I cannot get my head around why my closure function isn't working.

As I understand it the closure principle is about accessing variable from outside the scope of the loop which I am trying to accomplish with the function - but for the life of me I cannot get it to work.

I'm sure someone will have the answer to my glaring error and I would appreciate any help anyone can offer.

var mapOptions = {
    zoom : 8,
    center : new google.maps.LatLng(37.09024, -95.712891),
    mapTypeId : google.maps.MapTypeId.ROADMAP
};

var infowindow = new google.maps.InfoWindow({
    content : contentString
});

var geocoder = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var contentString;
var i

downloadUrl("getXML.php", function(data) {

    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("name");
        contentString =(name);
        var postcode = markers[i].getAttribute("postcode");
        var dateadded = markers[i].getAttribute("dateadded");
        var extra = markers[i].getAttribute("extra");

        geocoder.geocode({
            'address' : postcode
        }, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                var marker = new google.maps.Marker({
                    map : map,
                    clickable : true,
                    position : results[0].geometry.location
                })
                google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infowindow.setContent(name );
                        infowindow.open(map, marker);
                    }
                })(marker, i));

                var circle = new google.maps.Circle({
                    map : map,
                    radius : 12070.99, // 15 miles in metres
                    fillColor : '#AA0000'
                });
                circle.bindTo('center', marker, 'position');

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

        });

    }

});

解决方案

I use function closure with functions for the marker (createMarker) and the geocoder (geocodeMarker)

var mapOptions = {
    zoom : 8,
    center : new google.maps.LatLng(37.09024, -95.712891),
    mapTypeId : google.maps.MapTypeId.ROADMAP
};

var infowindow = new google.maps.InfoWindow({
    content : contentString
});

var geocoder = new google.maps.Geocoder();
var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
var contentString;
var i;
function createMarker(latlng, name, html)
{
   var marker = new google.maps.Marker({
         map : map,
         clickable : true,
         position : latlng
     })
     google.maps.event.addListener(marker, 'click', function() {
         infowindow.setContent(name );
         infowindow.open(map, marker);
     });

     var circle = new google.maps.Circle({
         map : map,
         radius : 12070.99, // 15 miles in metres
         fillColor : '#AA0000'
     });
     circle.bindTo('center', marker, 'position');
}

function geocodeMarker(postcode, name, html)
{
  geocoder.geocode({
      'address' : postcode
  }, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
          map.setCenter(results[0].geometry.location);
          createMarker(results[0].geometry.location, html);
      } else {
          alert('Geocode was not successful for the following reason: ' + status);
      }

  });
}

downloadUrl("getXML.php", function(data) {

        var xml = xmlParse(data);
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (i = 0; i < markers.length; i++) {
        var name = markers[i].getAttribute("name");
        contentString =(name);
        var postcode = markers[i].getAttribute("postcode");
        var dateadded = markers[i].getAttribute("dateadded");
        var extra = markers[i].getAttribute("extra");
        geocodeMarker(postcode, name, contentString);

    }

});

这篇关于谷歌地图V3 - 我无法调和关闭的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆