javascript - gmaps4rails - update dynamically the markers from the database on the map without refresh the page -


hello building live bus tracking rails app. displayed markers database on google map in rails 4 gmaps4rails gem.

controller:

@hash = gmaps4rails.build_markers(@vehicle_trackings) |track, marker|       marker.lat track.latitude       marker.lng track.longitude       marker.picture({         url: "/images/bus filled-30.png",         width:  50,         height: 50      })     end  

view:

<div id='map' style='width: 100%; height: 500px;'></div>     <script>         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> 

now how update dynamically every 15 seconds markers's position on map without refresh page database?

<script>     handler = gmaps.build('google');         handler.buildmap({ provider: {}, internal: {id: 'map'}}, function(){            markers = handler.addmarkers(<%=raw @hash.to_json %>);            handler.bounds.extendwith(markers);            $( document ).ready(function() {                      setinterval(function(){                 $(function () {                     $.ajax({                       type:"get",                       url:"/path_to_controller_action",                       datatype:"json",                       data: {some_id:1},                       success:function(result){                                              (var = 0; < markers.length; i++) {                           markers[i].setmap(null);                           handler.removemarkers(markers);                         }                         markers = [];                         markers = handler.addmarkers(result);                         handler.bounds.extendwith(markers);                                                }                     })                 });                }, 10000);             handler.fitmaptobounds();             handler.getmap().setzoom(17);                  });                      }); </script> 

replace markers x intervel using ajax thats worked me.


Comments

Popular posts from this blog

sequelize.js - Sequelize group by with association includes id -

android - Robolectric "INTERNET permission is required" -

java - Android raising EPERM (Operation not permitted) when attempting to send UDP packet after network connection -