gmaps4rails 未在指定的 div id 中呈现

Question

我在 Active Admin 中使用 Gmaps4Rails（Google 地图 Rails）。到目前为止一切都很好，除了我不得不在同一个显示页面上添加多张地图。

gem 'gmaps4rails', '~> 2.1', '>= 2.1.2'

我将脚本导入提取到 html，我在显示视图中只调用了一次，所以我没有收到错误：

/views/admin/_map_include_scripts.html.erb

<script src="//maps.google.com/maps/api/js?key=<%= ENV['GOOGLE_KEY'] %>"></script>
<script src="//cdn.rawgit.com/mahnunchik/markerclustererplus/master/dist/markerclusterer.min.js"></script>
<script src='//cdn.rawgit.com/printercu/google-maps-utility-library-v3-read-only/master/infobox/src/infobox_packed.js' type='text/javascript'></script>

然后在节目中我做：

div id: 'map' do
  render '/admin/map_include_scripts'
  markers = DeliveryMarkersService.new(delivery).orders_markers
  render '/admin/map_scripts', markers: markers, map_div_id: 'map'
end

在 views/admin/_map_scripts.html.erb 我有：

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

到目前为止效果很好！我看到了地图、标记，一切。

现在我想添加第二个 div 和第二个地图 所以首先我尝试将第一个 div 更改为以下内容以验证我可以告诉 Gmaps 什么div 显示它:

div id: 'map2' do
  render '/admin/map_include_scripts'
  markers = DeliveryMarkersService.new(delivery).orders_markers
  render '/admin/map_scripts', markers: markers, map_div_id: 'map2'
end

但是地图没有渲染！控制台上没有错误。如果我确实发送了一个无效的 ID（div ID 不存在），我会收到一个错误。

有谁知道发生了什么事吗？

Answer 1

您的问题可能与在同一页面中执行两次 render '/admin/map_include_scripts' 有关，这会触发地图和覆盖图的另一次加载 APIs。当您在第一个加载后执行此操作时，您的 render '/admin/map_scripts', markers: markers, map_div_id: 'map2' 可能会在库完全加载之前执行地图渲染 JS。尝试将 render '/admin/map_include_scripts' 移动到每个 div 地图循环之外的公共片段。这样，仅在您不需要等待 API.

的第二次加载时才加载库

render '/admin/map_include_scripts'
div id: 'map' do
  markers1 = DeliveryMarkersService.new(delivery1).orders_markers
  render '/admin/map_scripts', markers: markers1, map_div_id: 'map'
end

div id: 'map2' do
  markers2 = DeliveryMarkersService.new(delivery2).orders_markers
  render '/admin/map_scripts', markers: markers2, map_div_id: 'map2'
end

Answer 2

能否具体说明 'the map does not render' 是什么意思？它在页面或 DOM 上不可见？您是否在开发人员工具中检查了来源 code/DOM？如果您没有收到错误，它可能会呈现但显示不正确，例如它已将 width/height 设置为 0?

gmaps4rails 未在指定的 div id 中呈现

gmaps4rails not rendering in specified div id

ruby-on-rails

gmaps4rails