Rails: 如何在 Gmaps4rails 中更改标记和添加信息窗口

Rails: how to change a marker and add infowindow in Gmaps4rails

我正在使用 Gmaps4rails gem,这是我的设置:

def show
    @items = Item.find(params[:id])
    @hash = Gmaps4rails.build_markers(@items) do |item, marker|
      marker.lat item.latitude
      marker.lng item.longitude
      marker.picture({
                     :url => "http://maps.google.com/mapfiles/arrow.png",
                     :width   => 32,
                     :height  => 32
                 })
    end
    append_cur_location
  end

def append_cur_location
    @hash << { :lat=>action[0], :lng=>action[1]}
end

def action
  @lat_lng = cookies[:lat_lng].split("|")
end

我从 action method 获取当前位置,从 item.latitudeitem.longitude 获取 item 位置。

views/items/show.html.erb

<div style='width: 800px;'>
  <div id="map" style='width: 800px; height: 400px;'></div>
</div>

<script>
    handler = Gmaps.build('Google');
    handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){
        markers = handler.addMarkers(<%=raw @hash.to_json %>);
        handler.bounds.extendWith(markers);
        handler.fitMapToBounds();
    });
</script>

通过以上设置,我得到了显示当前位置和项目位置的地图。此外,我还能够更改项目位置标记。 但我不知道如何更改当前位置标记并将信息框添加到项目位置。对如何实施这些更改有任何想法吗?

信息窗口

你可以使用marker.infowindow

def show
  @items = Item.find(params[:id])
  @hash = Gmaps4rails.build_markers(@items) do |item, marker|
    marker.lat item.latitude
    marker.lng item.longitude
    marker.picture({
                   :url => "http://maps.google.com/mapfiles/arrow.png",
                   :width   => 32,
                   :height  => 32
               })

    #INFOWINDOW
    # Use can use partial to render infowindow
    # marker.infowindow render_to_string(:partial => 'items/info_page')
    # or else
    marker.infowindow "ITEM HERE!!!!"

  end
  append_cur_location
end

当前位置的不同图片

def append_cur_location
  @hash << { 
  :lat=>action[0], 
  :lng=>action[1],
  :picture=> {
      :url=> "http://people.mozilla.com/~faaborg/files/shiretoko/firefoxIcon/firefox-32.png",
      :width=>  32,
      :height=> 32
    }
  }
end