我在谷歌地图上创建了一个多边形,并希望在点击多边形时弹出一个infoWindow。代码如下:
google.maps.event.addListener(polygon, 'click', showVolume);
polygon_infoWindow = new google.maps.InfoWindow;
在showVolume函数中,
function showVolume(event){
var polygon_Name = this.Name;
var volume = this.Volume;
var pt = event.latlng;
var contentString = '<b>Name: </b>' + polygon_Name + '<br>' + '<b>Volume: </b>' + volume + '<br>' + '<b>Clicked Location: </b>' + pt;
polygon_infoWindow.setContent(contentString);
polygon_infoWindow.open(map);
polygon_infoWindow.setPosition(pt);
}
该函数返回属于多边形的正确信息。但是它将event.latlng返回为undefined。我想知道出了什么问题。
答案 0 :(得分:0)
event.latlng
不存在,javascript区分大小写,属性为event.latLng
代码段
var geocoder;
var map;
var polygon_infoWindow;
function initialize() {
map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(37.4419, -122.1419),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var polygon = new google.maps.Polygon({
map: map,
Name: "Fred",
Volume: 1000,
path: [{
lat: 37.4419,
lng: -122.1419
}, {
lat: 37.42,
lng: -122.16
}, {
lat: 37.4419,
lng: -122.1819
}]
});
google.maps.event.addListener(polygon, 'click', showVolume);
polygon_infoWindow = new google.maps.InfoWindow;
}
google.maps.event.addDomListener(window, "load", initialize);
function showVolume(event) {
var polygon_Name = this.Name;
var volume = this.Volume;
var pt = event.latLng;
var contentString = '<b>Name: </b>' + polygon_Name + '<br>' + '<b>Volume: </b>' + volume + '<br>' + '<b>Clicked Location: </b>' + pt;
polygon_infoWindow.setContent(contentString);
polygon_infoWindow.setPosition(pt);
polygon_infoWindow.open(map);
}
&#13;
html,
body,
#map_canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>
&#13;