2016-03-16 3 views
2

У меня есть Карты Google вкладывается в мою страницу:Обновление Google Maps уровень трафика без перезагрузки страницы

<script async defer src="https://maps.googleapis.com/maps/api/js?key=&callback=initMap"></script> 

Я использую initMap расслоение плотной функции для инициализации карты:

function initMap() { 
var map = new google.maps.Map(document.getElementById('t-map'), { 
    zoom: 13, 
    center: { 
     lat: 39.103119, 
     lng: -84.512016, 
    }, 
    disableDefaultUI: true, 
    }); 

    var trafficLayer = new google.maps.TrafficLayer(); 
    trafficLayer.setMap(map); 
} 

Я хочу трафик для автоматического обновления после x времени без перезагрузки страницы. Как мне это сделать?

ответ

0

Как кажется, в настоящее время TrafficLayer будет нарисован через карты-плитки, поэтому вам нужно будет заставить API перезагрузить карточные плитки.

Возможный способ достижения этой цели: установить случайную карту стиль (который не влияет на appeareance плиток)

function initMap() { 
 
    var map = new google.maps.Map(document.getElementById('t-map'), { 
 
    zoom: 13, 
 
    center: { 
 
     lat: 38.9071923, 
 
     lng: -77.0368707, 
 
    }, 
 
    disableDefaultUI: true, 
 
    }); 
 

 
    var trafficLayer = new google.maps.TrafficLayer(); 
 
    trafficLayer.setMap(map); 
 
    setInterval(function() { 
 
     map.setOptions({ 
 
     styles: [{ 
 
      "featureType": "road", 
 
      "elementType": "geometry.fill", 
 
      "stylers": [{ 
 
      "saturation": Math.random() 
 
      }] 
 
     }] 
 
     }) 
 
    }, 
 
    15000 //reload tiles every 15 sec 
 
); 
 
} 
 

 
google.maps.event.addDomListener(window, 'load', initMap);
 html, 
 
     body, 
 
     #t-map { 
 
     height: 100%; 
 
     margin: 0; 
 
     padding: 0 
 
     }
<div id="t-map"></div> 
 
<script src="https://maps.googleapis.com/maps/api/js?v=3"></script>

Вопрос: в зависимости от браузера/map-size/connection мерцание может развиться, когда плитки будут перезагружены.

+0

Работал отлично, спасибо: D: D! –

Смежные вопросы