添加自定义谷歌地图标记/针(颜色)

Question

我做了一些相当不错的谷歌地图自定义; 但我想知道在下面的地方/或者我可以添加的内容只需更改地图标记/图钉/或图标.我真的想改变颜色; 但如果必须,我会创建一个图像并按照这种方式进行.

以下是我的工作内容; 干杯/

window.onload = function() {  

function initialize() {
    var stylez = [
      {
        featureType: "all",
        stylers: [
          { hue: "#c3c367" },
          { saturation: -75 }
        ]
      },
      {
        featureType: "poi",
        elementType: "label",
        stylers: [
          { visibility: "off" }
        ]
      }
    ];

    var latlng = new google.maps.LatLng(34.101958, -118.327925), // toggle per data

        mapOptions = {
            mapTypeControlOptions: {
                mapTypeIds: [google.maps.MapTypeId.ROADMAP, "Edited"] 
            },
            zoom: 14,
            center: latlng
        },

        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions),

        styledMapType = new google.maps.StyledMapType(stylez, {name: "Edited"}),

        marker = new google.maps.Marker({
            position: latlng, 
            map: map, 
            animation: google.maps.Animation.DROP,
            title:"Hello World!"
        }),

        infowindow = new google.maps.InfoWindow({
            content: "<div><img width='50' height='50' src='assets/icos/homico.png'</div>"
        });

        map.mapTypes.set("Edited", styledMapType);
        map.setMapTypeId('Edited');

    function toggleBounce () {
        if (marker.getAnimation() != null) {
            marker.setAnimation(null);
        } else {
            marker.setAnimation(google.maps.Animation.BOUNCE);
        }
    }

    // Add click listener to toggle bounce
    google.maps.event.addListener(marker, 'click', function () {
        toggleBounce();
        infowindow.open(map, marker);
        setTimeout(toggleBounce, 1500);
    });
}

// Call initialize -- in prod, add this to window.onload or some other DOM ready alternative
initialize();

};

Answer 1

你只需要添加

"icon": "url"

到您的标记声明.所以这:

marker = new google.maps.Marker({
        position: latlng, 
        map: map, 
        animation: google.maps.Animation.DROP,
        title:"Hello World!"
    })

变为:

marker = new google.maps.Marker({
        position: latlng, 
        map: map,
        icon: yourIconUrl,
        animation: google.maps.Animation.DROP,
        title:"Hello World!"
    })