2012-03-30 3 views
0

Ich habe generierte XML (alarms.xml) im Format (Beispiel)Google Map andere Farbe für das Symbol Standard Marker abhängig von SEVERITY in generierten XML

<markers> 
<marker lat="41.932797" lng="21.483765" alarm="Boston" severity="0" /> 
<marker lat="41.732797" lng="21.183765" alarm="Toronto" severity="2" /> 
</markers> 

Je nach Schweregrad unterschiedlicher Farbe für Standardmarker muss gezeigt werden :

0-green 
1-violet 
2-ocher 

usw.

Was muss ich in dieser meiner einfachen hTML-Datei ändern?

Vielen Dank für Hilfe

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html> 
    <head> 
    <title>Google Maps</title> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;" type="text/javascript"></script> 
    </head> 
    <body onunload="GUnload()"> 

    <table border=1> 
     <tr> 
     <td> 
      <div id="map" style="width: 1550px; height: 1450px"></div> 
     </td> 
     </tr> 
    </table> 


    <script type="text/javascript"> 
    //<![CDATA[ 

    if (GBrowserIsCompatible()) { 

     var gmarkers = []; 


     function createMarker(point,name,alarm) { 
     var marker = new GMarker(point); 
     GEvent.addListener(marker, "click", function() { 
      marker.openInfoWindowHtml(alarm); 
     }); 

     return marker; 
     } 



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


     var map = new GMap2(document.getElementById("map")); 
     map.addControl(new GLargeMapControl()); 
     map.addControl(new GMapTypeControl()); 
     map.setCenter(new GLatLng(41.932797,21.483765), 10); 



     GDownloadUrl("alarms.xml", function(doc) { 
     var xmlDoc = GXml.parse(doc); 
     var markers = xmlDoc.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 GLatLng(lat,lng); 
      var alarm = markers[i].getAttribute("alarm"); 
      var label = markers[i].getAttribute("label"); 
      // create the marker 
      var marker = createMarker(point,label,alarm); 
      map.addOverlay(marker); 
     } 

     }); 
    } 




    //]]> 
    </script> 
    </body> 

</html> 

Antwort

1

Bevor Sie die Markierung hinzufügen, ein benutzerdefiniertes Symbol pro Schweregrad einstellen:

var severity = parseInt(markers[i].getAttribute("severity")); 
var severityIcon = new GIcon(G_DEFAULT_ICON); 
var color; 
if (severity == 1) color = "red"; 
else if (severity == 2) color = "blue"; 
else if (severity == 3) color = "green"; 
else color = "yellow"; 
severityIcon.image = "http://www.google.com/intl/en_us/mapfiles/ms/micons/" + color + "-dot.png"; 

markerOptions = { icon:severityIcon }; 

Dann fügen Sie es wie folgt auf der Karte:

map.addOverlay(new GMarker(latlng, markerOptions)); 

Dies ist von der ausgezeichneten Google Maps Beispielseite hier: https://google-developers.appspot.com/maps/documentation/javascript/v2/examples/icon-simple

+0

Danke für die Antwort, aber ich denke, das ist nicht meine Bedürfnisse. Sie haben nur eine andere Farbe erstellt. Ich denke, ich brauche eine Funktion, um das Mapping zu machen, weil ich in diesem Beispiel 3 verschiedene Farben haben werde. Also, wenn ich den Schweregrad nehme var severity = markers [i] .getAttribute ("Schweregrad"); Ich denke, ich muss eine Funktion mit Parameter Severity aufrufen, die die Zuordnung basierend auf dem Schweregrad durchführt. – Dejan

+0

Das ist leicht mit einer bedingten Anweisung behoben, nein? (aktualisiert in der Antwort oben) – McGarnagle

+0

Hi, ich meinte genau das. Bitte schauen Sie sich meine addOverlay-Funktion an, weil ich denke, dass das Problem ist, warum es noch nicht funktioniert (Sie benutzen latlng und ich benutze nur Marker) map.addOverlay (marker, markerOptions); – Dejan