Outputting markers to Google Map

I have got the concept of it working, the xml is created and the map appears centrally where I want it too, but it doesn’t seem to be creating the markers from the data I have created.

Here is the link to it, you will have to wait a couple of seconds for it to appear in the bottom right.

Googe Map on my site

This is the script

<script src="https://maps.googleapis.com/maps/api/js?key=in use" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

var customIcons = {
  restaurant: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
  },
  bar: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png'
  }
};

function load() {
  var map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(40.104341, -3.579593),
    zoom: 5,
    mapTypeId: 'terrain'
  });
  var infoWindow = new google.maps.InfoWindow;

   // Change this depending on the name of your PHP file
    downloadUrl("phpsqlajax_genxml.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
//var name = markers[i].getAttribute("name");
var address = markers[i].getAttribute("address");
var type = markers[i].getAttribute("type");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
          parseFloat(markers[i].getAttribute("lng")));
      var html = "<b>" + address + "</b> <br/>";
      var icon = customIcons[type] || {};
      var marker = new google.maps.Marker({
        map: map,
        position: point,
        icon: icon.icon
      });
      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() {}

//]]>

The issue it seems is uploading the php file with the following code, to create the markers

<?php
$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node);

// Select all the rows in the markers table
$query = mysql_query("SELECT Nom_Rsrt, lat, lng, type, IdCntry_Rsrt FROM tbl_resorts WHERE (IdCntry_Rsrt='".$selectCountry."') AND (lat !='') AND (lng !='')");

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

// Iterate through the rows, adding XML nodes for each
while ($row = mysql_fetch_assoc($query)){
// ADD TO XML DOCUMENT NODE
$node = $dom->createElement("marker");
$newnode = $parnode->appendChild($node);
//$newnode->setAttribute("name",$row['name']);
$newnode->setAttribute("address", utf8_encode($row['Nom_Rsrt']));
$newnode->setAttribute("lat", utf8_encode($row['lat']));
$newnode->setAttribute("lng", utf8_encode($row['lng']));
$newnode->setAttribute("type", utf8_encode($row['type']));
}
echo $dom->saveXML();
?>

It might be the actual php or the script, im not sure at all

What happens when you go to this file directly? you should get an xml page. If it’s a problem with the xml then you will get an error message on that page.

On its own as it is it hasn’t got any db details in there, so when I try that I get this -

<?xml version="1.0"?>
<markers/>

Then when I put a connection to the config file in to connect to the db, I get the same thing

<?xml version="1.0"?>
<markers/>

But I had this working fine earlier, as I then moved onto the script.

This is the config file data

$db="hidden";
$host="hidden";
$user="hidden";
$pass="hidden";

$link=mysql_connect($host,$user,$pass);
mysql_select_db($db);

Sorry I got it, the variable in the select statement wasn’t given a value, so change it to a value and it worked, so on its own the php produces the xml below.

<?xml version="1.0"?>
-<markers>
<marker lng="2.078728" lat="41.394768" address="Barcelona"/>
</markers>

But when its called into the main page, the variable is given a value there, so I wonder if its not being seen in the select statement, and checked it and BINGO that’s the problem.

So the php in the select statement needs to be declared on the actual php include.

ah just had a look at your site and went to the xml page. yep it’s not outputting correctly. i’ll check my script against yours…

ah yes you aren’t passing any variables with the call. my url looks like

downloadUrl('map_data.php?beach_name=' +bname, function(data)

you need to get the variable from the url (if you are using get) and put it into a js variable

var bname = '".$mbeach."';

ah through a js variable, I found the same problem, but couldn’t work out what it was

Ah hang on now Noppy, I’m lost.

The url path has to be the phpsqlajax_genxml.php file, so do I attach the variable to the end of that is it, and I cant work out where the js variable goes.

sorry

If you want the sql in the phpsqlajax_genxml.php to use a variable from the original page (IdCntry_Rsrt=‘“.$selectCountry.”’) you must pass the $selectCountry from the first page to the phpsqlajax_genxml.php page.

So you need to pass that as a get variable

phpsqlajax_genxml.php?selectCountry=belgium

and then in the phpsqlajax_genxml.php page you need to pick up that variable to use in the query

$selectCountry = $_GET['selectCountry']; ######You need to clean this before using in a query or you will have sql injection ####

if you see what i mean.

ok try this

In the firstpage put

var scountry = '<?php echo $_GET['Country'];?>';

put that just above
downloadUrl('.....etc

Then in the downloadUrl(’ bit put

downloadUrl('phpsqlajax_genxml.php?selectCountry='+scountry, function(data) {

Now on the phpsqlajax_genxml.php page you need to pick up that variable to use in the query

$selectCountry = $_GET['selectCountry']; ######You need to clean 
this before using in a query or you will have sql injection ####

and you can then use that variable in the query. MAKE SURE YOU CLEAN IT FIRST!

also you should be using at least mysqli as mysql is outdated and less secure. But let’s get this working first :wink:

Thanks Noppy,

Not sure where you live but in the UK there no work now until Tuesday, so I cant get into the office until then, very frustrating…

So can I pick this back up with you on Tuesday, as I nearly had it then, and im actually excited to get back into work on Tuesday!!!

hope you had a good easter wknd. 4 day wknds are awesome. Let me know if you’ve got this sorted yet or we can give it a go today

ye they are good, and much appreciate the support, I was just in the process of opening it all up and to have a look. So will have a look at your last couple of threads and see if I can get this sorted.

Thanks again Noppy

OK have implemented what you suggested and it makes perfect sense, but for some reason its now working.

To check if it was just the value of selectCountry I took the php out of the select string in the php file and instead put the value 1 in, as that is what it should be and still the markers didn’t show.

I also put a link to the db in the php file through config.php and again nothing.

ok so i’d probably do what you are doing and split this into a couple of different problems.

1st problem - getting the phpsqlajax_genxml.php page to output the correct xml

So as you said in your query make the value something you know should work

$selectCountry = '1';
$query = mysql_query("SELECT Nom_Rsrt, lat, lng, type, IdCntry_Rsrt FROM tbl_resorts WHERE (IdCntry_Rsrt='".$selectCountry."') AND (lat !='') AND (lng !='')");

Does this output the correct xml when you go directly to phpsqlajax_genxml.php?

Yep that’s done, and still no marker.

I isolated the php page and added the value in manually and it outputted the correct xml, just it seems its not coming back to the main page to output the marker on the map

<?php
include("config.php");
$selectCountry='1';

$dom = new DOMDocument("1.0");
$node = $dom->createElement("markers");
$parnode = $dom->appendChild($node);

// Select all the rows in the markers table
$query = mysql_query("SELECT Nom_Rsrt, lat, lng, IdCntry_Rsrt FROM tbl_resorts WHERE (IdCntry_Rsrt='".$selectCountry."') AND (lat !='') AND (lng !='')");

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

// Iterate through the rows, adding XML nodes for each
while ($row = mysql_fetch_assoc($query)){
// ADD TO XML DOCUMENT NODE
$node = $dom->createElement("marker");
$newnode = $parnode->appendChild($node);
//$newnode->setAttribute("name",$row['name']);
$newnode->setAttribute("address", utf8_encode($row['Nom_Rsrt']));
$newnode->setAttribute("lat", utf8_encode($row['lat']));
$newnode->setAttribute("lng", utf8_encode($row['lng']));
//$newnode->setAttribute("type", utf8_encode($row['type']));
}
echo $dom->saveXML();
?>

and then by isolating it as you say this is the xml output

<?xml version="1.0"?>
-<markers>
<marker lng="2.078728" lat="41.394768" address="Barcelona"/>
</markers>

ok so just to double check the xml side of things what i’d suggest trying is creating a static xml page containing

<markers><marker address="Barcelona" lat="41.394768" lng="2.078728"/></markers>

and then point the map script at this page to see if it works

downloadUrl('text.xml… etc without any variable

mmm good thinking, but not working either.

test.xml

  <markers><marker address="Barcelona" lat="41.394768" lng="2.078728"/></markers>

result2.php

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCvec66_SNMW65uWTcyv7U-Fk47Otb60HM" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[

var customIcons = {
  restaurant: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
  },
  bar: {
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png'
  }
};

function load() {
  var map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(40.104341, -3.579593),
    zoom: 5,
    mapTypeId: 'terrain'
  });
  var infoWindow = new google.maps.InfoWindow;

  // Change this depending on the name of your PHP file
  var scountry = '<?php echo $_GET['Country'];?>';
  downloadUrl('test.xml', function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
     for (var i = 0; i < markers.length; i++) {
      //var name = markers[i].getAttribute("name");
      var address = markers[i].getAttribute("address");
      //var type = markers[i].getAttribute("type");
      var point = new google.maps.LatLng(
          parseFloat(markers[i].getAttribute("lat")),
          parseFloat(markers[i].getAttribute("lng")));
      var html = "<b>" + address + "</b> <br/>";
      var icon = customIcons[type] || {};
      var marker = new google.maps.Marker({
        map: map,
        position: point,
        icon: icon.icon
      });
      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() {}

//]]>

do you think it could be something to do with the icon type.

The thing is I think this code is mainly to show localised markers like bars and restaurants, and I don’t need that, so have in effect commented it out, but wondered if that would make a difference