Ruby on rails 在Rails中使用Google地图和分页
我有一个视图,我正试图显示一个分页的对象列表,以及一个显示这些对象的谷歌地图。我有一个“旅行”视图,显示属于该旅行的“点”。每个点都有一个lat/lng。页面最初加载正确,但当我移动到不同的页面时,我开始出现如下错误:Ruby on rails 在Rails中使用Google地图和分页,ruby-on-rails,ruby-on-rails-5,will-paginate,gmaps4rails,Ruby On Rails,Ruby On Rails 5,Will Paginate,Gmaps4rails,我有一个视图,我正试图显示一个分页的对象列表,以及一个显示这些对象的谷歌地图。我有一个“旅行”视图,显示属于该旅行的“点”。每个点都有一个lat/lng。页面最初加载正确,但当我移动到不同的页面时,我开始出现如下错误: "You have included the Google Maps API multiple times on this page. This may cause unexpected errors." message: "not a LatLng or LatLngLite
"You have included the Google Maps API multiple times on this page. This may cause unexpected errors."
message: "not a LatLng or LatLngLiteral: in property lat: not a number"
name: "InvalidValueError"
在我的文件中:
gem 'gmaps4rails', '2.1.2'
gem 'underscore-rails'
gem 'gmaps'
在app/assets/javascripts/application.js中:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require underscore
//= require gmaps/google
//= require_tree .
我的控制器:
def show
@trip = Trip.find(params[:id])
@trip_points = @trip.trip_points
@markers = Gmaps4rails.build_markers(@trip_points) do |pt, marker|
next if pt.lat.nil? || pt.lon.nil?
marker.lat pt.lat
marker.lng pt.lon
end
@markers.reject! { |m| m.empty? }
@trip_points = @trip_points.paginate(page: params[:page])
end
我想显示地图上的所有点,同时对点的视图进行分页
我的看法是:
<script src="//maps.google.com/maps/api/js?key=MYAPIKEY" type="text/javascript"></script>
<script src="//cdn.rawgit.com/mahnunchik/markerclustererplus/master/dist/markerclusterer.min.js"></script>
<div class="row">
<aside class="col-md-6">
<%= will_paginate @trip_points %>
<ul class="trip_points">
<% if @trip.trip_points.any? %>
<%= render @trip_points %>
<% else %>
<%= render 'trip_points/add_point', last: true, index: 0 %>
<% end %>
</ul>
<%= will_paginate @trip_points %>
</aside>
<div class="col-md-6">
<div id="map" style='width: 100%; height: 800px; margin-top: 2em;'></div>
</div>
</div>
<script type="text/javascript">
handler = Gmaps.build('Google');
handler.buildMap({ provider: {},
internal: {id: 'map'}},
function(){
markers = handler.addMarkers( <%= raw @markers.to_json %> );
handler.bounds.extendWith(markers);
});
</script>
handler=Gmaps.build('Google');
handler.buildMap({provider:{},
内部:{id:'map'}},
函数(){
markers=handler.addMarkers();
handler.bounds.extendWith(markers);
});
我有一个部分行程点.html.erb
据我所知,我只在我的页面上包含一次谷歌地图API。js是否应该放在应用程序的其他地方?为了解决这个问题,我将前两个
标记从视图移到了视图/layouts/application.html.erb的
部分