Google map is not displaying markers

Hi

all

I working with google maps. but the markers are not displaying.

Here is the code


<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps AJAX + MySQL/PHP Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=xxxxxxxxx" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var iconBlue = new GIcon(); 
iconBlue.image = "http://labs.google.com/ridefinder/images/mm_blue.png";
iconBlue.shadow = "http://labs.google.com/ridefinder/images/mm_shadow.png";
iconBlue.iconSize = new GSize(12, 20);
iconBlue.shadowSize = new GSize(22, 20);
iconBlue.iconAnchor = new GPoint(6, 20);
iconBlue.infoWindowAnchor = new GPoint(5, 1);
var iconRed = new GIcon(); 
iconRed.image = "http://labs.google.com/ridefinder/images/mm_20_red.png";
 iconRed.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
iconRed.iconSize = new GSize(12, 20);
iconRed.shadowSize = new GSize(22, 20);
iconRed.iconAnchor = new GPoint(6, 20);
iconRed.infoWindowAnchor = new GPoint(5, 1);
var customIcons = [];
customIcons["restaurant"] = iconBlue;
customIcons["bar"] = iconRed;
function load() 
{ 
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(17.408446, 78.448692), 16);
GDownloadUrl("phpsqlajax.php", function(data,responseCode)
 {
var xml = GXml.parse(data);
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
GLatLng(parseFloat(markers[i].getAttribute("lat")), parseFloat(markers[i].getAttribute( "lng")));
var marker = createMarker(point, name, address, type);
map.addOverlay(marker);
} 
}); 
} 
}
function createMarker(point, name, address, type)
 {
 var marker = new GMarker(point, customIcons[type]);
var html = "<b>" + name + "</b> <br/>" + address;
GEvent.addListener(marker, 'click', function() { marker.openInfoWindowHtml(html); });
return marker;
}
//]]>
 </script>
 </head>
<body onload="load()" onunload="GUnload()">
 <div id="map" style="width: 500px; height: 300px"></div>
</body>
</html>

please help me out to resolve this issue

Thanks & regards.

MD.Samiuddin

The image you’re using, [noparse]http://labs.google.com/ridefinder/images/mm_blue.png[/noparse] doesn’t exist. It should be http://labs.google.com/ridefinder/images/mm[COLOR="Red"]_20[/COLOR]_blue.png :slight_smile:

Hi

Scallio

I had change the image pathm but then also the markers are not displaying.

please help me out

Thanks and Regards

MD.Samiuddin


var customIcons = [];
customIcons["restaurant"] = iconBlue;
customIcons["bar"] = iconRed;

You can’t do that in javascript. It should be:


var customIcons = {
  restaurant: icon,
  bar: iconRed
}

Try that :slight_smile:

Hi
Scallio

I tried your suggestion. but no luck. still it is not displaying the markers.

please help me out

Is the map live on a website somewhere so I can take a look? Just looking at the source code only goes so far :slight_smile:

Hi
Scallio

I am check the map on my localhost.

thanks & Regards

MD.Samiuddin

I will see what I can do later today. Right now I’m rather busy.

So if anyone else wants to take a stab, go for it :slight_smile:

I can’t really test it here because I don’t have your phpsqlajax.php
Could you post an example output of that file here so I can use that please?