Google maps 如何处理位于同一坐标处的多个标记_Google Maps

Google maps 如何处理位于同一坐标处的多个标记

google-maps

Google maps 如何处理位于同一坐标处的多个标记,google-maps,Google Maps,我在同一位置有多个标记（经度和纬度）这是我的小提琴：这是我的代码： var map; var global_markers = []; var markers = [[37.09024, -95.712891, 'trialhead0'], [37.09024, -95.712891, 'trialhead1'], [37.09024, -95.712892, 'trialhead2']]; var infowindow = new google.maps.InfoWindow(

我在同一位置有多个标记（经度和纬度）

这是我的小提琴：

这是我的代码：

var map;
var global_markers = [];    
var markers = [[37.09024, -95.712891, 'trialhead0'], [37.09024, -95.712891, 'trialhead1'], [37.09024, -95.712892, 'trialhead2']];

var infowindow = new google.maps.InfoWindow({});

function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(40.77627, -73.910965);
    var myOptions = {
        zoom: 1,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    addMarker();
}

function addMarker() {
    for (var i = 0; i < markers.length; i++) {
        // obtain the attribues of each marker
        var lat = parseFloat(markers[i][0]);
        var lng = parseFloat(markers[i][1]);
        var trailhead_name = markers[i][2];

        var myLatlng = new google.maps.LatLng(lat, lng);

        var contentString = "<html><body><div><p><h2>" + trailhead_name + "</h2></p></div></body></html>";

        var marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            title: "Coordinates: " + lat + " , " + lng + " | Trailhead name: " + trailhead_name
        });

        marker['infowindow'] = contentString;

        global_markers[i] = marker;

        google.maps.event.addListener(global_markers[i], 'click', function() {
            infowindow.setContent(this['infowindow']);
            infowindow.open(map, this);
        });
    }
}

window.onload = initialize;

var映射；
var全局_标记=[]；
变量标记=[[37.09024，-95.712891，'trialhead0']，[37.09024，-95.712891，'trialhead1']，[37.09024，-95.712892，'trialhead2']；
var infowindow=new google.maps.infowindow（{}）；
函数初始化（）{
geocoder=新的google.maps.geocoder（）；
var latlng=新的google.maps.latlng（40.77627，-73.910965）；
变量myOptions={
缩放：1，
中心：拉特林，
mapTypeId:google.maps.mapTypeId.ROADMAP
}
map=new google.maps.map（document.getElementById（“map_canvas”），myOptions）；
addMarker（）；
}
函数addMarker（）{
对于（var i=0；i”；
var marker=new google.maps.marker({
职位：myLatlng，
地图：地图，
标题：“坐标：“+lat+”，“+lng+”|牵引头名称：“+Trailhead|U名称”
});
标记['infowindow']=contentString；
全局_标记[i]=标记；
google.maps.event.addListener（全局_标记[i]，'click'，函数（）{
setContent（这个['infowindow']）；
打开（地图，这个）；
});
}
}
window.onload=初始化；

现在，这只显示了一个标记，您能告诉我如何处理吗

表示如何处理它以显示，以便它显示所有3个标记？

在这种情况下，您需要稍微移动每个标记，以便它们不会相互重叠，并且for表示有更多标记分组，您可以使用标记簇您可以在StackOverflow中看到许多示例

您可以在一个有用的jsfiddl中看到