Question

有几个类似的问题和答案，但我确实无法弄明白！因此，我使用了两个不同的图标（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));

请有人帮忙吗？非常感谢提前！

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

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

1 个答案: