谷歌地图 api v3 显示不同的标记

Question

我每次都尝试根据条件显示不同的标记。

例如：

• 如果 temp > 1 显示“ilios”
• 如果湿度 > 97% 显示“omixli”

我正在尝试在createmarker() 函数中创建var marker1( the code in comments )，但我找不到方法。

有没有人知道我将如何以这种方式或其他方式做到这一点？
任何建议、示例、cmets 将不胜感激！

var infowindow;
  var map;

  function initialize() {
    var myLatlng = new google.maps.LatLng(38.822590,24.653320);
    var myOptions = {
      zoom: 5,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    downloadUrl("moredata.xml", function(data) {
      var items = data.documentElement.getElementsByTagName("item");
      for (var i = 0; i < items.length; i++) {
        var description = items[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
        var humidity    = items[i].getElementsByTagName("outsideHumidity")[0].childNodes[0].nodeValue;
        var temp        = items[i].getElementsByTagName("temp")[0].childNodes[0].nodeValue;
        var latlng = new google.maps.LatLng(parseFloat(items[i].getElementsByTagName("lat")[0].childNodes[0].nodeValue),
                                    parseFloat(items[i].getElementsByTagName("lng")[0].childNodes[0].nodeValue));

        if ( temp > "1 °C" ) {
          alert(temp);
          var marker = createMarker( description,latlng );
          }

          if (humidity > "97 %") {
          alert(humidity);
          var marker = createMarker( description,latlng );
          }

       }
     });
  }

  var iconBase = 'weather_icons/';
        var icons = {
          ilios: {
            icon: iconBase + 'ilios.png'
          },
          pagetos: {
            icon: iconBase + 'pagetos2.png'
          },
          omixli: {
          icon: iconBase + 'omixli.png'
          }
        };

  function createMarker(description, latlng) {
    var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    icon: icons['pagetos'].icon
    });

    //var marker1 = new google.maps.Marker({
    //position: latlng,
    //map: map,
    //icon: icons['omixli'].icon
    //});

    google.maps.event.addListener(marker, "click", function() {
      if (infowindow) infowindow.close();
      infowindow = new google.maps.InfoWindow({content: description});
      infowindow.open(map, marker);
    });
    return marker;
  }

这是moredata.xml

<item>
<description>Thesaloniki</description>
<temp>10 °C</temp>
<outsideHumidity>98 %</outsideHumidity>
<lat>40.422726139672626</lat>
<lng>22.93392777442932</lng>
</item>
<item>
<description>Giannena</description>
<temp>14 °C</temp>
<outsideHumidity>90 %</outsideHumidity>
<lat>39.62209843837158</lat>
<lng>20.89027225971222</lng>
</item>
<item>
<description>Atiki</description>
<temp>15 °C</temp>
<outsideHumidity>65 %</outsideHumidity>
<lat>38.08469095792561</lat>
<lng>23.680233657360077</lng>
</item>

Answer 1

经过大量搜索，我终于找到了解决方案！
我必须创建与图像一样多的createMarker 函数！我将插入正确的代码，希望将来对您有所帮助！ 你来了..

var infowindow;
  var map;

  function initialize() {
    var myLatlng = new google.maps.LatLng(38.822590,24.653320);
    var myOptions = {
      zoom: 5,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    downloadUrl("moredata.xml", function(data) {
      var items = data.documentElement.getElementsByTagName("item");
      for (var i = 0; i < items.length; i++) {
        var description = items[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
        var humidity    = items[i].getElementsByTagName("outsideHumidity")[0].childNodes[0].nodeValue;
        var temp        = items[i].getElementsByTagName("temp")[0].childNodes[0].nodeValue;
        var title       = items[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
        var latlng = new google.maps.LatLng(parseFloat(items[i].getElementsByTagName("lat")[0].childNodes[0].nodeValue),
                                    parseFloat(items[i].getElementsByTagName("lng")[0].childNodes[0].nodeValue));

        if ( temp > "38 °C" ) {
          alert(temp);
          var marker = createMarker2( description,latlng,ilios );
          }

          if ( temp < "1 °C" ) {
          alert(temp);
          var marker = createMarker( description,latlng,cold );
          }

          if ( humidity > "97%" ) {
          alert(windSpeed);
          var marker = createMarker1( description,latlng,omixli );
          }

       }
     });
  }

  var cold  = 'weather_icons/pagetos2.png';
  var omixli = 'weather_icons/omixli.gif';
  var ilios = 'weather_icons/ilios.png';

  function createMarker( description,latlng,cold ) {
    var marker = new google.maps.Marker({
    position: latlng,
    map: map,
    icon: cold
    });

    google.maps.event.addListener(marker, "click", function() {
      if (infowindow) infowindow.close();
      infowindow = new google.maps.InfoWindow({
      content: description
      });
      infowindow.open(map, marker);
    });
    return marker;
  }

  function createMarker1( description,latlng,omixli ) {
    var marker1 = new google.maps.Marker({
    position: latlng,
    map: map,
    icon: omixli
    });

    google.maps.event.addListener(marker1, "click", function() {
      if (infowindow) infowindow.close();
      infowindow = new google.maps.InfoWindow({
      content: description
      });
      infowindow.open(map, marker1);
    });
    return marker1;
  }
function createMarker2( description,latlng,ilios) {
    var marker2 = new google.maps.Marker({
    position: latlng,
    map: map,
    icon: ilios
    });

    google.maps.event.addListener(marker2, "click", function() {
      if (infowindow) infowindow.close();
      infowindow = new google.maps.InfoWindow({
      content: description
      });
      infowindow.open(map, marker2);
    });
    return marker2;
  }

最后，非常感谢所有评论并给我建议的人！