jquery - gmaps4rails 按 id 选择标记

Question

我想在用户将鼠标悬停在给定链接上时打开一个信息窗口。

我已经给出了所有标记 ID，并且链接具有相同的 ID。我可以让悬停打开一个信息窗口，我只是不确定如何让它根据链接的 id 和正确的标记打开它。

Js:它会在 map 上弹出一个信息框，只是不确定如何在 map 上指定正确的 ID。

  <script type="text/javascript">
    $(document).ready(function() {
      Gmaps.map.callback = function() {
        $(".items li a").on("mouseover", function() {
          //alert(this.id);
          var marker = Gmaps.map.markers[0]; //this.id
          var map         = Gmaps.map.serviceObject
          marker.infowindow.open(map, marker.serviceObject);
        });
      }
    });
  </script>

标记:

@json = @events.to_gmaps4rails do |event, marker|
  marker.infowindow render_to_string(:partial => "/events/hover", :locals => { :event => event })
  marker.title   "#{event.place.name}"
  marker.json({ :id => event.id })
end

链接:

<%= link_to event.place.name, pub_path(event.place), id: event.id %>

Answer 1

你很接近。您必须遍历所有标记才能找到正确的标记。使用underscore.js你可以这样做:

Gmaps.map.callback = function() {
  $(".items li a").on("mouseover", function() {

    //id of selected marker
    i = $(this).attr("id");
    marker = _.find(Gmaps.map.markers, function(obj) { return obj.id == i })
    var map         = Gmaps.map.serviceObject          
    marker.infowindow.open(map, marker.serviceObject);
  });
}