Google地图:添加多个地图标记

时间:2014-08-25 23:06:45

标签: javascript html google-maps google-maps-api-3

我的设置目前我的地图上有多个点的自定义地图标记,但我想根据其type属性为地图上的不同标记添加不同的地图标记。我目前的设置如下:

HTML

<div class="marker" data-lat="LATITUDE_GOES_HERE" data-lng="LONGITUTE_GOES_HERE" type="library">

jQuery(只是标记函数)

function add_marker( $marker, map ) {

    // var
    var latlng = new google.maps.LatLng( $marker.attr('data-lat'), $marker.attr('data-lng') );

    var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';

    // create marker
    var marker = new google.maps.Marker({
        position    : latlng,
        map         : map,
        icon: iconBase + 'schools_maps.png'
    });

    // add to array
    map.markers.push( marker );

    // if marker contains HTML, add it to an infoWindow
    if( $marker.html() )
    {
        // create info window
        var infowindow = new google.maps.InfoWindow({
            content     : $marker.html()
        });

        // show info window when marker is clicked
        google.maps.event.addListener(marker, 'click', function() {

            infowindow.open( map, marker );

        });
    }

}

这很好用,但我如何在地图上为不同的标记设置不同的标记图标,具体取决于它们具有的type属性(如果可能)?
任何建议将不胜感激!

1 个答案:

答案 0 :(得分:2)

你的意思是......

var iconName = "";
var type = $marker.attr("type");
if (type == "library")
    iconName = "library.png";
else if (type == "school")
    iconName = "school.png";
// ...etc...

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

当然,您必须自己提供(并且可能是主持人)图标......