谷歌地图API V3 – 点击标记显示更多信息内容作为叠加（如在谷歌地图）

我们使用Google Map Api V3在HTML容器中加载谷歌地图。 我们有一个位置搜索表单。 提交后，我们将获取可用的位置并在地图中设置标记。 加载标记后，点击每个标记我们需要显示标题，地址详细信息和设计，就像我们在谷歌地图中所拥有的那样。 （在谷歌地图中 – 当点击红色标记时，我们可以看到更多信息覆盖框，其中包含其他详细信息，如星星，路线，附近搜索，保存到地图，更多..）

我们是否内置了apifunction来加载上面的覆盖框。 或者我们没有加载详细信息的function，就像我们目前在谷歌地图中所拥有的那样。

当我在谷歌和地图文档中搜索时，我可以看到显示叠加窗口和在框内写入内容的选项。 但我没有看到根据需要加载内容的选项。

我已粘贴以下代码供参考。

var map = null; gmap_ready = function (){ var myLatlng = new google.maps.LatLng(43.834527,-103.564457); var myOptions = { zoom: 3, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

}

  function fnLoadMarkers(){ var locations = [ ['S Dakota', 43.834527,-103.564457, 1], ['Texas', 31.428663,-99.418947, 2], ['California', 36.668419,-120.249025, 3], ['Newyork', 43.197167,-76.743166, 4], ['Missouri', 38.410558,-92.73926, 5] ]; setMarkers(map,locations); } function setMarkers(map, locations) { var image = 'images/marker.gif'; for (var i = 0; i < locations.length; i++) { var currLocation = locations[i]; var latLng = new google.maps.LatLng(currLocation[1], currLocation[2]); var marker = new google.maps.Marker({ position: latLng, map: map, icon: image, title: currLocation[0], zIndex: currLocation[3] }); google.maps.event.addListener(marker, 'click', function() { var latitude = this.position.lat(); var longitude = this.position.lng(); window.open("http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q="+latitude+","+longitude+"&sll="+latitude+","+longitude+"&sspn=0.172749,0.4422&ie=UTF8&ll="+latitude+","+longitude+"&spn=0.162818,0.4422&z=11&iwloc=A"); }); } 

}

如果有任何关于如何实现这些结果的提示，将会有所帮助。 另外，请指导，是否可以通过Google API V3。

提前致谢，

问候

Srinivasan.C

Answer 1

我不明白您为什么要从Google Maps API标记打开谷歌地图的新窗口？ 您无法通过url在Google地图上添加信息窗口。

我就是这样做的。