Gmaps4rails – 如何从地图中调用infowindow标记

我之前使用过gmaps4rails但是这次我有一个需要，我无法弄清楚如何做到这一点。

我有我的构建器工作并生成我的map_info部分，我也可以通过在地图内单击来打开每个infowindow。

我需要的是从列表中调用标记的信息窗口。 （例如div内的onclick事件）

控制器内的生成器

@gmaps_markers = Gmaps4rails.build_markers(@partners) do |partner, marker| marker.lat partner.latitude marker.lng partner.longitude marker.title partner.company marker.json({:id => partner.id }) marker.infowindow render_to_string(partial: 'pages/partials/subscribe/map_info', locals: { partner: partner }) end 

javascript标记+贴图生成器

 handler = Gmaps.build('Google', { markers: { clusterer: { gridSize: 10, maxZoom: 15 } } }); handler.buildMap({ provider: { disableDefaultUI: false }, internal: { id: 'gmaps' } }, function() { markers = handler.addMarkers(#{ raw @gmaps_markers.to_json }); handler.bounds.extendWith(markers); handler.fitMapToBounds(); handler.getMap().setZoom(8); handler.map.centerOn; } ); 

如果您需要更多详细信息，请告诉我们！ 谢谢

Answer 1

最简单的选择是触发标记上的click事件：

 function openMarkerInfo(id) { $.each(markers, function(index, marker) { if (marker.id == id) { google.maps.event.trigger(marker.getServiceObject(), 'click') } }); }; 

请看这里的工作

Answer 2

您需要将id添加到标记

将地图和标记生成js更改为

 Gmaps.store = {} handler = Gmaps.build('Google', { markers: { clusterer: { gridSize: 10, maxZoom: 15 } } }); handler.buildMap({ provider: { disableDefaultUI: false }, internal: { id: 'gmaps' } }, function() { Gmaps.store.markers = handler.addMarkers(#{ raw @gmaps_markers.to_json }); handler.bounds.extendWith(Gmaps.store.markers); handler.fitMapToBounds(); handler.getMap().setZoom(8); handler.map.centerOn; }); 

然后写js函数

 Gmaps.openMarkerInfo = function(id) { $.each(Gmaps.store.markers, function() { if (this.serviceObject.id == id) { var infowindow = this.infowindow; infowindow.open(Gmaps.map.map, marker.serviceObject); } }); } 

然后将其添加到列表元素的onclick中

 Gmaps.openMarkerInfo(1); 

Answer 3

我找到了解决方案。 看一看…

Javascript onclickfunction

  openInfoWindow = function(id) { $.each(Gmaps.store.markers, function() { if (this.serviceObject.id == id) { google.maps.event.trigger(this.getServiceObject(), 'click') } }); } 

Javascript地图+标记生成器

  Gmaps.store = {} Gmaps.store.handler = Gmaps.build('Google', { markers: { clusterer: { gridSize: 10, maxZoom:15 } } }); Gmaps.store.handler.buildMap({ provider: { disableDefaultUI: false }, internal: { id: 'gmaps' } }, function(){ markers = #{raw @gmaps_markers.to_json}; Gmaps.store.markers = markers.map(function(m) { marker = Gmaps.store.handler.addMarker(m); marker.serviceObject.set('id', m.id); return marker; }); Gmaps.store.handler.bounds.extendWith(Gmaps.store.markers); Gmaps.store.handler.fitMapToBounds(); } ); 

然后，调用onclick事件。

 openInfoWindow(id); 

到目前为止工作并没有错误……

🙂