2

我正在使用 Gmaps4rails 并且已经成功地进行了相当多的工作，但我有点难过。可能是由于我的新手JS技能。我一直在尝试在各种问题中遵循示例，但我不确定我哪里出错了。

当我的地图加载 Gmaps.map.callback 工作正常时，地图已加载，我单击一个标记并触发侦听器事件。

在我看来：

<% content_for :scripts do %>
<script type="text/javascript">
Gmaps.map.callback = function(){
  for(var i = 0; i < Gmaps.map.markers.length; i++){
    marker = Gmaps.map.markers[i];
    google.maps.event.addListener(marker.serviceObject, 'click', 
      (function(marker){
        return function(){      
      alert(marker.id);
        }
      })(marker)
   )
 }
}
</script>
<% end %>

这将使用控制器中创建的 json 中的标记 id 发出警报。

然后我有一个搜索功能，可以更新地图的位置并替换标记。这是在 ajax 调用中调用的。所以在控制器 .js.erb 我这样做：

Gmaps.map.replaceMarkers(<%= raw @json %>);

一切似乎都很好，我的地图加载了新的标记，但偶数侦听器在标记上不起作用。

所以我的问题是，如何让这些新标记拥有点击事件的监听器。我需要以某种方式重置回调吗？我认为它必须在地图加载之前运行，但在这种情况下，我不会重新加载地图，只是替换标记。

4

2 回答 2

3

提取您的方法以重用它：

Gmaps.map.listen_to_markers = function(markers){
  for(var i = 0; i < markers.length; i++){
    marker = markers[i];
    google.maps.event.addListener(marker.serviceObject, 'click', 
      (function(marker){
        return function(){      
          alert(marker.id);
        }
      })(marker)
   )
 }
}

Gmaps.map.callback = function(){
  Gmaps.map.listen_to_markers(Gmaps.map.markers);
}

每当您更换标记时：

var new_markers = <%= raw @json %>;
Gmaps.map.replaceMarkers(new_markers);
Gmaps.map.listen_to_markers(new_markers);
于 2013-02-01T08:45:17.287 回答
0

丢弃“content_for”、“Gmaps.map.callback”等。保留buildMap(<%=raw @hash.to_json %>)在您的视图文件中。

在您的咖啡脚本文件中，在代码行之后插入您自己的工作handler.fitMapToBounds();

例如，点击导航栏的某一项，触发特定标记的点击功能，打开信息窗口。

在 .html.erb 文件中，

a href="javascript:void(0)" class="mapEventName" id="<%= i %>"><%= event.event_name %>

在 .js.coffee 文件中，

$(".mapEventName").on "click", ->
  i = $(this).attr("id")
  marker = markers[i]
  alert(marker.getServiceObject().getPosition().toString())
  google.maps.event.trigger marker.getServiceObject(), "click"

> "
于 2013-12-02T07:57:03.883 回答