Google map problems

[midjam]

Hi guys, i`m a noob with javascript and php so, please go easy

 

I have been following this tutorial: http://code.google.com/apis/maps/articles/phpsqlajax_v3.html#createmap

 

All has been going great until i try to filter the results with a url parameter(location), i can`t set $locations to $_GET['locations'] which will filter what records to show.

At the moment it just defaults to record 98. Hope this is clear

 

Have been searching for the reason why for 5 hours now hence my question here.

 

Heres my code:

 

<?php
require("connections/dbconnect.php");
$location = 98;
if (isset($_GET['location'])) {
  $location = $_GET['location'];
}
function parseToXML($htmlStr)
{ 
$xmlStr=str_replace('<','<',$htmlStr); 
$xmlStr=str_replace('>','>',$xmlStr); 
$xmlStr=str_replace('"','"',$xmlStr); 
$xmlStr=str_replace("'",'&#39;',$xmlStr); 
$xmlStr=str_replace("&",'&',$xmlStr); 
return $xmlStr; 
}

// Select all the rows in the markers table
$query = "SELECT * FROM locations WHERE locations.id_location = '$location'";
$result = mysql_query($query);
if (!$result) {
  die('Invalid query: ' . mysql_error());
}

header("Content-type: text/xml");

// Start XML file, echo parent node
echo '<markers>';

// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
  // ADD TO XML DOCUMENT NODE
  echo '<marker ';
  echo 'id="' . $row['id_location'] . '" ';
  echo 'name="' . parseToXML($row['name']) . '" ';
  echo 'info="' . parseToXML($row['info']) . '" ';
  echo 'lat="' . $row['lat'] . '" ';
  echo 'lng="' . $row['lng'] . '" ';
  echo 'county="' . $row['county'] . '" ';
  echo 'type="' . $row['type'] . '" ';
  echo '/>';
}

// End XML file
echo '</markers>';

?>

 

The javascript

 

// JavaScript Document
   var customIcons = {
      River: {
        icon: 'http://localhost/fishfinder/images/river-map-icon.png',
        shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
      },
      Lake: {
        icon: 'http://localhost/fishfinder/images/lake-map-icon.png',
        shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
      },
  Sea: {
        icon: 'http://localhost/fishfinder/images/sea-map-icon.png',
        shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png'
      }
    };

    function load() {
      var map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(53.252069, -3.427734),
        zoom: 6,
        mapTypeId: 'satellite'
      });
      var infoWindow = new google.maps.InfoWindow();

      // Change this depending on the name of your PHP file
      downloadUrl("process-markers-location-details-xml.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
	  var id = markers[i].getAttribute("id");
          var name = markers[i].getAttribute("name");
          var info = markers[i].getAttribute("info");
          var county = markers[i].getAttribute("county");
	  var type = markers[i].getAttribute("type");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
		  
          var html = "<table cellpadding='3' cellspacing='3' valign='top'>" +
			 	"<tr bgcolor='#4F649D'><td colspan='2'><h2 style='color:#FFF; margin-left:15px;'>Location Details</h2></td></tr>" +
			 	"  <tr bgcolor='#4F649D'><td colspan='2'></td></tr>" + 
				"<tr>" +
				"  <td width='1' align='left' valign='top' bgcolor='#F2F2F2'><strong> Name: </strong><a href='location-details.php?location=" + id + "&" + name + "'></a></td>" +
				"<td width='277' align='left' valign='top' bgcolor='#FFFFFF'><a href='location-details.php?location=" + id + "&" + name + "'>" + name + "</a></td>" +
				"  </tr>" +
				"  <tr>" +
				"  <td colspan='2' align='center' valign='top'><img src='images/default-location-image.jpg' width='320' height='120' alt='' border='0'/></td>" +
				"  </tr>" +
				"<tr>" +
				"  <td align='left' valign='top' bgcolor='#F2F2F2'><strong style='font-size:14px;'> info:</strong></td>" +
				"  <td width='277' align='left' valign='top' bgcolor='#FFFFFF'>" + info + "</td>" +
           " </tr>" +
				"<tr>" +
				"  <td align='left' valign='top' bgcolor='#F2F2F2'><strong style='font-size:14px;'> area:</strong></td>" +
				"  <td width='277' align='left' valign='top' bgcolor='#FFFFFF'>" + county + "</td>" +
           " </tr>" +
				"<tr>" +
				"  <td align='left' valign='top' bgcolor='#F2F2F2'><strong style='font-size:14px;'> type:</strong></td>" +
				 " <td width='277' align='left' valign='top' bgcolor='#FFFFFF'>" + type + "</td>" +
           " </tr>" +
				"</table>";

	  var icon = customIcons[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            shadow: icon.shadow
          });
          bindInfoWindow(marker, map, infoWindow, html);
        }
      });
    }

    function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }

    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };

      request.open('GET', url, true);
      request.send(null);
    }

    function doNothing() {}

[midjam]

I`m guessing it`s because i`m using java to create an xml and $_GET needs to be in html/php to work, am i on the right track?

[midjam]

Let me explain the problem a little clearer.

 

I have a database setup with lng, lat and have all pins displayed correctly on the front page. I have a link for each record which goes to the location details page and passes the record ID in the url ?location=

 

I`m trying to filter the map to only show that location, the file that creates the XML works fine if I preview it in the browser and change the ?location= number so, I think it`s a problem with the javascript specifically this line:

 for (var i = 0; i < markers.length; i++) {

As it looks like it is trying to add more than one pin.

 

If anyone could shine some light on this, it would be great

[midjam]

either that or the url parameter is not being passed