2012-04-05 6 views
0

Hey wieder feine Völker!Verschiedene Google Maps benutzerdefinierte Marker Bilder mit XML

Ich fange oben an, mit meiner XML-Datei! Ich habe eine XML wie folgt verlegt aus:

<?xml version="1.0" encoding="UTF-8"?> 
<markers> 
<watersource> 
    <marker name="Large private dam - Plenty of water. Access from whatever Rd." lat="-35.844630" lng="146.313416" type="1"/> 
</watersource> 
<watersource> 
    <marker name="Small water tank with fire fighting fittings - Plenty of water. Access from whatever Rd." lat="-35.844630" lng="146.313416" type="1"/> 
    </watersource> 
</markers> 

Dann habe ich PHP-Datei wie dies die XML zu lesen und die Markierungen auf Google Maps (irrelevante Sachen zu) angezeigt werden:

<?php 

{ 
?> 

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="util.js"></script> 
<script type="text/javascript"> 
    var infowindow; 
    var map; 

    function initialize() { 
    var myLatlng = new google.maps.LatLng(-37.855677, 145.316076); 
    var myOptions = { 
     zoom: 13, 
     center: myLatlng, 
    disableDefaultUI: true, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 


    downloadUrl("watersourcedata.xml", function(data) { 
     var markers = data.documentElement.getElementsByTagName("marker"); 
     for (var i = 0; i < markers.length; i++) { 
     var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")), 
           parseFloat(markers[i].getAttribute("lng"))); 
     var marker = createMarker(markers[i].getAttribute("name"), latlng); 
     } 
    }); 
     } 


var image = 'images/watersource.png'; 


    function createMarker(name, latlng) { 
    var marker = new google.maps.Marker({position: latlng, map: map, icon: image}); 
google.maps.event.addListener(marker, "click", function() { 
    if (infowindow) infowindow.close(); 
    infowindow = new google.maps.InfoWindow({content: name}); 
    infowindow.open(map, marker); 
    }); 
    return marker; 
    } 


    </script> 
    </head> 
    <body onload="initialize()"> 


    <FONT SIZE="2">NOTE: Water Source Map Is Under Construction.<BR> 
    This map once completed will allow brigades to make and maintain a map of major water sources like dams, wells, tanks ect. in their local areas.<BR> 

    <BR> 
    Watersource Legend:<BR> 
    A creek, dam, river, pond ect.(drafting needed) = <img src='images/watersource.png'> <BR> 
    A water tank, pump ect (drafting NOT needed) = <img src='images/waterwellpump.png'> 
<BR> 
</FONT> 

<div id="map_canvas" style="width:950px; height:450px;"></div> 


<? 
} 

?> 

Jetzt, das funktioniert alles gut, aber in der XML habe ich einen Typ. Typ 1 (waterource.png) und Typ 2 (waterwellpump.png). Was ich tun muss, ist, wenn es Typ 1 in der XML-Anzeige Map Marker Image 1 ist. Typ 2, Marker Bild 2 .. Ich bin ein bisschen neu zu diesem XML-Kaper und bin ein wenig verloren !! Wenn mir jemand in die richtige Richtung zeigen könnte, wäre ich sehr dankbar! Danke!

Antwort

1

Wenn Sie die Informationen senden Markierung zu erstellen, wie diese den Bildtyp senden

createMarker(markers[i].getAttribute("name"), latlng, markers[i].getAttribute("type")); 

In Ihrer Funktion create ändern, welches Bild es, zu entscheiden, zu wählen.

function createMarker(name, latlng, type) { 
if(type == 1) 
    image = 'images/watersource.png'; 
else 
    image = 'images/waterwellpump.png'; 

var marker = new google.maps.Marker({position: latlng, map: map, icon: image}); 
google.maps.event.addListener(marker, "click", function() { 
if (infowindow) infowindow.close(); 
infowindow = new google.maps.InfoWindow({content: name}); 
infowindow.open(map, marker); 
}); 
return marker; 
} 
+0

FANTASTISCH! Lief wie am Schnürchen! VIELEN DANK! – AdamK

+0

Sie sind herzlich willkommen :) –