Ok, what i've found, and what is mentioned above is that trafficLayer.setMap(null)
and trafficLayer.setMap(map)
- just switches tiles with drawn traffic to tiles without traffic. Also map.setZoom(map.getZoom())
(and any other variaties of zoom) doesn't work because tiles are already in cache and google scripts don't even try to download fresh ones from server.
Also, seems that if you just open google maps and turn on traffic layer it's not refreshing! Such a lame, google!
So we have to find a different way to solve it.
First thought is to use window.location.reload(true)
wich will flush image cache - and we see it works. Not a good way to go though - reloading whole page taking too long. How about reloading images? Let's try!
function reloadTiles() {
var tiles = $("#map-canvas").find("img");
for (var i = 0; i < tiles.length; i++) {
var src = $(tiles[i]).attr("src");
if (/googleapis.com/vt?pb=/.test(src)) {
var new_src = src.split("&ts")[0] + '&ts=' + (new Date()).getTime();
$(tiles[i]).attr("src", new_src);
}
}
}
And we call this function every N seconds: setInterval(reloadTiles, 5000)
some comments:
$("#map-canvas").find("img")
- will grab all images from your map container (map-canvas
in my case). Not all are tiles so we need to filter them out - i've noticed that tiles are loaded from domains like mts(digit).googleapis.com/vt?pb=(hella long param)
. Other map images are loaded from maps.gstatic.com
.
So we get tile images, add bogus parameter and change their src. Profit!
Btw, i've found that traffic really changes in real time - tiles may be different each second.
Edit
Oh, sorry, here's working sample. And it's a snowy Moscow with a huge traffic :)
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…