简体   繁体   English

谷歌地图 - 给定坐标打开标记infowindow

[英]google maps - open marker infowindow given the coordinates

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,我怎样才能打开标记的infowindow给出它的坐标?

Here is the Jsfiddle that shows you how to do an "outside" of the map JavaScript interaction w/ the Markers. 这是Jsfiddle ,它向您展示如何使用Markers进行地图JavaScript交互的“外部”。 Yes, you do need to save the markers and it's appropriate InfoWindow within an array so you can access it. 是的,您需要保存标记,并在数组中使用相应的InfoWindow,以便您可以访问它。 I created two random markers and use the coordinates from the array ships. 我创建了两个随机标记并使用数组中的坐标。

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. 在createMarker中,我将创建的制造商与其关联InfoWindow一起存储并将其推送到全局范围的标记数组。 On hover the marker, it'll open its associate 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. 在gotoPoint中,我只需将标记号作为参数。 I basically set the center of the map to that of marker by using new google.maps.LatLng and use the marker's lat and lng by calling marker[myPoint-1].position.lat(); 我基本上通过使用new google.maps.LatLng将地图的中心设置为标记的中心,并通过调用marker[myPoint-1].position.lat();使用标记的lat和lng marker[myPoint-1].position.lat(); and marker[myPoint-1].position.lng(); marker[myPoint-1].position.lng(); , and open its associate InfoWindow with marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]); ,并使用marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);打开其关联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. 如果您对此示例有任何疑问,请与我们联系。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM