google map reload marker zoom yakınlaştırır

Question

Ben gmaps4rails gem takip ettik ve ben setinterval fonksiyonu ile işaretleyici yeniden yüklemek başardı. Karşılaştığım problem, her aralıktan sonra harita orijinaline geri döner, yani yakınlaştırılmış olursam normale döner.

Bu

kod

success: (data, jqxhr, status) -> 
    console.log('data.bookings', data) 
    $('#multi_markers').removeClass('hidden') 
    $('.empty_booking_text').removeClass('hidden') 
    $('#sidebar_container').html('Please click any booking marker on the map') 
    markers_from_api = data.bookings 
    handler = Gmaps.build('Google') 
    settings = { 
    internal: { 
     id: 'multi_markers' 
    }, 
    provider:{ 
     styles: mapStyles 
    } 
    } 
    handler.buildMap settings, -> 
    markers = handler.addMarkers(markers_from_api) 
    _.each markers,(marker, j) -> 
     google.maps.event.addListener marker.serviceObject, 'click', (object) -> 
     console.log marker.serviceObject.position.lng() 
     render_marker_data markers_from_api[j].id 
     return 
    handler.bounds.extendWith markers 
    handler.fitMapToBounds() 
    setInterval() -> 
    $ -> update_marker_data(handler) 
    , 10000 

i işaretçisi

update_marker_data = (handler) -> 
    markers = [] 
    $.ajax '/technician_locations/current_location', 
    type: 'GET' 
    success: (data, jqxhr, status) -> 
     # handler.removeMarkers() 
     console.log(data) 
     tech_markers_from_api = data.technician_locations 
     tech_markers = handler.addMarkers(tech_markers_from_api) 
     _.each tech_markers,(marker, j) -> 
     markers.push(marker) 
     # google.maps.event.addListener marker.serviceObject, 'click', (object) -> 
     # render_marker_data tech_markers_from_api[j].id 
     # return 
     # handler.bounds.extendWith tech_markers 
     setInterval() -> 
     $ -> remove_marker(markers) 
     , 9000 
     handler.fitMapToBounds() 

Answer 1

Sen kod örneği için bu thread ile ilgili olabilir güncellemek her 10 saniyedir. İşaretleyicileri yalnızca AJAX kullanarak x aralığıyla değiştirmeniz gerekir.

<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){      
         for (var i = 0; i < 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>