[英]How to have a hyperlink update an embedded google map with a location marker and information
我在这里看到了类似的问题无法解答,或者需要刷新页面,希望我可以从比我更熟悉Google Maps API的人那里得到答案,并且我希望这种方法无需刷新就可以解决这一页。
我在网页上有一个嵌入式Google地图,并且在网页的HTML中有一个位置列表。
我希望这样,当访问者单击某个位置时,它会在嵌入式地图上显示该位置。
听起来很简单吧? 我已经阅读了两天的API文档,但似乎找不到我想要的东西。
我希望能够调用将设置位置/标记/ InfoBox的链接的JS函数onClick。 我基本上只需要知道如何通过链接与嵌入的地图进行通信。 我可以自己整理信息框,其余的可以整理。
非常感谢您的阅读!
如果您想知道,我正在使用以下JS嵌入Google地图:
function initialize() {
var mapOptions = {
zoom: 8,
panControl: false,
rotateControl: false,
scaleControl: false,
streetViewControl: false,
center: new google.maps.LatLng(51.004106,-114.135442),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("header"), mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
您可能需要创建一个函数来添加标记,如下所示:
function addMarker(map, lat, long, title, popupHtml) {
var latLong = new google.maps.LatLng(lat, long);
var markerOpts = { position: latLong, map: map, title: title };
var marker = new google.maps.Marker(markerOpts);
var infoWindow = new google.maps.InfoWindow();
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(popupHtml);
infoWindow.open(map, marker);
});
}
然后在initialize函数中执行一些操作以将该函数附加到链接。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.