Infowindow for Google Map中的圆形标记

问题：我试图在Google地图上点击圆形标记来获取信息窗口。Infowindow for Google Map中的圆形标记

我的代码：

<html> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
<meta charset="utf-8"> 
<title>Google Maps JavaScript API v3 Example: Circle Simple</title> 

<style type="text/css"> 
#map_canvas { 
    height: 100% 
} 
</style> 

<script src="https://maps.googleapis.com/maps/api/js?&sensor=false" 
    type="text/javascript"> 
</script> 

<script type="text/javascript"> 

var citymap = {}; 
citymap['Yelahanka'] = { 
    center: new google.maps.LatLng(13.133754,77.585784), 
    population: 2842518 
}; 
citymap['Dodaballarpur'] = { 
    center: new google.maps.LatLng(15.133754,77.585784), 
    population: 8143197 
}; 
citymap['Mekricircle'] = { 
    center: new google.maps.LatLng(16.133754,77.585784), 
    population: 3844829 
} 
var cityCircle; 

function initialize() { 
    var mapOptions = { 
    zoom: 7, 
    center: new google.maps.LatLng(13.133754,77.585784), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

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


    var contentString = '<div id="content">'+ 
    '<div id="siteNotice">'+ 
    '</div>'+ 
    '<h1 id="firstHeading" class="firstHeading">Uluru</h1>'+ 
    '<div id="bodyContent">'+ 
    '<p><b>Uluru</b>, also referred to as <b>Ayers Rock</b>, is a large ' + 
    'sandstone rock formation in the southern part of the '+ 
    'Northern Territory, central Australia. It lies 335&#160;km (208&#160;mi) '+ 
    'south west of the nearest large town, Alice Springs; 450&#160;km '+ 
    '(280&#160;mi) by road. Kata Tjuta and Uluru are the two major '+ 
    'features of the Uluru - Kata Tjuta National Park. Uluru is '+ 
    'sacred to the Pitjantjatjara and Yankunytjatjara, the '+ 
    'Aboriginal people of the area. It has many springs, waterholes, '+ 
    'rock caves and ancient paintings. Uluru is listed as a World '+ 
    'Heritage Site.</p>'+ 
    '<p>Attribution: Uluru, <a href="http://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+ 
    'http://en.wikipedia.org/w/index.php?title=Uluru</a> '+ 
    '(last visited June 22, 2009).</p>'+ 
    '</div>'+ 
    '</div>'; 




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

    for (var city in citymap) { 

    var populationOptions = { 
     strokeColor: '#FF0000', 
     strokeOpacity: 0.8, 
     strokeWeight: 6, 
     fillColor: '#669999', 
     fillOpacity: 0.45, 
     map: map, 
     center: citymap[city].center, 
     radius: citymap[city].population/200 
    }; 
    cityCircle = new google.maps.Circle(populationOptions); 
    } 

    google.maps.event.addListener(populationOptions,'click', function() { 
     alert("i am here in this infowindow"); 
     infowindow.open(map,populationOptions); 
    }); 
} 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 

</head> 
<body> 
    <div id="map_canvas"></div> 
</body> 
</html>

当我点击它亘古不变的响应圆形标记，我没有得到任何信息窗口。在上面的代码中，我试图用infowindow在圆形区域的点击上显示一些细节的地方创建一个动态圆圈。

来源

2013-03-13 user2164427

请使用下面的代码来创建infoWindow。 Loc变量通过传递infowindow需要打开的经度和纬度参数来生成位置。

var Loc = new google.maps.LatLng(latitude,longitude); 
     var INFO_WINDOW_WIDTH = 352;         
     var infowindow = new google.maps.InfoWindow({ 
     position :Loc, 
     maxWidth: INFO_WINDOW_WIDTH 
     }); 
     google.maps.event.addListener(cityCircle,'click', function() { 
               infowindow.close(); 
    infowindow.setContent(contentString); 
               infowindow.setOptions({pixelOffset: new google.maps.Size(0,0)}); 
               infowindow.open(map,this); 
      });

来源

2013-03-13 10:42:43

要获取infoWindow显示在谷歌地图的一个连续几何特定的经纬度，长必须传递给infowindow。尽管我的代码位有所不同。 – user2164427 2013-03-13 12:12:07

传递给事件侦听器的对象看起来不正确。请使用以下代码在'cityCircle'上添加onClick事件。

google.maps.event.addListener(cityCircle,'click', function() { 
     alert("i am here in this infowindow"); 
     infowindow.open(map,populationOptions); 
    });

来源

2013-03-13 08:54:11

这不工作以及 – user2164427 2013-03-13 09:26:33

它是否给予该警报消息？ – 2013-03-13 09:44:22

是的第一个圈，但infowindow不会上来... – user2164427 2013-03-13 09:45:45

Infowindow for Google Map中的圆形标记

回答

相关问题