Home/ Questions/Q 7741083
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T08:56:12+00:00

Hey again fine peoples! I’ll start at the top, with my XML file! I

  • 0

Hey again fine peoples!

I’ll start at the top, with my XML file! I have a XML layed out like this:

<?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>

Then I have php file like this to read the XML and display the markers on google maps (irrelevant stuff stripped out):

<?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>


<?
}

?>

Now, that works all fine however in the XML i have a type. Type 1 (watersource.png) and Type 2 (waterwellpump.png). What I need to do is if it’s type 1 in the XML display map marker image 1.. Type 2, marker image 2.. I’m kinda new to this XML caper and am a little lost!! If anyone could point me in the right direction I would be most grateful!
Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    When you are sending the information to create marker, send the image type like this

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

    In your createMarker function change it to decide which image to select.

    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