gmaps4rails :用gmaps4rails进行迭代

Question

我对很陌生。我按照gmaps4rails中的说明创建了一个简单的应用程序，您可以在该应用程序中加载带有多个标记的ONE映射。我感兴趣的是加载--许多映射只带有one标记。当我试图将代码放入迭代中时，div只是保持为空。认为：

<p id="notice"><%= notice %></p>

<h1>Listing Places</h1>

<table>
  <thead>
    <tr>
      <th>Latitude</th>
      <th>Longitude</th>
      <th>Address</th>
      <th>Description</th>
      <th>Title</th>
      <th>Map</th>
      <th colspan="3"></th>
    </tr>
  </thead>

  <tbody>
    <% @places.each do |place| %>
      <tr>
        <td><%= place.latitude %></td>
        <td><%= place.longitude %></td>
        <td><%= place.address %></td>
        <td><%= place.description %></td>
        <td><%= place.title %></td>
        <td><div style='width: 80px;'>
            <div id="minimap" style='width: 80px; height: 40px;'></div>
          </div>

          </td>
        <td><%= link_to 'Show', place %></td>
        <td><%= link_to 'Edit', edit_place_path(place) %></td>
        <td><%= link_to 'Destroy', place, method: :delete, data: { confirm: 'Are you sure?' } %></td>
      </tr>
    <% end %>
  </tbody>
</table>

<br>

<%= link_to 'New Place', new_place_path %>

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

<script type="text/javascript">
  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>

在控制器中，我有以下代码：

def index
    @places = Place.all
    @hash = Gmaps4rails.build_markers(@places) do |place, marker|
      marker.lat place.latitude
      marker.lng place.longitude
end

我尝试将脚本放入循环中，并将标记更改为

markers = handler.addMarkers("lag":<%= place.latitude %>,"lng":<%= place.longitude %>);

但没起作用。

有人能帮我吗？这是我的存储库：https://github.com/francisconlm/mapps告诉我如果您需要更多的细节，谢谢

ps:如果有人认为有比gmaps4rails更好的使用gmaps的方法，建议总是受欢迎的:)

Answer 1

我找到了答案。我还需要循环变量。这对我有用，但也许有人可以告诉我如何改进它:)

 <% @places.each do |place| %>
        <tr>
          <td><%= place.latitude %></td>
          <td><%= place.longitude %></td>
          <td><%= place.address %></td>
          <td><%= place.description %></td>
          <td><%= place.title %></td>
          <td>

  <div style='width: 400px;'>
              <div id="map<%= place.id %>" style='width: 400px; height: 200px;'></div>
            </div>

  <script type="text/javascript">
    handler<%= place.id %> = Gmaps.build('Google');
    handler<%= place.id %>.buildMap({ provider: {}, internal: {id: 'map<%= place.id %>'}}, function(){
    markers<%= place.id %> = handler<%= place.id %>.addMarkers([{ lat: <%= place.latitude %>, lng: <%= place.longitude %>}]);
    handler<%= place.id %>.bounds.extendWith(markers<%= place.id %>);
    handler<%= place.id %>.fitMapToBounds();
    handler<%= place.id %>.getMap().setZoom(10);
    });
  </script>
          </td>
          <td><%= link_to 'Show', place %></td>
          <td><%= link_to 'Edit', edit_place_path(place) %></td>
          <td><%= link_to 'Destroy', place, method: :delete, data: { confirm: 'Are you sure?' } %></td>
        </tr>
      <% end %>

Answer 2

你必须用它和类似的

markers = handler.addMarkers(<%=raw @hash.to_json %>); 

您不能在您的div内循环。请用firebug检查，这是js上的任何错误。