Javascript 谷歌地图 - 根据坐标打开标记信息窗口

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/5068097/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 15:30:35  来源:igfitidea点击:

google maps - open marker infowindow given the coordinates

javascriptgoogle-maps

提问by raklos

I am using google maps api v3.

我正在使用谷歌地图 api v3。

Using javascript, how can i open the infowindow of a marker given it's coordinates?

使用javascript,我如何打开一个标记的信息窗口,给定它的坐标?

回答by u476945

Here is the Jsfiddlethat shows you how to do an "outside" of the map JavaScript interaction w/ the Markers. Yes, you do need to save the markers and it's appropriate InfoWindow within an array so you can access it. I created two random markers and use the coordinates from the array ships.

这是Jsfiddle,它向您展示了如何使用标记进行地图 JavaScript 交互的“外部”。是的,您确实需要保存标记,并且它是数组中适当的 InfoWindow,以便您可以访问它。我创建了两个随机标记并使用了来自阵列船的坐标。

Here are the HTML and with two generic links where clicking link one would center to maker 1 and popup its infowindow and for marker 2 vise versa:

这是 HTML 和两个通用链接,其中单击链接一个将以制造商 1 为中心并弹出其信息窗口,对于标记 2 反之亦然:

    <div id='map_canvas'></div>
    <a href='#' onClick="gotoPoint(1);">Click for marker 1</a><br/>
    <a href='#' onClick="gotoPoint(2);">Click for marker 2</a>

Within createMarker i store the created maker along with its associate InfoWindow and push it onto the global scope's marker array. On hover the marker, it'll open its associate infowindow:

在 createMarker 中,我将创建的 maker 与其关联的 InfoWindow 一起存储,并将其推送到全局范围的标记数组上。悬停标记时,它将打开其关联信息窗口:

function createMarker(lat, lon, html) {
    var newmarker = new google.maps.Marker({
        position: new google.maps.LatLng(lat, lon),
        map: map,
        title: html
    });

    newmarker['infowindow'] = new google.maps.InfoWindow({
            content: html
        });

    google.maps.event.addListener(newmarker, 'mouseover', function() {
        this['infowindow'].open(map, this);
    });

    marker.push(newmarker);
}

Here in gotoPoint i simply ass in the marker number as a parameter. I basically set the center of the map to that of marker by using new google.maps.LatLngand use the marker's lat and lng by calling marker[myPoint-1].position.lat();and marker[myPoint-1].position.lng();, and open its associate InfoWindow with marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);:

在 gotoPoint 中,我只是将标记号作为参数输入。我基本上new google.maps.LatLng通过调用marker[myPoint-1].position.lat();和使用标记的 lat 和 lng将地图的中心设置为标记的中心marker[myPoint-1].position.lng();,并打开其关联的 InfoWindow marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);

function gotoPoint(myPoint){
    map.setCenter(new google.maps.LatLng(marker[myPoint-1].position.lat(), marker[myPoint-1].position.lng()));
    marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);
}

Let me know if you have any questions about this example.

如果您对此示例有任何疑问,请告诉我。