google maps api v3 - 从外部点击打开infowindow [英] google maps api v3 - open infowindow from an external click

问题描述

 函数init（）{
 var mapCenter = new google.maps.LatLng（51.5081289，-0.128005）; 
 var map = new google.maps.Map（document.getElementById（'map'），{
'zoom'：6，
'center'：mapCenter，
'mapTypeId '：google.maps.MapTypeId.ROADMAP，
 panControl：false，
 mapTypeControl：false，
 zoomControl：true，
 zoomControlOptions：{
 style：google.maps .ZoomControlStyle.SMALL，
 position：google.maps.ControlPosition.LEFT_TOP 
}，
}）; 
  

以及如下所示的标记负荷：

  var marker25837500 = new google.maps.Marker（{
 map：map，
 pop_title：'blah blah'，
 pop_wind：' more blah'，
 zIndex：999，
 icon：'images / map_icons / s6.png'
}）; 
 google.maps.event.addListener（marker25837500，'点击'，onMarkerClick）; 
  

最后我有一个函数来打开每个制造商点击的infowindow：

  var infoWindow = new google.maps.InfoWindow; 
 
 var onMarkerClick = OpenInfoWindow; 
 
函数OpenInfoWindow（）{
 var marker = this; 
 infoWindow.setContent（'< h3>'+ marker.pop_title +'< / h3>'+ 
 marker.pop_body）; 
 
 infoWindow.open（map，marker）; 
}; 
 google.maps.event.addListener（map，'click'，function（）{
 infoWindow.close（）; 
}）; 
  

我的问题是，我需要做什么才能制作特定的标记（例如marker25837500） infowindow当页面内部被点击时 - 可能是这样的：

 < div id =marker25837500>点击查看信息窗口<！/ DIV> 
  

我确定这很容易，但我可以看到我的方式！

谢谢

解决方案

您可以使用触发 $）。



  $（'＃marker25837500'）。click（function（）{
 google.maps .event.trigger（marker25837500，'click'）
}）
  

href =https://developers.google.com/maps/documentation/javascript/reference#event =noreferrer> https://developers.google.com/maps/documentation/javascript/reference#event

编辑：还注意到当您调用 onMarkerClick（）时 marker25837500 被点击，但是您将其他函数命名为 OpenInfoWindow（），因此您可能需要更改它。 p>

So i have a V3 map which is initialised like this:

function init() {
        var mapCenter = new google.maps.LatLng(51.5081289,-0.128005);
        var map = new google.maps.Map(document.getElementById('map'), {
          'zoom': 6,
          'center': mapCenter,
          'mapTypeId': google.maps.MapTypeId.ROADMAP, 
          panControl: false,
          mapTypeControl: false,
          zoomControl: true,
          zoomControlOptions: {
                style: google.maps.ZoomControlStyle.SMALL,
                position: google.maps.ControlPosition.LEFT_TOP
            },
        });

and a load of markers that look like this:

var marker25837500 = new google.maps.Marker({
              map: map, 
              pop_title: 'blah blah',                                                                                                 
              pop_wind: 'more blah',
                      zIndex: 999,
              icon: 'images/map_icons/s6.png'
            }); 
            google.maps.event.addListener(marker25837500, 'click', onMarkerClick);

and lastly i have a function to open the infowindow on he click of each maker:

var infoWindow = new google.maps.InfoWindow;

var onMarkerClick = OpenInfoWindow;

function OpenInfoWindow() {
          var marker = this;
          infoWindow.setContent('<h3>' + marker.pop_title + '</h3>' +
                                         marker.pop_body);

          infoWindow.open(map, marker);
        };
        google.maps.event.addListener(map, 'click', function() {
          infoWindow.close();
        }); 

My question is, what do i need to do to make a particular marker (say marker25837500) show its infowindow when a inside the page is clicked - perhaps something like:

<div id="marker25837500">click to see infoWindow!</div>

I'm sure it's easy but i just can see my way though it!

Thanks

解决方案

You might use trigger event.

$('#marker25837500').click(function () {
    google.maps.event.trigger(marker25837500, 'click')
})

Check this- https://developers.google.com/maps/documentation/javascript/reference#event

Edit: Also noticed that you are calling onMarkerClick() when marker25837500 is clicked, but you named the other function OpenInfoWindow() so you might need to change that too.

这篇关于google maps api v3 - 从外部点击打开infowindow的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！