我一直在研究这个问题。我已经看过关于主题和几个教程的多个堆栈溢出帖子,但我无法使infoWindow.close()工作。
我甚至尝试使用jQuery点击$('#googleMap > div > div > div:nth-child(1) > div:nth-child(4) > div:nth-child(4) > div:nth-child(1) > div:nth-child(3)').click();
,它实际上似乎在浏览器控制台中工作,但在运行点击监听器时却没有。
非常感谢任何建议或指示。
d3.csv('/data/locs.csv', function(locs){
var obj = [];
for(i=0;i<locs.length;i++) {
var country = locs[i].country;
var location = locs[i].location;
var lat = locs[i].lat;
var long = locs[i].long;
var description = locs[i].description;
obj.push({
con: country,
location: location,
lat: lat,
lng: long,
description: description
});
}
console.log(obj);
initMap(obj)
});
function initMap(obj, error) {
if (error){console.log("Error: "+error)}
var openInfoWindow = null;
var mapProp = {
center: {lat: 39.8283, lng: -98.5795},
zoom: 2
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
var pointLoc = [];
var labels = [];
var descrip = [];
var locale = [];
for(i=0;i<obj.length;i++) {
pointLoc.push({lat: obj[i].lat, lng: obj[i].lng});
labels.push(obj[i].con);
descrip.push(obj[i].description);
locale.push(obj[i].location);
}
map.data.loadGeoJson();
for (var i = 0; i < pointLoc.length; i++) {
var coords = pointLoc[i];
var latLng = new google.maps.LatLng(coords.lat,coords.lng);
var marker = new google.maps.Marker({
position: latLng,
map: map
});
var contentStr = '<div id="popcontent">'+
'<div id="siteNotice">'+
'</div>'+
'<h1 id="firstHeading" class="firstHeading">'+descrip[i]+'</h1>'+
'<p>'+locale[i]+', '+labels[i]+'</p>' +
'</div>';
var infoWindow = new google.maps.InfoWindow({
maxWidth: 300
});
google.maps.event.addListener(marker,'click', (function(marker,contentStr,infowindow){
infowindow.close();
return function() {
infowindow.setContent(contentStr);
infowindow.open(map, marker);
};
})(marker,contentStr,infoWindow));
}
}
答案 0 :(得分:0)
Your variable infoWindow goes out of scope when returning a function, and you not modifying the outer infoWindow, but the one passed into the function. Try this.
d3.csv('/data/locs.csv', function(locs){
var obj = [];
for(i=0;i<locs.length;i++) {
var country = locs[i].country;
var location = locs[i].location;
var lat = locs[i].lat;
var long = locs[i].long;
var description = locs[i].description;
obj.push({
con: country,
location: location,
lat: lat,
lng: long,
description: description
});
}
console.log(obj);
initMap(obj)
});
function initMap(obj, error) {
if (error){console.log("Error: "+error)}
var openInfoWindow = null;
var mapProp = {
center: {lat: 39.8283, lng: -98.5795},
zoom: 2
};
var map = new google.maps.Map(document.getElementById("googleMap"), mapProp);
var pointLoc = [];
var labels = [];
var descrip = [];
var locale = [];
for(i=0;i<obj.length;i++) {
pointLoc.push({lat: obj[i].lat, lng: obj[i].lng});
labels.push(obj[i].con);
descrip.push(obj[i].description);
locale.push(obj[i].location);
}
map.data.loadGeoJson();
for (var i = 0; i < pointLoc.length; i++) {
var coords = pointLoc[i];
var latLng = new google.maps.LatLng(coords.lat,coords.lng);
var marker = new google.maps.Marker({
position: latLng,
map: map
});
var contentStr = '<div id="popcontent">'+
'<div id="siteNotice">'+
'</div>'+
'<h1 id="firstHeading" class="firstHeading">'+descrip[i]+'</h1>'+
'<p>'+locale[i]+', '+labels[i]+'</p>' +
'</div>';
var infoWindow = new google.maps.InfoWindow({
maxWidth: 300
});
google.maps.event.addListener(marker,'click', (function(marker,contentStr,infowindow){
infowindow.close();
return((function(infowindow) {
infowindow.setContent(contentStr);
infowindow.open(map, marker);
})(infowindow));
})(marker,contentStr,infoWindow));
}
}
答案 1 :(得分:0)
斯蒂芬的答案确定了infowindow的问题。我想帮助你学习编写更简单的代码。
此代码中存在许多您不需要的复杂功能;实际上你可以摆脱大部分代码!
代码首先将pointLoc
数组转换为非常相似的labels
数组,该数组重命名了几个字段。
然后它会将此descrip
数组转换为四个单独的数组locale
,map.data.loadGeoJson();
,click
和d3.csv( '/data/locs.csv', function( places ) {
var infoWindow;
var map = new google.maps.Map( document.getElementById('googleMap'), {
center: { lat: 39.8283, lng: -98.5795 },
zoom: 2
});
places.forEach( function( place ) {
var marker = new google.maps.Marker({
position: new google.maps.LatLng( place.lat, place.long ),
map: map
});
google.maps.event.addListener( marker, 'click', function() {
if( infoWindow ) infoWindow.close();
var content =
'<div id="popcontent">' +
'<div id="siteNotice">' +
'</div>' +
'<h1 id="firstHeading" class="firstHeading">' + place.description + '</h1>' +
'<p>' + place.location + ', ' + place.country + '</p>' +
'</div>';
infoWindow = new google.maps.InfoWindow({
maxWidth: 300,
content: content
});
infoWindow.open( map, marker );
});
});
});
。
不需要进行任何转换。
此外,在命名数组时,我建议对数组使用复数名称,并为数组的元素使用该名称的单数形式。你在某些地方这样做了,但并不是一贯的。
有一个def LeftClick(event):
if c==True:
next_value = " 123456789 "
try:
current_value = next_value[next_value.index(str(int(event.widget['text']))) + 1]
except ValueError:
current_value = "1"
event.widget.config(text=current_value)
#Create a 9x9 (rows x columns) grid of buttons inside the frame
for row_index in range(9):
for col_index in range(9):
if (row_index in {0, 1, 2, 6, 7, 8} and col_index in {3, 4, 5}) or \
(row_index in {3, 4, 5} and col_index in {0, 1, 2, 6, 7, 8}): #Colours a group of 3x3 buttons together to differentiate the board better.
colour = 'gray85'
else:
colour = 'snow'
c=True
btn = Button(frame, width = 12, height = 6, bg=colour) #create a button inside frame
btn.grid(row=row_index, column=col_index, sticky=N+S+E+W)
btn.bind("<Button-1>", LeftClick)
buttons.append(btn)
if row_index==4 and col_index==1:
btn.config(text=2)
c = False
调用无法执行任何操作,因为没有提供任何URL。
如果您以下面的代码中更简单的方式提供闭包,那么您也不需要static int a;
static int a=0;
侦听器中的函数-the-returns-a-function。
以下是一个如何以更简单的方式完成整个事情的示例:
void foo()
{
static int b;
static int b=0; //error: Duplicate declaration of global variable 'b'
...
答案 2 :(得分:0)
我可以使用 jQuery 触发事件轻松处理它。
jQuery('.gm-ui-hover-effect').trigger('click');
只需将上面的代码放在标记的 addListener 函数中,不要忘记在脚本中包含 jQuery。