ruby-on-rails - 您如何使用 gmaps4rails 在 Ruby on Rails 中使用 UJS 发送 ajax 调用？

Question

我遵循了两个位置的示例：

• https://github.com/apneadiving/Google-Maps-for-Rails/wiki/Using-with-UJS
• https://gist.github.com/1643990

但它们都不起作用。我没有得到任何回报。我目前在 RoR 3.2.8 中使用 1.5.5 版本的 gmaps4rails。

show_map.js.erb

$('#map_container').show();
$('#map_container').html('<%= escape_javascript( gmaps({:last_map => false}) ) %>');
Gmaps.map = new Gmaps4RailsGoogle();

Gmaps.load_map = function() {
  Gmaps.map.map_options.maxZoom = 15;
  Gmaps.map.initialize();
  Gmaps.map.create_markers();
  Gmaps.map.adjustMapToBounds();
  Gmaps.map.markers = <%= @json %>;
  Gmaps.map.callback();
};
Gmaps.loadMaps();

users_controller.rb

  def show_map
    @user = User.first
    @json = @user.to_gmaps4rails
    respond_to do |format|
      format.js {}
    end
  end

显示.html.haml

  = link_to "Map", show_map_path, :remote => true
  #map_container{:style => 'display:none;'}

谢谢你的帮助！

Answer 1

我有同样的问题@persistence，我更喜欢在这个线程中报告。我尝试先遵循两个 wiki 示例，然后坚持@apneadiving评论并遵循您的要点，但我仍然遗漏了要点中的一些内容。我将此代码放在我的控制器中：

事件控制器

def index
    @json = Event.all.to_gmaps4rails do |event, marker|
        marker.title        event.title
        marker.infowindow   event.description
        marker.sidebar      'This is a side bar'
    end
    p @json
    respond_with @json
end

在我看来，我粘贴了要点的确切代码。当我按下加载按钮时，我在控制台中检查我的 json 信息是否正常，但由于 Javascript 错误，地图未加载：

TypeError: Gmaps.map is undefined

我想我错过了地图的某种 Javascript 初始化？

2012 年 5 月 11 日更新：

这确实是问题所在。结合 gist 和 wiki 示例中的 javascript，我通过将以下代码放入视图中来完成这项工作：

索引视图

<!-- create html + load js files but don't create map itself: will be done after ajax call -->
<%= gmaps({:last_map => false}) %>
<br/>

<!-- button to trigger ajax call -->
<button type="button" id="ajax">Load Map</button>

<script type="text/javascript" charset="utf-8">
$(function() {

    //hide the empty container
    $(".map_container").hide();

    // Map initialization
    Gmaps.map = new Gmaps4RailsGoogle();
    Gmaps.load_map = function() {
         Gmaps.map.map_options.maxZoom = 15;
         Gmaps.map.initialize();
         Gmaps.map.create_markers();
         Gmaps.map.adjustMapToBounds();
         Gmaps.map.callback();
    };

    $("#ajax").click(function(){
         $.getJSON('/events', function(json){
              $(".map_container").show();
              Gmaps.loadMaps();
              Gmaps.map.addMarkers(json);
         })
    })
});
</script>

我还在 GitHub 中留下了一些加载 Gmaps4Rails 地图的简单示例：https ://github.com/daviddefco/Gmaps4RailsS​​amples.git

1. 使用和 HTML 部分
2. 使用由 HTML 按钮触发的 AJAX 请求（要点示例）
3. 在 Javascript 操作中使用 AJAX 请求（wiki 示例）

我是 RoR 和 Javascript 新手，因此欢迎评论或代码改进。