google-maps - 更改谷歌地图上的图标

Question

我一直在尝试几种选择，但不幸的是我无法为不同的位置设置不同的图标。我还试图找出为什么天气层可选字段与其他应用程序一样为空白，但它确实有效。

我将不胜感激任何帮助。

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&language=en&libraries=weather"></script>

<style type="text/css">
#apDiv1 {
    position: absolute;
    right: 240px;
    top: 5px;
    width: 160px;
    height: 39px;
    z-index: 1;
    background-color: #ccc;
    overflow: visible;
    opacity: 0.8;
    z-index:1;
}
</style>
<script type="text/javascript">
var map;
var WeatherLayer;
var CloudsLayer;
var zoomLimit = 6;
var dealer_markers = [{
    sales: '1',
    aftersales: '0',
    name: 'Strike in Frankfurt',
    lat: '51.595212',
    lng: '-2.400068',
    adr: '',
    pc: 'In Some Place',
    tel: '21312312312',
    url: '.',
    avr: '',
     position: '1'
},
{
    sales: '0',
    aftersales: '1',
    name: 'Bob Two',
    lat: '52.306323',
    lng: '14.000778',
    adr: 'Some Address',
    pc: 'Some Place',
    tel: '213213123123',
    url: '.',
    avr: '',
    position: '2'
},
{
    sales: '1',
    aftersales: '1',
    name: 'Bob Three',
    lat: '22.742384',
    lng: '-0.488795',
    adr: 'Another address',
    pc: 'More place',
    tel: '23423423423',
    url: '',
    avr: '',
    position: '3'
},
{
    sales: '0',
    aftersales: '1',
    name: 'Bob Two',
    lat: '11.306323',
    lng: '14.000778',
    adr: 'Some Address',
    pc: 'Some Place',
    tel: '213213123123',
    url: '.',
    avr: '',
    position: '4'
},



];



function _newGoogleMapsMarker(param) {
    var r = new google.maps.Marker({

        map: param._map,
        icon:'icon2.gif',
        position: new google.maps.LatLng(param._lat, param._lng),
        title: param._head
    });
    if (param._data) {
        google.maps.event.addListener(r, 'click', function() {
            // this -> the marker on which the onclick event is being attached
            if (!this.getMap()._infoWindow) {
                this.getMap()._infoWindow = new google.maps.InfoWindow();
            }
            this.getMap()._infoWindow.close();
            this.getMap()._infoWindow.setContent(param._data);
            this.getMap()._infoWindow.open(this.getMap(), this);
        });



    }
    return r;
}

function init() {
    var mO = {
        center: new google.maps.LatLng(52.041213, -1.325532),
        zoom: 3,

        panControl:false,
        zoomControl:false,
        mapTypeControl:false,
        scaleControl:false,
        streetViewControl:false,
        overviewMapControl:false,
        rotateControl:false,  
        zoomControl:true,


        navigationControlOptions: {
            style: google.maps.NavigationControlStyle.SMALL
        },
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map"), mO);
    for (var a = 0; a < dealer_markers.length; a++) {
        var tmpLat = dealer_markers[a].lat;
        var tmpLng = dealer_markers[a].lng;
        var tmpName = dealer_markers[a].name;
        var tmpAdr = dealer_markers[a].adr;
        var tmpTel = dealer_markers[a].pc;
        var tmpPc = dealer_markers[a].tel;
        var marker = _newGoogleMapsMarker({
            _map: map,
            _lat: tmpLat,
            _lng: tmpLng,
            _head: '|' + new google.maps.LatLng(tmpLat, tmpLng),
            _data: '<div id="bg">\
        <h2 class="title">' + tmpName + '</h2>\
        <h3 class="address">' + tmpAdr + '</h3>\
        <h3 class="pc">' + tmpPc + '</h3>\
        <h3 class="telephone">' + tmpTel + '</h3>\
        </div>'
        });
    }




            weatherLayer = new google.maps.weather.WeatherLayer({
                temperatureUnits: google.maps.weather.TemperatureUnit.CELSIUS
            });
            weatherLayer.setMap(map);
            cloudsLayer = new google.maps.weather.CloudLayer();
            //cloudsLayer.setMap(map);

            $('#weather_box').click(function(){
                weatherLayer.setMap($(this).is(':checked') ? map : null);
            });

            $('#clouds_box').click(function(){
                cloudsLayer.setMap($(this).is(':checked') ? map : null);
            });

            $('#weather_box,#clouds_box').removeAttr('disabled');



}


window.onload = init;
</script>
<body>
<div id="apDiv1">
  <input type="checkbox" id="clouds_box" disabled="true">
  clouds 
  <input type="checkbox" id="weather_box" disabled="true" checked>
  weather
</div>
<div id="map" style="width:1300px; height:800px;border:1px solid; margin-top:20px;opacity:0.9;background-color: black;"></div>

</body>