在谷歌地图上绘制来自Json数组的LatLng坐标-所有标记都堆叠在同一位置

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

本文关键字:位置 -所 坐标 绘制 谷歌地图 数组 Json LatLng      更新时间:2023-09-26

我有一个包含纬度和经度坐标的Json数组。下面是一个示例:

"zones":[{"Zip":35824,"Latitude":34.647995,"Longitude":-86.738549},...

我试图在数组上使用循环来解析坐标并在谷歌地图上绘制它们。这是我的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);
}

我的问题是标记最终堆叠在一起,绘制在地图的左上角(在海洋的正中央)。标记堆栈的位置在我的Json数组中没有出现。我做错了什么?

我认为问题是新的google.maps.LatLng()期望(number,number)作为参数,你正在传递一个格式为"number,number"的字符串。

如果你改变addMarker()函数有两个参数(例如纬度,经度)应该工作:

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);
}

使用聚类,将一组标记作为聚类。一个集群将在内部呈现许多标记。