0

I'm trying to initialize my script with turbolinks, following this post : rails 4 with turbolinks and window load . with turbolinks enabled, my map is not displaying well, my markers are invisible if I don't refresh my page. considering these facts, I try to initialize my script via turbolinks, with "page:load", but I don't really know how to do it, considering my ruby tags and the synthax of my script.. do you know how I should do? here is my code :

<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>

Thanks!

Community
  • 1
  • 1
Yanis Ismail
  • 73
  • 10

1 Answers1

0

I did this, but my problem is not resolved.. my map is not initialized well until I refresh my page. here is what I see : enter image description here

<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>
Yanis Ismail
  • 73
  • 10