Plotting Latlng Coordinates From Json Array On Google Map --- The Markers All Stack Up In The Same Location

I have a Json array that contains latitude and longitude coordinates. Here's a sample: 'zones':[{'Zip':35824,'Latitude':34.647995,'Longitude':-86.738549},... I'm attempting to us

Solution 1:

I think the problem is that new google.maps.LatLng() expects (number,number) as the parameters and you're passing in a string in the format "number,number".

If you change the addMarker() function to have two parameters (e.g. latitude,longitude) that should work:

functiongetLocations() {

    $.getJSON("http://localhost:1117/zones/latlng", function (json) {

        var location;


        $.each(json.zones, function (i, item) {
            addMarker(item.Latitude,item.Longitude);
        });

    });
}

functionaddMarker(lat,lng) {
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(lat,lng),
            map: map,
            icon: redImage
        });
        markersArray.push(marker);
}

Solution 2:

use clustering .make group of markers as cluster.one cluster will present many markers inside.also make bounds.