Gmap3 JSON

HTML

<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://gmap3.net/js/gmap3-4.1-min.js"></script>

<div id="mapCanvas"></div>

<br />
<a href="#" id="startAnimate">Start animation</a>
<br />
<a href="#" id="pauseAnimate">Pause animation</a>

CSS

#mapCanvas{
        width:500px;
        height:300px;
    }

JavaScript

var map;
var positions = [];
var markers = [];
var maxMarkers = 10;
var animatedMarkers = 0;
var animateTimer;

(function(){

    // Click events
    $('#startAnimate').click(function(){
        playAnimate();
    });

    $('#pauseAnimate').click(function(){
        pauseAnimate();
    });

    $("#mapCanvas").gmap3({
    map: {
        options: {
            mapTypeId: google.maps.MapTypeId.TERRAIN,
            mapTypeControl: true,
            mapTypeControlOptions: {
                style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
            },
            navigationControl: true,
            scrollwheel: true,
            streetViewControl: true
        }

    },
    autofit: {}
    });

    // getting map
    map = $('#mapCanvas').gmap3('get');

    // init marker positions
    initPositions();

    /**
     * Positions for markers
     */
    function initPositions() {

        // creating some positions
        for(var i=0; i < maxMarkers; i++) {

            positions.push({
                'lat' : 37.4419 * Math.random(),
                'lng' : -122.1419 * Math.random()
            });

        }

    }

    /**
     * Animating...
     */
    function playAnimate() {
			alert('playAnimate');
        if(animatedMarkers < maxMarkers) {

            // Adding new marker
            addMarker(animatedMarkers);

            // Adding new one?
            animateTimer = setTimeout(playAnimate, 500);    

        } else {

            alert('all animated already!');
            window.clearTimeout(animateTimer);
            return;

        }

    }

    /**
     * Pausing...
     */
    function pauseAnimate() {

        window.clearTimeout(animateTimer);

    }

    /**
     * Add single marker
     */
    function addMarker(markerNumber) {

        // Keeping a stack of markers
        markers.push(
            new google.maps.Marker({
                position: new google.maps.LatLng(positions[markerNumber].lat, positions[markerNumber].lng),
        ...