Javascript 谷歌地图恢复鼠标上的默认标记

我已经看了这里所有的答案，还没有找到确切的我要找的，我是一个JS noob，所以请容忍我

我有一个地图，可以从XML文件中加载和创建标记，并在加载每个标记类别时构建一个侧栏列表。该文件对标记进行了分类，并且每个类别具有不同的标记颜色。当我将鼠标移到相应的侧边栏项上时，我可以让标记改变颜色，但我希望它们在鼠标移出时返回默认颜色。我可以为mouseout设置一个显式的颜色，但是因为每个类别都是不同的颜色，所以它们在mouseout之后都是相同的

我非常依赖Mike Williams教程，我知道一定有办法获取默认颜色并将其用于mouseout，但我是一个JS noob，所以我还没有完全弄明白。谢谢你的帮助

      // this variable will collect the html which will eventually be placed in the side_bar 
      var side_bar_html = ""; 

      //var for kml route layers
      var routes = {
     y: {
        name: "Winter Routes",
        url: "http://www.huts.org/Tests/Maps/GPSTracks/Opus_Hut_Approach_Winter.kml"

    },
    z: {
        name: "Summer Routes",
        url: "http://www.huts.org/Tests/Maps/GPSTracks/Telluride_to_Last_Dollar.kml"

    },

};

      var gmarkers = [];
      var gicons = [];
      var map = null;

var infowindow = new google.maps.InfoWindow(
  { 
    size: new google.maps.Size(150,50)
  });


gicons["ltblue"] = new google.maps.MarkerImage("images/marker_ltblue.png");

  var iconImage = new google.maps.MarkerImage('images/marker_ltblue.png');



function getMarkerImage(iconColor) {
   if ((typeof(iconColor)=="undefined") || (iconColor==null)) { 
      iconColor = "ltblue"; 
   }
   if (!gicons[iconColor]) {
      gicons[iconColor] = new google.maps.MarkerImage("images/marker_"+ iconColor +".png");
   } 
   return gicons[iconColor];

}

function category2color(category) {
   var color = "ltblue";
   switch(category) {
     case "huts": color = "ltblue";
                break;
     case "yurts":    color = "orange";
                break;
      case "active":    color = "red";
                break;
     default:   color = "ltblue";
                break;
   }
   return color;
}

      gicons["huts"] = getMarkerImage(category2color("huts"));
      gicons["yurts"] = getMarkerImage(category2color("yurts"));
      gicons["active"] = getMarkerImage(category2color("active"));

      // A function to create the marker and set up the event window
function createMarker(latlng,name,html,category) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        icon: gicons[category],

        map: map,
        title: name,
        zIndex: Math.round(latlng.lat()*-100000)<<5
        });
        // === Store the category and name info as a marker properties ===
        marker.mycategory = category;                                 
        marker.myname = name;
        gmarkers.push(marker);

    google.maps.event.addListener(marker, 'click', function() {
        var testimonial = document.getElementById('hutMapinfo');
        testimonial.innerHTML = contentString;
        });


}


      // == shows all markers of a particular category, and ensures the checkbox is checked ==
      function show(category) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == category) {
            gmarkers[i].setVisible(true);
          }
        }
        // == check the checkbox ==
        document.getElementById(category+"box").checked = true;
      }

      // == hides all markers of a particular category, and ensures the checkbox is cleared ==
      function hide(category) {
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].mycategory == category) {
            gmarkers[i].setVisible(false);
          }
        }
        // == clear the checkbox ==
        document.getElementById(category+"box").checked = false;
        // == close the info window, in case its open on a marker that we just hid
        infowindow.close();
      }

      // == a checkbox has been clicked ==
      function boxclick(box,category) {
        if (box.checked) {
          show(category);
        } else {
          hide(category);
        }
        // == rebuild the side bar
        makeSidebar();
      }

      function myclick(i) {
        google.maps.event.trigger(gmarkers[i],"click");
      }


      // == rebuilds the sidebar to match the markers currently displayed ==
      function makeSidebar() {
        var html = "";
        for (var i=0; i<gmarkers.length; i++) {
          if (gmarkers[i].getVisible()) {
            html += '<a href="javascript:myclick(' + i + ')" onmouseover="gmarkers['+ i +'].setIcon(gicons.active)" onmouseout="gmarkers['+ i +'].setIcon(gicons.' + gmarkers[i].mycategory  + ')">' + gmarkers[i].myname + '<\/a><br>';
          }
        }
        document.getElementById("side_bar").innerHTML = html;
      }

  function initialize() {
    var myOptions = {
      zoom: 7,
      center: new google.maps.LatLng(39.492948, -105.289823),
      mapTypeId: google.maps.MapTypeId.TERRAIN
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    createRouteTogglers();

    google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });



      // Read the data
      downloadUrl("coloradoYurtsToggleTest.xml", function(doc) {
  var xml = xmlParse(doc);
  var markers = xml.documentElement.getElementsByTagName("marker");

        for (var i = 0; i < markers.length; i++) {
          // obtain the attribues of each marker
          var lat = parseFloat(markers[i].getAttribute("lat"));
          var lng = parseFloat(markers[i].getAttribute("lng"));
          var point = new google.maps.LatLng(lat,lng);
          var name = markers[i].getAttribute("label");
          var html = GXml.value(markers[i].getElementsByTagName("infowindow")[0]);
          var category = markers[i].getAttribute("category");
          // create the marker
          var marker = createMarker(point,name,html,category);
        }

        // == show or hide the categories initially ==
        show("huts");
        hide("yurts");

        // == create the initial sidebar ==
        makeSidebar();
      });
    }


// the important function... routes[id].xxxxx refers back to the top 
function toggleRoute(checked, id) {

    if (checked) {

        var layer = new google.maps.KmlLayer(routes[id].url, {
            preserveViewport: true,
            suppressInfoWindows: false 
        });
        // store kml as obj
        routes[id].obj = layer;
        routes[id].obj.setMap(map);
    }
    else {
        routes[id].obj.setMap(null);
        delete routes[id].obj;
    }
};

// create the Routes controls
function createRouteTogglers() {

    var html = "<form><ul>";
    for (var prop in routes) {
        html += "<li id=\"selector-" + prop + "\"><input type='checkbox' id='" + prop + "'" +
        " onclick='highlight(this,\"selector-" + prop + "\"); toggleRoute(this.checked, this.id)' \/>" +
        routes[prop].name + "<\/li>";
    }
    html += "<\/ul><\/form>";

    document.getElementById("routeLayers").innerHTML = html;
};

// Append Class on Select
function highlight(box, listitem) {
    var selected = 'selected';
    var normal = 'normal';
    document.getElementById(listitem).className = (box.checked ? selected: normal);
};

//此变量将收集最终放置在侧栏中的html
var side_bar_html=“”；
//kml路由层的var
变量路由={
y:{
名称：“冬季路线”，
url:“http://www.huts.org/Tests/Maps/GPSTracks/Opus_Hut_Approach_Winter.kml"
},
z:{
名称：“夏季路线”，
url:“http://www.huts.org/Tests/Maps/GPSTracks/Telluride_to_Last_Dollar.kml"
},
};
var gmarkers=[]；
var gicons=[]；
var-map=null；
var infowindow=new google.maps.infowindow(
{ 
尺寸：新谷歌地图尺寸（150,50）
});
gicons[“ltblue”]=新的google.maps.MarkerImage（“images/markerltblue.png”）；
var iconImage=new google.maps.MarkerImage（'images/markerltblue.png'）；
函数getMarkerImage（iconColor）{
如果（（typeof（iconColor）=“未定义”）| |（iconColor==null））{
iconColor=“ltblue”；
}
如果（！gicons[iconColor]）{
gicons[iconColor]=新的google.maps.MarkerImage（“images/marker”+iconColor+.png”）；
} 
返回gicons[iconColor]；
}
功能类别2颜色（类别）{
var color=“ltblue”；
开关（类别）{
案例“小屋”：color=“ltblue”；
打破
案例“蒙古包”：color=“橙色”；
打破
案例“活动”：color=“红色”；
打破
默认值：color=“ltblue”；
打破
}
返回颜色；
}
gicons[“小屋”]=getMarkerImage（类别2颜色（“小屋”）；
gicons[“蒙古包”]=getMarkerImage（类别2颜色（“蒙古包”）；
gicons[“活动”]=getMarkerImage（category2color（“活动”）；
//创建标记和设置事件窗口的函数
函数createMarker（latlng、名称、html、类别）{
var contentString=html；
var marker=new google.maps.marker({
位置：latlng，
图标：gicons[类别]，
地图：地图，
标题：姓名，
zIndex:Math.round（latlng.lat（）*-100000）我在发布后自己找到了这个问题的答案，所以我更新了代码，以反映万一有人在搜索中找到这个帖子

下面是在makeSidebar函数中恢复mouseout上默认标记颜色的代码

 html += '<a href="javascript:myclick(' + i + ')" onmouseover="gmarkers['+ i +'].setIcon(gicons.active)" onmouseout="gmarkers['+ i +'].setIcon(gicons.' + gmarkers[i].mycategory  + ')">' + gmarkers[i].myname + '<\/a><br>';

html+=''+gmarkers[i].myname+'
；
发布后，我自己找到了这个问题的答案，因此我更新了代码，以反映万一有人在搜索中找到此帖子。您可能应该在答案中发布该代码并接受它（或者恢复问题中的原始代码，这样才有意义）。