Question

// // // // // // // // Ajax returns from PHP
xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var obj = $.parseJSON(xmlhttp.responseText);

        var tLat = getCookie("tLat");
        var tLng = getCookie("tLng");

        var options = {
          zoom: 4,
          center: new google.maps.LatLng(40.7257, -74.0047),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        // Creating the map  
        var map = new google.maps.Map(document.getElementById('map'), options);

        // Adding a marker to the map
        var marker1 = new google.maps.Marker({
          position: new google.maps.LatLng(tLat, tLng),
          map: map,
          title: 'Click me',
          icon: 'http://gmaps-samples.googlecode.com/svn/trunk/markers/blue/blank.png'
        });

        var i = 0;
        for(i=0;i<=10;i++) {
            // Adding a marker to the map
            var marker[] = new google.maps.Marker({
            position: new google.maps.LatLng(obj[i].lat, obj[i].lng),
            map: map,
            title: 'Click me',
            icon: 'http://gmaps-samples.googlecode.com/svn/trunk/markers/blue/blank.png'
            });
        }

        $('#map').show();
    }
}
// // // // // // // //

So I have a JSON array and I am trying to load the first ten markers. My JavaScript inside the for loop is a little malformed and I am trying to develop a solution that will add the markers properly from the JSON array. The first marker above the for loop does load properly. Has anyone done this before?

P.S. I also tried this which does not work either. My alert shows floating point values with seven digits after the decimal place.

    // // // // // // // // Ajax returns from PHP
xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var obj = $.parseJSON(xmlhttp.responseText);

        var tLat = getCookie("tLat");
        var tLng = getCookie("tLng");

        var options = {
          zoom: 4,
          center: new google.maps.LatLng(40.7257, -74.0047),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        // Creating the map  
        var map = new google.maps.Map(document.getElementById('map'), options);

        alert(obj[0][1]+','+obj[0][2]);

        //var myLatLng = new google.maps.LatLng(40.7257, -74.0047);
        var myLatLng = new google.maps.LatLng(String(obj[0][1]), String(obj[0][2]));

        var marker = new google.maps.Marker({ position: myLatLng, map: map });

        $('#map').show();
    }
}
// // // // // // // //

P.P.P.S. My alert box for obj is coming with -84.3132324,34.0393598 which looks like the format needed.

Answer 1

    // // // // // // // // Ajax returns from PHP
xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
        var obj = $.parseJSON(xmlhttp.responseText);

        var tLat = getCookie("tLat");
        var tLng = getCookie("tLng");

        var options = {
          zoom: 4,
          center: new google.maps.LatLng(tLat, tLng),
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        // Creating the map
        var map = new google.maps.Map(document.getElementById('map'), options);



        var myLatLng = new google.maps.LatLng(parseFloat(obj[0][2]), parseFloat(obj[0][1]));

        //var marker = new google.maps.Marker({ position: myLatLng, map: map });

        var marker;

        for(var i=0;i<obj.length;i++) {

            var myLatLng = new google.maps.LatLng(parseFloat(obj[i].lat), parseFloat(obj[i].lng));

            var marker = new google.maps.Marker({ position: myLatLng, map: map });
        }

        $('#map').show();
    }
}
// // // // // // // //

As it turns out this is one of the ways to make things work with APIv3