在 google maps api v3 中定义多个标记的大小和锚点答案

【问题标题】：define size and anchor for multiple markers in google maps api v3在 google maps api v3 中定义多个标记的大小和锚点
【发布时间】：2013-03-01 06:13:15
【问题描述】：

有几个类似的问题和答案，但我确实无法弄清楚！因此，我使用了两个不同的图标（customIcons），但由于默认设置“锚点位于图像底部的中心点”，它们在地图上的放置略有不正确。（见https://developers.google.com/maps/documentation/javascript/reference#MarkerOptions）。我知道我必须更改该默认功能，但不知道如何更改。我通过

定义自定义图标

var markers = [];
var infoWindow;
var customIcons = {
recent: {icon: 'http://www.herpetofauna-nrw.de/Fundmeldungen/blauer_Punkt.png'},
historisch: {icon: 'http://www.herpetofauna-nrw.de/Fundmeldungen/roter_Punkt.png'}
};

后来我用：

downloadUrl("auswertung.xml?ienocache="+new Date().getMilliseconds(), function(data){ 
       var xml = data.responseXML; 
      var markers = xml.documentElement.getElementsByTagName("marker");
      var bounds = new google.maps.LatLngBounds();
      for (var i = 0; i < markers.length; i++) {
        var Art = markers[i].getAttribute("Art");
        var type = markers[i].getAttribute("Stichjahr");
        var Jahr = markers[i].getAttribute("Jahr");
        var MTBNr = markers[i].getAttribute("MTBNr");
        var latlng = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("lat")),
            parseFloat(markers[i].getAttribute("lng")));

       var html = 
         "<b>" + "Art: "  + "</b>" + Art +  " <br/>" +
       "<b>" + "MTB: " +  "</b>" + MTBNr + "<br/>" +
       "<b>" + "Funddatum: " +  "</b>" + Jahr + "<br/>"; 
       var icon = customIcons[type] || {};

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

但是当我使用 "var icon = customIcons[type] || {};" 我不知道在哪里放置必要的选项 "new google.maps.Point( 0,0)" 喜欢：

var image = new google.maps.MarkerImage('XXX.png', // The image size
    new google.maps.Size(44, 46), // The origin
    new google.maps.Point(0,0),   // The anchor
    new google.maps.Point(22, 23));

有人可以帮忙吗？非常感谢！

【问题讨论】：

标签： google-maps-api-3 google-maps-markers

【解决方案1】：

不推荐使用 MarkerImage，取而代之的是 Icon 匿名对象。像这样的东西应该可以工作（未经测试）：

var customIcons = {
recent: {icon: {url:'http://www.herpetofauna-nrw.de/Fundmeldungen/blauer_Punkt.png',
                anchor: new google.maps.Point(X1,Y1),
                size: new google.maps.Size(S1,S2)}},
historisch: {icon: {url:'http://www.herpetofauna-nrw.de/Fundmeldungen/roter_Punkt.png',
                    anchor: new google.maps.Point(X2, Y2),
                    size: new google.maps.Size(S2,S2)}}
};

【讨论】：