2017-04-10 8 views
5

रीफ्रेश करता है मैं gmaps4rails मणि का पालन कर रहा हूं और मैं मार्कर को सेटिनटरवल फ़ंक्शन के साथ पुनः लोड करने में सक्षम था। जिस समस्या का मैं सामना कर रहा हूं वह प्रत्येक अंतराल के बाद है, नक्शा मूल पर वापस चला जाता है, यानी अगर मैं इसमें ज़ूम करता हूं तो सामान्य हो जाता है।google map reload marker ज़ूम

इस कोड

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 

हर 10 सेकंड मैं अद्यतन मार्कर

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() 
+0

'fitMapToBounds' वास्तव में क्या करता है? जहां तक ​​मैं समझता हूं, यह मानचित्र को ज़ूम और/या केंद्र करेगा ताकि _port_ मार्कर व्यूपोर्ट के अंदर दिखाई दे, जो समस्या प्रतीत होता है। –

उत्तर

0

आप कोड नमूने के लिए इस thread साथ उल्लेख कर सकते है। आपको AJAX का उपयोग करके एक्स इंटरवल के साथ मार्करों को प्रतिस्थापित करने की आवश्यकता है।

<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> 
संबंधित मुद्दे