javascript - How can I animate my Google Map to pan to the right endlessly and seamlessly? -

i have implemented map using snazzy maps , google maps api. can found on website here: http://www.welcomehomemusic.net.

i noticed while inspecting map element , clicking , dragging right on map updating css property on div.

the property transform: matrix(1, 0, 0, 1, -690, 0); animate 5th value smoothly having increase endlessly.

my first thought use css animations , keyframes or maybe using javascript somehow.

any appreciated, thanks.

from api docs:

panby(x:number, y:number)

changes center of map given distance in pixels. if distance less both width , height of map, transition smoothly animated. note map coordinate system increases west east (for x values) , north south (for y values).

https://developers.google.com/maps/documentation/javascript/reference?csw=1#methods

then it's easy as:

var map = new google.maps.map(mapelement, mapoptions); function infinipan() {     map.panby(-0.2, 0);     settimeout(infinipan, 100); } infinipan(); 

i should point out it's going eat cpu.