2012-04-05 2 views
0

Ich habe Karte mit mehreren verschiedenen Farben Marker mit einigen Info-Fenster. Alles funktioniert OK, außer wenn ich auf einen Marker klicke (ich habe 5 von ihnen im Beispiel), schaltet er den Cursor auf, sagen wir mal den 4. Marker und zeigt das Info-Fenster immer von diesem Marker an. Es zeigt also immer das gleiche Infofenster an. Es ist kleine HTML-Datei, so würde ich mich freuen, wenn jemand die Lösung dafür kennt. habe ich auch versucht und mit google.maps.event.addDomListener weil ich vermute, dass es das Problem gibt, aber es ist das gleiche Verhalten.Google Map seltsame Verhalten- Marker-Info Fenster zeigt Informationen immer von der gleichen Markierung

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml"> 
<head> 
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
    <title>Google Maps Javascript API v3 Example: Loading the data from an XML</title> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="downloadxml.js"></script> 

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





    // global "map" variable 
     var map = null; 






function initialize() { 

    var myOptions = { 
    zoom: 8, 
    center: new google.maps.LatLng(43.907787,-79.359741), 
    mapTypeControl: true, 
    mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}, 
    navigationControl: true, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), 
           myOptions); 

    google.maps.event.addListener(map, 'click', function() { 
     infowindow.close(); 
     }); 
     // Read the data from example.xml 
     downloadUrl("example7.xml", function(doc) { 
     var xmlDoc = xmlParse(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 google.maps.LatLng(lat,lng); 
      var html = markers[i].getAttribute("html"); 




     var severity = parseFloat(markers[i].getAttribute("severity")); 

     var color= "66FF33"; 


     if (severity == 0) color = "66FF33"; 
     else if (severity == 1) color = "990099"; 
     else if (severity == 2) color = "00CCFF"; 


     var pinImage = new google.maps.MarkerImage("http://www.googlemapsmarkers.com/v1/" + color, 
     new google.maps.Size(21, 34), 
     new google.maps.Point(0,0), 
     new google.maps.Point(10, 34)); 


     var marker = new google.maps.Marker({ 
       position: point, 
       map: map, 
       icon: pinImage, 

      }); 

google.maps.event.addListener(marker, 'click', function() { 
     var alarmanchor1='<span class="url"><a href="' + html; 
     var alarmanchor2='" title="www" target="_blank">Event List</a></span>'; 
     var contentString=alarmanchor1+alarmanchor2; 
     infowindow.setContent(contentString); 
     infowindow.open(map,marker); 
     }); 




     } 

     }); 
    } 

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


//]]> 
</script> 

    </head> 
<body style="margin:0px; padding:0px;" onload="initialize()"> 


    <table border="1"> 
     <tr> 
     <td> 
      <div id="map_canvas" style="width: 1050px; height: 1200px"></div> 
     </td> 

     </tr> 
    </table> 


<script src="urchin.js" type="text/javascript"> 
</script> 


    </body> 
</html> 

Meine XML ist:

<markers> 

<marker lat="43.65654" lng="-79.90138" html="http://www.google.com" label="Marker One" severity="0" /> 
<marker lat="43.91892" lng="-78.89231" html="http://www.yahoo.com" label="Marker Two" severity="1" /> 
<marker lat="43.82589" lng="-79.10040" html="http://www.sport.com" label="Marker Three" severity="2" /> 
    <marker lat="43.72589" lng="-79.60040" html="http://www.stackoverflow.com" label="Marker Fourth" severity="3" /> 
    <marker lat="43.52589" lng="-79.70040" html="http://www.stackoverflow.com" label="Marker Five" severity="4" /> 
</markers> 
+0

Können Sie die XML-Datei auch teilen? –

+0

Hallo Ersel. Danke für die Antwort Ich aktualisiere es mit meinem XML. – Dejan

+0

Ok, ich werde es mir nochmal ansehen. –

Antwort

1

einfach Ihren Code Um dies zu ändern, so dass es die richtige URL für jedes Element bekommt.

<a href="' + html; 

zu

<a href="' +markers[i].getAttribute("html"); 

so der vollständige Code auf Ihre Frage lautet:

google.maps.event.addListener(marker, 'click', (function(marker, i) { return function(){ var alarmanchor1='<span class="url"><a href="' +markers[i].getAttribute("html"); var alarmanchor2='" title="www" target="_blank">Event List</a></span>'; var contentString=alarmanchor1+alarmanchor2; infowindow.setContent(contentString); infowindow.open(map, marker); } }) (marker, i)); 
+0

danke für Ihre Bemühungen! Ich dachte, es wäre genug, um nur HTML-Wert zu bekommen, aber Sie hatten Recht! Kann ich Ihnen noch zwei weitere Fragen stellen: Für API 3 brauche ich keinen Schlüssel zum Kauf, denn ich möchte diese Datei hochladen und auf einen Anwendungsserver übertragen. Und zweite Frage in API 3, wie Größe des Symbols ändern? Denn wenn ich neue google.maps.Size (21, 34) ändere, neue google.maps.Point (0,0), neue google.maps.Point (10, 34)); Bei neuen google.maps.Size (15, 30) werden meine Marker abgeschnitten oder mit rotem Schatten versehen. VIELEN DANK!!!!!! – Dejan

+1

Nein, Sie brauchen keinen Schlüssel, aber es ist frei, einen zu bekommen, damit es kein Problem ist. Ich bin mir nicht sicher, ich benutze dieses Tool, um meine Marker zu erstellen. http://powerhut.co.uk/googlemaps/custom_markers.php Gut zu helfen :) –

Verwandte Themen