I am using the Google Maps Store Locator and I have set up a second DB
table to display a seperate set of stores within the same map. Whats
missing is the 'marker' for some reason. Below is my map.php code
which works in displaying the contents of two different DB tables in
seperate sidebar boxes
How can I make it so the pin works?
//<![CDATA[
var map;
var geocoder;
var featured;
function load() {
if (GBrowserIsCompatible()) {
geocoder = new GClientGeocoder();
map = new GMap2(document.getElementById('map'));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(40.178873,2.8125), 2);
}
}
function searchLocations() {
var address = document.getElementById('addressInput').value;
geocoder.getLatLng(address, function(latlng) {
if (!latlng) {
alert(address + ' not found');
} else {
searchLocationsNear(latlng);
}
});
}
function searchLocationsNear(center) {
var radius = document.getElementById('radiusSelect').value;
var searchUrl = 'phpsqlsearch_genxml2.php?lat=' + center.lat() +
'&lng=' + center.lng() + '&radius=' + radius;
GDownloadUrl(searchUrl, function(data) {
var xml = GXml.parse(data);
featured = xml.documentElement.getElementsByTagName('marker');
map.clearOverlays();
var sidebar = document.getElementById('sidebar2');
sidebar.innerHTML = '';
if (featured.length == 0) {
document.getElementById('alert_div').innerHTML = "<a>No
Results found</a>";
document.getElementById('alert_div').style.display = 'block';
map.setCenter(new GLatLng(40.178873,2.8125), 2);
return;
}
showSidebar();
var limitsearch = document.getElementById('limitsearch').value;
var bounds = new GLatLngBounds();
if (limitsearch <= featured.length){
for (var i = 0; i < limitsearch; i++) {
var name = featured[i].getAttribute('name');
var phone = featured[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = featured[i].getAttribute('address');
var distance =
parseFloat(featured[i].getAttribute('distance'));
var point = new
GLatLng(parseFloat(featured[i].getAttribute('lat')),
parseFloat(featured[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name,
address, distance);
sidebar.appendChild(sidebarEntry);
bounds.extend(point);
}}
else{
for (var i = 0; i < featured.length; i++) {
var name = featured[i].getAttribute('name');
var phone = featured[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = featured[i].getAttribute('address');
var distance =
parseFloat(featured[i].getAttribute('distance'));
var point = new
GLatLng(parseFloat(featured[i].getAttribute('lat')),
parseFloat(featured[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name,
address, distance);
sidebar.appendChild(sidebarEntry);
bounds.extend(point);
}
}
map.setCenter(bounds.getCenter(),
map.getBoundsZoomLevel(bounds));
showSidebar();
getAlert();
});
var searchUrl = 'phpsqlsearch_genxml.php?lat=' + center.lat() +
'&lng=' + center.lng() + '&radius=' + radius;
GDownloadUrl(searchUrl, function(data) {
var xml = GXml.parse(data);
featured = xml.documentElement.getElementsByTagName('marker');
map.clearOverlays();
var sidebar = document.getElementById('sidebar');
sidebar.innerHTML = '';
if (featured.length == 0) {
document.getElementById('alert_div').innerHTML = "";
document.getElementById('alert_div').style.display = 'none';
map.setCenter(new GLatLng(40.178873,2.8125), 2);
return;
}
showSidebar();
var limitsearch = document.getElementById('limitsearch').value;
var bounds = new GLatLngBounds();
if (limitsearch <= featured.length){
for (var i = 0; i < limitsearch; i++) {
var name = featured[i].getAttribute('name');
var phone = featured[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = featured[i].getAttribute('address');
var distance =
parseFloat(featured[i].getAttribute('distance'));
var point = new
GLatLng(parseFloat(featured[i].getAttribute('lat')),
parseFloat(featured[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name,
address, distance);
sidebar.appendChild(sidebarEntry);
bounds.extend(point);
}}
else{
for (var i = 0; i < featured.length; i++) {
var name = featured[i].getAttribute('name');
var phone = featured[i].getAttribute('phone');
if (phone == 0){phone = '';}
var address = featured[i].getAttribute('address');
var distance =
parseFloat(featured[i].getAttribute('distance'));
var point = new
GLatLng(parseFloat(featured[i].getAttribute('lat')),
parseFloat(featured[i].getAttribute('lng')));
var marker = createMarker(point, name, address);
map.addOverlay(marker);
var sidebarEntry = createSidebarEntry(marker, phone, name,
address, distance);
sidebar.appendChild(sidebarEntry);
bounds.extend(point);
}
}
map.setCenter(bounds.getCenter(),
map.getBoundsZoomLevel(bounds));
showSidebar();
getAlert();
});
}
function setLimit(limit){
document.getElementById('limitsearch').value = limit;
}
function createMarker(point, name, address) {
var marker = new GMarker(point);
var html = '<b>' + name + '</b> <br/>' + address;
GEvent.addListener(marker, 'click', function() {
marker.openInfoWindowHtml(html);
});
return marker;
}
function getAlert(){
var markerlen = featured.length;
var limitset = document.getElementById('limitsearch').value;
if (markerlen <= limitset) {
var alert = "<a>Found "+markerlen+"</a> results";
document.getElementById('alert_div').innerHTML = alert;
document.getElementById('alert_div').style.display = 'block';
}
else{
var alert = "<a>Found "+markerlen+"</a> results (showing 20). </
a><a id='showAllLink' onclick='setLimit("+markerlen
+");searchLocations()'>Click here to view all</a>";
document.getElementById('alert_div').innerHTML = alert;
document.getElementById('alert_div').style.display = 'block';
}
}
function createSidebarEntry(marker, phone, name, address,
distance) {
var div = document.createElement('div');
var html = '<b>' + name + '</b> <a class="distance">(' +
distance.toFixed(1) + ' km)</a> <br/>' + address + '<br />' + 'Tel.:'
+ phone;
div.innerHTML = html;
div.style.cursor = 'pointer';
div.style.width = '247px';
div.className = 'list_left';
div.style.marginBottom = '5px';
GEvent.addDomListener(div, 'click', function() {
GEvent.trigger(marker, 'click');
});
return div;
}
function showSidebar(){
document.getElementById('sidebar').style.display = 'block';
document.getElementById('sidebar_td').style.display = 'block';
document.getElementById('map').style.width = '600px';
}
//]]>
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
