Javascript Google地图标记信息窗口未显示除起始地图位置以外的其他位置
我试图在单击标记时弹出一个信息窗口。然而,信息窗口 仅当标记位于与创建谷歌地图的位置相等的位置时才会显示。任何其他标记位置和信息窗口都不会弹出。这似乎是一个非常奇怪的问题。控制台上没有错误 例如,在代码中,如果我将标记的位置设置为传递的lat和long,这将用于生成google地图。很好。但是如果我稍微改变一下位置(Javascript Google地图标记信息窗口未显示除起始地图位置以外的其他位置,javascript,google-maps,google-maps-api-3,infowindow,Javascript,Google Maps,Google Maps Api 3,Infowindow,我试图在单击标记时弹出一个信息窗口。然而,信息窗口 仅当标记位于与创建谷歌地图的位置相等的位置时才会显示。任何其他标记位置和信息窗口都不会弹出。这似乎是一个非常奇怪的问题。控制台上没有错误 例如,在代码中,如果我将标记的位置设置为传递的lat和long,这将用于生成google地图。很好。但是如果我稍微改变一下位置(position\u val),就像我对lat+1所做的那样,信息窗口不会显示出来。但是当我点击infowindow时,它会将地图居中放置到infowindow应该显示的位置。侦听器
position\u val
),就像我对lat+1
所做的那样,信息窗口不会显示出来。但是当我点击infowindow时,它会将地图居中放置到infowindow应该显示的位置。侦听器确实可以工作,正如我在单击标记时尝试输出console.log()。为什么我不能让标记有一个不同的位置?为了简单起见,我结合了地图创建和标记创建
编辑:jsiddle链接:
任何帮助都将不胜感激。谢谢。我不能确切地告诉您它发生的原因,通常情况下不应该发生,但是地图的
位置-属性(无论值是什么)的纯粹存在似乎是个问题
演示:
带位置
:
无位置
:
注意:我对您的代码做了一些修改,以减少其他可能的原因。e、 g.您不应该使用long
作为标识符,因为它是一个
然而,它与原始代码中的另一行一起工作对我来说毫无意义,好奇
您可能会对此感到惊讶。这确实很奇怪,我假设在尝试使用lat+1部件时,infowindow的定位中断或放错了位置。。。你试过像LatLng((lat+1),long)之类的东西吗?谢谢你的建议,但是没有用。我也尝试过对值进行硬编码。您能告诉我们您在哪里调用makeMap
,包括您正在使用的lat/lng值的示例吗?如果您执行lat+=1;position_val=new google.maps.LatLng(lat,long)代码>仍然是相同的问题。我将其添加到JSFIDLE。如果调出位置值,您可以看到它在第21行和第22行上工作,而不是工作。抓得很好。我在查看谷歌地图的属性,它看起来好像位置
不是一个列出的属性。尽管如此,您仍然可以使用position
更改谷歌地图显示位置。所以我一开始就不应该使用位置
。
var map;
var infowindow = new google.maps.InfoWindow({});
function makeMap(lat, long) {
var myOptions = {
mapTypeId: google.maps.MapTypeId.ROADMAP,
position: new google.maps.LatLng(lat, long),
zoom: 14,
};
map = new google.maps.Map( document.getElementById("map_canvas"), myOptions);
map.setCenter( myOptions.position);
//position_val = new google.maps.LatLng(lat, long); infowindow works
position_val = new google.maps.LatLng(lat + 1, long); //infowindow doesn't work
var marker = new google.maps.Marker({
position: position_val ,
map: map,
});
map.setCenter(position_val);
var contentString = 'hello how are you';
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(contentString);
infowindow.open(map, marker);
});
}