Develop Reference

I want to load all the images in a folder in a google maps info window

I am loading a bunch of markers into google maps from an xml file. Each marker's name will correspond with a folder of images on the server. When populating the information box I want to display all the images in the corresponding folder.
www.frackwatch.co.za
Everything works except the images do not display. In their place instead is [Object][Object].
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(-31.5, 24.0),
zoom: 7,
mapTypeId: 'satellite'
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("genxml.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var info = markers[i].getAttribute("info");
var name = markers[i].getAttribute("name");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var folder = "attachments/" + name +"/";
var html = "<b>" + info + "</b> <br/>" + $.ajax({
url : folder,
success: function (data) {
$(data).find("a").attr("href", function (i, val) {
if( val.match(/\.(jpeg|png|gif)$/) ) {
$("body").append( "<img src='"+ folder + val +"'>" );
}
});
}
});
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icn
});
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() {}
<div id="map"></div>
Correct code but only loads images for the first marker:
function load() {
var map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(-29, 25.0),
zoom: 6,
mapTypeId: 'satellite'
});
var infoWindow = new google.maps.InfoWindow;
// Change this depending on the name of your PHP file
downloadUrl("genxml.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var info = markers[i].getAttribute("info");
var id = markers[i].getAttribute("id");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var folder = "/attachments/" + id +"/";
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icn
});
$.ajax({
url : folder,
success: function (data) {
var html = "<b>" + info + "</b><br/>";
$(data).find("a").each(function () {
$this = $(this)
if($this.attr('href').match(/\.(jpg|png|gif|jpeg)$/)) {
html += "<img src="+ folder + $this.attr('href') + ">";
}
});
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() {}

var html = "<b>" + info + "</b> <br/>" + $.ajax({url : folder,success: function (data) {$(data).find("a").attr("href", function (i, val) {if( val.match(/\.(jpeg|png|gif)$/) ) { $("body").append( "<img src='"+ folder + val +"'>" );} });}});;
The $.ajax function does not return anything. Check the documentation.
So the var html = [...] + $.ajax is broken.
You are trying to display all images in a folder in a InfoWindow ?
If so, it should something like :
var folder = "attachments/" + name +"/";
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icn
});
$.ajax({
url : folder,
success: function (data) {
var html = "<b>" + info + "</b> <br/>";
$(data).find("a").each(function () {
$this = $(this)
if($this.attr('href').match(/\.(jpeg|png|gif)$/)) {
html += "<img src=" + $this.attr('href') + ">";
}
});
bindInfoWindow(marker, map, infoWindow, html);
}
});
bindInfoWindow should be in the ajax callback otherwise the result can be there yet.
A cleaner way would be that genxml.php lists all images so you won't have to request the files in folder afterwards.

Ajax call slower in MySQL than MS Sql

I'm displaying map in a website with markers. I get the location from mysql database using a servlet and get it in js.
function initMap() {
getLocationFromServlet(xhr); //get
setTimeout(function() {
createMap(); //create map after getting coord from getLocationFromServlet(xhr), but latArray is empty
console.log(latArray); //empty here though defined in getLocationFromServlet
}, 1300);
}
function createMap() {
var mapDiv = document.getElementById('map');
map = new google.maps.Map(mapDiv);
map.setCenter(new google.maps.LatLng(latArray[0], lngArray[0]));
map.setZoom(17);
createMarker();
setTimeout(function() {
console.log(latArray);
}, 1600)
}
function createMarker() {
latArray.forEach(function(lat, i) {
var infoWindow = new google.maps.InfoWindow({
content: '<div id="content>' + '<p style="color:#000000">DeviceID:<p>' + '<p>' + deviceId[i] + '</p>' + '</div>'
});
var marker = new google.maps.Marker({
map: map,
mapTypeId: google.maps.MapTypeId.ROADMAP,
//position: new google.maps.LatLng(latArray[i], lngArray[i]),
icon: "phone6.png"
});
markerArray.push(marker);
markerArray[i].setPosition(new google.maps.LatLng(latArray[i], lngArray[i]));
markerArray[i].addListener("click", function() {
infoWindow.open(map, marker);
});
});
console.log(latArray);
}
function getLocationFromServlet(xhr) {
xhr = new XMLHttpRequest();
xhr.open('POST', 'GetLocationFromDB', true);
xhr.send();
xhr.onreadystatechange = function() {
console.log(xhr.readyState == 4); // false twice in console.log, but I call the function only once
if (xhr.readyState == 4) {
data = JSON.parse(xhr.responseText);
//console.log(data);
if (latArrayCount != 1) {
latArray.length = 0;
lngArray.length = 0;
deviceId.length = 0;
} else {
latArrayCount++;
}
for (i = 0; i < data.length; i++) {
if (!((i + 1) % 3 == 0)) {
//console.log(data);
latArray.push(data[i]);
lngArray.push(data[i + 1]);
deviceId.push(data[i + 2]);
i = i + 2;
console.log("lat" + latArray);
}
}
}
}
console.log(latArray); //displayed empty twice before displaying latArray values
}
This code works in ms sql. In mysql i see values in console only after few falses above the console in if (xhr.readyState == 4)

Google map center is not stable

I am working on a map based search project,Visit http://indiahomeplus.com/mapview.php ,
here the center of the map is not stable , i have given its center to kolkata but it changes automatically to unknown place.
And there is also a s
Can anyone pl's check this issue.
here is the js.
//<![CDATA[
var map;
var markers = [];
var infoWindow;
var locationSelect;
var iCircle;
function init() {
map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(22.607672, 88.399901),
zoom: 12,
mapTypeId: 'roadmap',
minZoom: 8,
mapTypeControlOptions: { style: google.maps.MapTypeControlStyle.DROPDOWN_MENU }
});
infoWindow = new google.maps.InfoWindow();
locationSelect = document.getElementById("locationSelect");
locationSelect.onchange = function () {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
if (markerNum != "none") {
google.maps.event.trigger(markers[markerNum], 'click');
}
}; searchLocationsNear(new google.maps.LatLng(22.607672, 88.399901));
//alert("in init");
var distanceWidget = new DistanceWidget(map);
// getmarkers();
}
function searchLocations() {
var address = document.getElementById("addressInput").value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode({ address: address }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
searchLocationsNear(results[0].geometry.location);
} else {
alert(address + ' not found');
}
});
}
function clearLocations() {
infoWindow.close();
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers.length = 0;
locationSelect.innerHTML = "";
var option = document.createElement("option");
option.value = "none";
option.innerHTML = "See all results:";
locationSelect.appendChild(option);
}
function searchLocationsNear(center) {
clearLocations();
var radius = document.getElementById('radiusSelect').value;
var searchUrl = 'phpsqlsearch_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
downloadUrl(searchUrl, function (data) {
var xml = parseXml(data);
var markerNodes = xml.documentElement.getElementsByTagName("property");
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markerNodes.length; i++) {
var name = markerNodes[i].getAttribute("name");
var pid = markerNodes[i].getAttribute("pid");
//var address = markerNodes[i].getAttribute("address");
var distance = parseFloat(markerNodes[i].getAttribute("distance"));
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
//alert(pid);
createOption(name, distance, i);
createMarker(latlng, name,pid);
bounds.extend(latlng);
// sidebar(pid, latlng);
}
map.fitBounds(bounds);
// locationSelect.style.visibility = "visible";
locationSelect.onchange = function () {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
google.maps.event.trigger(markers[markerNum], 'click');
};
});
}
function createMarker(latlng, name,pid) {
var html = "<b>" + name +","+pid+ "</b>";
var marker = new google.maps.Marker({
map: map,
position: latlng,
visible:false //, icon:'images/marker_p1.png'
});
google.maps.event.addListener(marker, 'click', function () {
show_right_div(pid);
//showxx();
});
google.maps.event.addListener(marker, 'mouseover', function () {
infoWindow.setContent(html);
infoWindow.open(map, marker);
// alert(marker);
});
google.maps.event.addListener(marker, 'mouseout', function () {
infoWindow.close();
});
markers.push(marker);
}
function createOption(name, distance, num) {
var option = document.createElement("option");
option.value = num;
option.innerHTML = name + "(" + distance.toFixed(1) + ")";
locationSelect.appendChild(option);
}
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.responseText, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function parseXml(str) {
if (window.ActiveXObject) {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.loadXML(str);
return doc;
} else if (window.DOMParser) {
return (new DOMParser).parseFromString(str, 'text/xml');
}
}
function doNothing() { }
google.maps.event.addDomListener(window, 'load', init);
//]]>
function hide_right_div() {
right_div.style.visibility = "hidden";
}
function show_right_div(str) {
right_div.style.visibility = "visible";
boxclose.style.visibility="visible"
if (str == "")
{
document.getElementById("right_div").innerHTML = "";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function ()
{
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
{
document.getElementById("right_div").innerHTML = xmlhttp.responseText;
resp = xmlhttp.responseText;
parseScript(resp);
}
}
xmlhttp.open("GET", "getproperty_view.php?q=" + str, true);
xmlhttp.send();
//parseScript(resp);
}
function parseScript(strcode) {
var scripts = new Array(); // Array which will store the script's code
// Strip out tags
while(strcode.indexOf("<script") > -1 || strcode.indexOf("</script") > -1) {
var s = strcode.indexOf("<script");
var s_e = strcode.indexOf(">", s);
var e = strcode.indexOf("</script", s);
var e_e = strcode.indexOf(">", e);
// Add to scripts array
scripts.push(strcode.substring(s_e+1, e));
// Strip from strcode
strcode = strcode.substring(0, s) + strcode.substring(e_e+1);
}
// Loop through every script collected and eval it
for(var i=0; i<scripts.length; i++) {
try {
eval(scripts[i]);
}
catch(ex) {
// do what you want here when a script fails
}
}
}

The workflow of your script is:
call init where you create the map and call...
searchLocationsNear...where you send a request to
http://indiahomeplus.com/phpsqlsearch_genxml.php?lat=22.607672&lng=88.399901&radius=25
this response of this script is Not connected : in the....
callback for the above request you create a LatLngBounds-object and extend it with locations based on the response(which will not happen, because the response doesn't contain markers) . Later you call ...
map.fitBounds(bounds); the inital bounds of a google.maps.LatLngBounds seems to be
((1,180),(-1,-180))
...the viewport of the map will be set to fit these bounds, that's the result you see.
Possible solution: immediately leave the callback when there are no markers :
if(!markerNodes.length)return;

Custom Google Maps API v3 - Javascript Sidebar Customization

After a lot of work/research/headaches, etc., I've got my "Local Business Directory" w/ Google Maps script working pretty cool.
Now, I'm stuck. There are a couple of things the app needs to do before it's done.
I need to run a query when someone logs on to the site, so that there is some data displayed in the sidebar... A kind of "Some Local Businesses".
I need some sort of filters to show up in a fixed cell/div at the top of the "sidebar" div. For example, sort by name desc/asc... or only show results that meet some sort of other criteria, only restaurants that offer on-line coupons, or only featured businesses, or only new businesses.
Here is my working script so far:
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript" src="js/gmap_markerwithlabel.js"></script>
<script type="text/javascript">
//<![CDATA[
google.maps.visualRefresh = true;
var map;
var markers = [];
var infoWindow;
var myCenter=new google.maps.LatLng(<?=$gmap_center_point?>);
<!-- FUNCTION -->
function load() {
map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(<?=$gmap_center_point?>),
zoom: 10,
mapTypeId: 'roadmap',
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
});
infoWindow = new google.maps.InfoWindow();
<!-- STICK A CUSTOM PIN IN CENTER LOCATION -->
var center_marker=new google.maps.Marker({
map:map,
position:myCenter,
clickable: true,
icon:'/images/GHV_map_marker.png'
});
center_marker.info = new google.maps.InfoWindow({
content: 'My Location'
});
google.maps.event.addListener(center_marker, 'click', function() {
center_marker.info.open(map, center_marker);
});
center_marker.setMap(map);
}
<!-- This function does the Search based on AddressInput -->
function searchLocations() {
var address = document.getElementById("addressInput").value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode({address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
searchLocationsNear(results[0].geometry.location);
} else {
alert(address + ' not found');
}
});
}
<!-- FUNCTION -->
function clearLocations() {
infoWindow.close();
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers.length = 0;
}
<!-- This function queries the Processing File based on criteria set... radius... search term. etc.-->
function searchLocationsNear(center) {
clearLocations();
var radius = document.getElementById('radiusSelect').value;
var searchrequest = document.getElementById('search').value;
var searchUrl = 'search_genxml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius + '&searchrequest=' + searchrequest;
downloadUrl(searchUrl, function(data) {
var xml = parseXml(data);
var markerNodes = xml.documentElement.getElementsByTagName("marker");
var sidebar = document.getElementById('sidebar');
sidebar.innerHTML = '';
if (markerNodes.length == 0) {
sidebar.innerHTML = 'No results found.';
map.setZoom(6);
map.setCenter(new google.maps.LatLng(<?=$gmap_center_point?>));
return;
}
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markerNodes.length; i++) {
<!-- GRAB THE VARIABLES ATTRIBUTES FROM PROCESSING FILE AND ASSIGN VAR -->
var name = markerNodes[i].getAttribute("name");
var address = markerNodes[i].getAttribute("address");
var profile_link = markerNodes[i].getAttribute("profile_link");
var featured = markerNodes[i].getAttribute("featured");
var coupons = markerNodes[i].getAttribute("coupons");
var youtube_activate = markerNodes[i].getAttribute("youtube_activate");
var additional_photo = markerNodes[i].getAttribute("additional_photo");
var logo = markerNodes[i].getAttribute("logo");
var number_count = markerNodes[i].getAttribute("number_count");
var distance = parseFloat(markerNodes[i].getAttribute("distance"));
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
createSidebarEntry(name, address, distance, i, featured, coupons, youtube_activate, additional_photo, logo, profile_link, number_count);
createMarker(latlng, name, address, profile_link, number_count, distance);
bounds.extend(latlng);
}
map.fitBounds(bounds);
});
}
<!-- This function creates marker and populates the infobubble -->
function createMarker(latlng, name, address, profile_link, number_count, distance, zoom) {
var html = "<b>" + name + "</b> <br/>" + address + "<br/><font color=\"red\">Approx. " + distance.toFixed(1) + " miles away</font><br/>"
<!-- html += '<a class="menu" href="javascript: map.setZoom('+zoom+');">Zoom To</a>'; -->
html += ' <a class="menu" href="javascript:map.set(streetViewControl, true);">Street View</a>';
html += ' | ';
html += ' <a class="menu" href="javascript:map.setCenter(new google.maps.LatLng('+latlng.toUrlValue(6)+')); map.setZoom(parseInt(map.getZoom())+2);">Zoom In</a>';
html += ' | ';
html += ' <a class="menu" href="javascript:map.setCenter(new google.maps.LatLng('+latlng.toUrlValue(6)+')); map.setZoom(parseInt(map.getZoom())-2);">Out </a>';
html += '<br/><br/>'+ profile_link ;
var marker = new MarkerWithLabel({
map: map,
position: latlng,
animation: google.maps.Animation.DROP,
<!-- Label Options Reference http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.9/examples/-->
labelContent: number_count,
labelAnchor: new google.maps.Point(8, 36),
labelClass: "gmap_labels", // the CSS class for the label
labelInBackground: false
});
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
markers.push(marker);
}
<!-- This function . . . -->
function createSidebarEntry(name, address, distance, num, featured, coupons, youtube_activate, additional_photo, logo, profile_link, number_count) {
var div = document.createElement("div");
var html = '<table width=\"100%\" border=\"0\" cellspacing=\"0\" cellpadding=\"5\"><tr><td width=\"20px\" valign=\"top\" align=\"right\">'+ number_count +'</td><td ><b>' + name + '</b> <br/><font color=\"red\">Approx. ' + distance.toFixed(1) + ' miles away.</font><br/>' + address + ' <br/><br/></td></tr></table>';
div.value = num;
div.innerHTML = html;
div.style.cursor = 'pointer';
div.style.marginBottom = '5px';
sidebar.appendChild(div);
google.maps.event.addDomListener(div, 'click', function() {
google.maps.event.trigger(markers[num], 'click');
});
google.maps.event.addDomListener(div, 'mouseover', function() {
div.style.backgroundColor = '#eee';
});
google.maps.event.addDomListener(div, 'mouseout', function() {
div.style.backgroundColor = '#fff';
});
return div ;
}
<!-- This function . . . -->
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.responseText, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
<!-- This function . . . -->
function parseXml(str) {
if (window.ActiveXObject) {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.loadXML(str);
return doc;
} else if (window.DOMParser) {
return (new DOMParser).parseFromString(str, 'text/xml');
}
}
<!-- This function . . . -->
function doNothing() {}
//]]>
</script>

How to submit a zipcode to Google Map API via a form

I am working on this example from Google maps api
here
The map initializes according to the coordinates that are hard coded.My problem is the "addressInput" is not recognized and map just continues to display the same view . I think there is a problem with geocoder expression.
Here is my HTML file
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<title>ShopRight Store Locator</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var map;
var markers = [];
var infoWindow;
var locationSelect;
function load() {
map = new google.maps.Map(document.getElementById("map"), {
center: new google.maps.LatLng(43.7, -79.4),
zoom: 11,
mapTypeId: 'roadmap',
mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU}
});
infoWindow = new google.maps.InfoWindow();
locationSelect = document.getElementById("locationSelect");
locationSelect.onchange = function() {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
if (markerNum != "none"){
google.maps.event.trigger(markers[markerNum], 'click');
}
};
}
function searchLocations() {
var address = document.getElementById("addressInput").value;
var geocoder = new google.maps.Geocoder();
geocoder.geocode({address: address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
searchLocationsNear(results[0].geometry.location);
} else {
alert(address + ' not found');
}
});
}
function clearLocations() {
infoWindow.close();
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(null);
}
markers.length = 0;
locationSelect.innerHTML = "";
var option = document.createElement("option");
option.value = "none";
option.innerHTML = "See all results:";
locationSelect.appendChild(option);
}
function searchLocationsNear(center) {
clearLocations();
var radius = document.getElementById('radiusSelect').value;
var searchUrl = 'storelocator.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
downloadUrl(searchUrl, function(data) {
var xml = parseXml(data);
var markerNodes = xml.documentElement.getElementsByTagName("marker");
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markerNodes.length; i++) {
var name = markerNodes[i].getAttribute("name");
var address = markerNodes[i].getAttribute("address");
var distance = parseFloat(markerNodes[i].getAttribute("distance"));
var hours = markerNodes[i].getAttribute("hours");
var phone = markerNodes[i].getAttribute("phone");
var latlng = new google.maps.LatLng(
parseFloat(markerNodes[i].getAttribute("lat")),
parseFloat(markerNodes[i].getAttribute("lng")));
createOption(name, distance, i);
createMarker(latlng, name, address, hours, phone);
bounds.extend(latlng);
}
map.fitBounds(bounds);
locationSelect.style.visibility = "visible";
locationSelect.onchange = function() {
var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
google.maps.event.trigger(markers[markerNum], 'click');
};
});
}
function createMarker(latlng, name, address, hours, phone) {
var html = "<b>" + name + "</b> <br/>" + address+"</b> <br/>" + hours+"</b> <br/>" +phone;
var marker = new google.maps.Marker({
map: map,
position: latlng
});
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
markers.push(marker);
}
function createOption(name, distance, num) {
var option = document.createElement("option");
option.value = num;
option.innerHTML = name + "(" + distance.toFixed(1) + ")";
locationSelect.appendChild(option);
}
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.responseText, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function parseXml(str) {
if (window.ActiveXObject) {
var doc = new ActiveXObject('Microsoft.XMLDOM');
doc.loadXML(str);
return doc;
} else if (window.DOMParser) {
return (new DOMParser).parseFromString(str, 'text/xml');
}
}
function doNothing() {}
Can someone point me into where to look into that. TIA