通过 Turbolinks 初始化脚本，使用 Gmap4rails 显示地图答案

【问题标题】：Initializing script via Turbolinks, display map with Gmap4rails通过 Turbolinks 初始化脚本，使用 Gmap4rails 显示地图
【发布时间】：2016-10-21 15:04:48
【问题描述】：

我正在尝试使用 turbolinks 初始化我的脚本，遵循这篇文章： rails 4 with turbolinks and window load 。启用 turbolinks，我的地图显示不好，如果我不刷新我的页面，我的标记是不可见的。考虑到这些事实，我尝试通过 turbolinks 初始化我的脚本，使用“page:load”，但考虑到我的 ruby 标签和脚本的合成器，我真的不知道该怎么做。你知道我应该怎么做吗？做？这是我的代码：

<script src="//maps.google.com/maps/api/js?key=[mykey]"></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> <!-- only if you need custom infoboxes -->
<h1> Points de vente </h1>
<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>

谢谢！

【问题讨论】：

标签： javascript jquery ruby-on-rails ruby-on-rails-4 turbolinks

【解决方案1】：

我这样做了，但我的问题没有解决.. 我的地图没有初始化好，直到我刷新我的页面。这是我看到的：

<script src="//maps.google.com/maps/api/js?key=AIzaSyChlLKUJvuUVdSkBvg7Mf1UhdjRoMyRPjs"></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> <!-- only if you need custom infoboxes -->
<h1> Points de vente </h1>
<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'}},
ready = function(){
markers = handler.addMarkers(<%=raw @hash.to_json %>);
handler.bounds.extendWith(markers);
handler.fitMapToBounds();
google.maps.event.addDomListener(window, 'load', initialize);
});
$(document).ready(ready);
$(document).on('page:load', ready);
</script>

【讨论】：