我正在尝试在我的 map 上添加点击监听器，这是我的代码
更新
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<style>
#map-canvas{
width:500px;
height:500px;
}
</style>
<script type="text/javascript">
var cityPoints = {
center: new google.maps.LatLng(41.878113, -87.629798),
id: 0,
addr: 'avenue0',
magnitude: 100000
};
var cityCircle;
var infoWindow = new google.maps.InfoWindow({
content: "<div>Hello! World</div>",
maxWidth: 500
});
function initialize() {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(31.2330555556, 72.3330555556),
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var populationOptions = {
strokeColor: "#FF0000",
strokeOpacity: 1,
strokeWeight: 1,
clickable: true,
fillOpacity: 0,
map: map,
center: new google.maps.LatLng(31.231867, 72.33336),
radius: 200000
};
cityCircle = new google.maps.Circle(populationOptions);
google.maps.event.addListener(cityCircle, 'click', function (ev) {
infoWindow.setPosition(ev.latLng);
infoWindow.open(map);
});
}
initialize();
</script>
<body>
<div id="map-canvas"></div>
</body>
</html>
但是这段代码对我不起作用，因为当我点击圆圈时，信息窗口没有打开。请任何人告诉我我的代码中到底缺少什么。请帮助
最佳答案
也许缺少此 google.maps.event.addDomListener(window, 'load', initialize);。
这是一个工作示例
我把半径做大了一点。
更新
是否this工作？
更新 3
我已将所有内容放在一个文件中，以便您可以复制和粘贴它。
<!DOCTYPE html>
<html>
<head>
<style>
#map-canvas{
height:100%;
width:100%;
}
html, body {
height: 100%;
}
body {
margin:0;
padding:0;
}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script>
var cityPoints = {
center: new google.maps.LatLng(41.878113, -87.629798),
id: 0,
addr: 'avenue0',
magnitude: 100000
};
var cityCircle;
var infoWindow = new google.maps.InfoWindow({
content: "<div>Hello! World</div>",
maxWidth: 500
});
function initialize() {
var mapOptions = {
zoom: 4,
center: new google.maps.LatLng(31.231867, 72.33336),
mapTypeId: google.maps.MapTypeId.TERRAIN
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
var populationOptions = {
strokeColor: "#FF0000",
strokeOpacity: 1,
strokeWeight: 1,
clickable: true,
fillOpacity: 0,
map: map,
center: new google.maps.LatLng(31.231867, 72.33336),
radius: 200000
};
cityCircle = new google.maps.Circle(populationOptions);
google.maps.event.addListener(cityCircle, 'click', function(ev) {
infoWindow.setPosition(ev.latLng);
infoWindow.open(map);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
关于javascript - 在圈子上添加点击监听器不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16708254/