javascript - Plotting LatLng coordinates from Json Array on Google Map --- the markers all stack up in the same location - Stack

admin管理员组

文章数量:1328660

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 use loop over the array to parse the coordinates and plot them on a google map. Here's my Javascript:

function getLocations() {

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

        var location;


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

    });
};

function addMarker(location) {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(location),
        map: map,
        icon: redImage
    });
    markersArray.push(marker);
}

My problem is the markers end up stacked on top of each other plotted in the upper left corner of the map (right in the middle of the ocean). The location where the markers stack appears nowhere in my Json array. What did I do wrong?

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 use loop over the array to parse the coordinates and plot them on a google map. Here's my Javascript:

function getLocations() {

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

        var location;


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

    });
};

function addMarker(location) {
    marker = new google.maps.Marker({
        position: new google.maps.LatLng(location),
        map: map,
        icon: redImage
    });
    markersArray.push(marker);
}

My problem is the markers end up stacked on top of each other plotted in the upper left corner of the map (right in the middle of the ocean). The location where the markers stack appears nowhere in my Json array. What did I do wrong?

• javascript
• jquery
• google-maps

Share Follow asked Sep 9, 2011 at 20:04 hughesdanhughesdan 2,8511414 gold badges6161 silver badges8383 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 5

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:

function getLocations() {

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

        var location;


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

    });
}

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

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

本文标签：