Zobrazení všech markerů na google map – JavaScript, AJAX, jQuery – Fórum – Programujte.com

Zdravím,

mám prosbičku. Dělám takový store locator v gmap v3. Mám db, vyhledávání u mapy, boční panel kde se vypisují nalezené lokality, vše funguje. Nedaří se mi ale načíst všechny markery z xml po načtení mapy.

Díky za rady.

Pro lepší orientaci tady je js:

//<![CDATA[
 

google.maps.Map.prototype.markers = new Array();
google.maps.Map.prototype.getMarkers = function() {
return this.markers
};
google.maps.Map.prototype.clearMarkers = function() {
for ( var i = 0; i < this.markers.length; i++) {
  this.markers[i].setMap(null);
}
this.markers = new Array();
};
google.maps.Marker.prototype._setMap = google.maps.Marker.prototype.setMap;
google.maps.Marker.prototype.setMap = function(map) {
if (map) {
  map.markers[map.markers.length] = this;
}
this._setMap(map);
}

var map;
var geocoder;
var lastinfo;

function GMapInit() {
var latlng = new google.maps.LatLng(49.60092, 17.251225);
geocoder = new google.maps.Geocoder();
var myOptions = {
  zoom : 6,
  center : latlng,
  mapTypeId : google.maps.MapTypeId.ROADMAP,
  navigationControl : true,
  mapTypeControl : true,
  scaleControl : true
}

map = new google.maps.Map(document.getElementById('GMap'), myOptions);
document.getElementById('addressInput').focus()
document.getElementById('addressInput').select()
/*
  * map.addControl(new GLargeMapControl()); map.addControl(new
  * GMapTypeControl());
  */

  
  
 
  
}

function searchLocationsOnEnter(myfield, e, pageroot) {
var keycode;
if (window.event)
  keycode = window.event.keyCode;
else if (e)
  keycode = e.which;
else
  return true;

if (keycode == 13) {
  searchLocations(pageroot);
  return false;
} else {
  return true;
}
}

function searchLocations(pageroot) {
var address = document.getElementById('addressInput').value;
geocoder.geocode( {
  'address' : address
}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
   searchLocationsNear(address, results[0].geometry.location, pageroot);
  } else {
   alert(status);
  }
});
}

function searchLocationsNear(saddr, center, pageroot) {
var radius = document.getElementById('radiusSelect').value;
var searchUrl = pageroot + '/components/com_locationfinder/phpsqlsearch_genxml.php?lat='
   + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
map.clearMarkers();
LoadXML(searchUrl, 'markers', function(element, xml) {
  var markers = xml[0].getElementsByTagName('marker');
 

  var sidebar = document.getElementById('GMsidebar');
  sidebar.innerHTML = '';
  if (markers.length == 0) {
   map.setCenter(center, 7);
   sidebar.innerHTML = 'Žádný záznam nenalezen.';
   return;
  }
 

 

  var bounds = new google.maps.LatLngBounds();
  for ( var i = 0; i < markers.length; i++) {
   var point = new google.maps.LatLng(parseFloat(markers[i]
     .getAttribute('lat')), parseFloat(markers[i]
     .getAttribute('lng')));

   var marker = createMarker(saddr, point, markers[i]);
   var sidebarEntry = createSidebarEntry(marker, markers[i]);
  
  
   sidebar.appendChild(sidebarEntry);
  
  
   bounds.extend(point);
     
  }
  map.fitBounds(bounds);

  document.getElementById('addressInput').select();
  document.getElementById('addressInput').focus();
 
 
 
 
});
}

function createMarker(saddr, point, xml) {
var name = xml.getAttribute('name');
var addr1 = xml.getAttribute('addr1');
var addr2 = xml.getAttribute('addr2');
var country = xml.getAttribute('country')
var phone = xml.getAttribute('phone');
var url = xml.getAttribute('url');
var email = xml.getAttribute('email');
var desc = xml.getAttribute('desc');
var address = xml.getAttribute('address');
var html = '<div class="marker"><div class="left">'
            + ( name ? '<div class="name"><h3>' + name  + '</h3></div>' : '' )
            + ( addr1 ? '<p>' + addr1 + '<br />' + addr2 + '<br />' + country + '</p>' : '' )
         /* + addline(addr2)
            + addline(country)
            + ( phone ? '<div class="phone">' + phone + '</a></div>' : '')
            + ( email ? '<div class="email"><a rel="nofollow" href="mailto:' + email + '">' + email + '</a></div>' : '')*/
            + '<div class="directions"><a rel="nofollow" href="http://maps.google.com/maps?saddr=' + escape(saddr)
            + '&amp;daddr=' + escape(address) + '" target="_blank">'
            + 'Najít trasu</a>'
            + ( url ? '<div class="detail"><a rel="nofollow" href="' + url + '">Detail</a></div>' : '')
            + '</div></div><div class="right">'
            /*+ ( desc ? '<div class="description">' + desc + '</div>' : '')*/
           
            + '</div></div>';
           
      //var shadow = new google.maps.MarkerImage('',
      // Stín obrázku je ve větší v horizontální dimenzi
      // zatímco pozice a posun jsou stejné jako pro hlavní obraz.
      //new google.maps.Size(37, 32),
      //new google.maps.Point(0,0),
      //new google.maps.Point(12, 12));
     
      //var shape = {
      //coord: [1, 1, 1, 20, 18, 20, 18 , 1],
      //type: 'poly'
      //};

         
           
var marker = new google.maps.Marker( {
  position : point,
  map : map,
  title : name,
  clickable : true,
  icon: 'http://www.nydre.com/=xx/images/icon.png',
});

var info = new google.maps.InfoWindow( {
  content : html,
 
});


  
google.maps.event.addListener(marker, 'click', function() {
  if (lastinfo) {
   lastinfo.close();
  
  }
  info.open(map, marker);
  lastinfo = info;
});
return marker;
}

//funkce na výpis bočního panelu

function createSidebarEntry(marker, xml) {
var name = xml.getAttribute('name');
var addr1 = xml.getAttribute('addr1');
var addr2 = xml.getAttribute('addr2');
var country = xml.getAttribute('country')
var phone = xml.getAttribute('phone');
var url = xml.getAttribute('url');
var email = xml.getAttribute('email');
var desc = xml.getAttribute('desc');
var distance = parseFloat(xml.getAttribute('distance'));
var address = xml.getAttribute('address');

var div = document.createElement('div');
var html = '<b>' + name + '</b>'
                 + addline(addr1)
                 + addline(addr2)
                 + addline(country)
                 //+ ( phone ? '<br /><div class="phone">Tel:' + phone + '</div>' : '' )
                 //+ ( email ? '<a rel="nofollow" href="mailto:' + email + '">Email:&nbsp;' + email + '</a>' : '')
                 //+ ( url ? '<br /><a rel="nofollow" href="' + url + '" target="_blank">Web:&nbsp;' + url + '</a>' : '')
                
                 ;
div.className = 'sidebar mouseout';
div.innerHTML = html;


google.maps.event.addDomListener(div, 'click', function() {
 
    google.maps.event.trigger(marker, 'click');
     
  }); 

google.maps.event.addDomListener(div, 'mouseover', function() {
  div.className = 'sidebar mouseover';
 
});

google.maps.event.addDomListener(div, 'mouseout', function() {
  div.className = 'sidebar mouseout';
 
});


 
return div;
}

function LoadXML(url, element, runfunc) {
// pro nativní XMLHttpRequest objekty
if (window.XMLHttpRequest) {
  var req = new XMLHttpRequest();
  req.onreadystatechange = processReqChange;
  req.open("GET", url, true);
  req.send(null);
  // pro IE/Windows ActiveX verzi
} else if (window.ActiveXObject) {
  var req = new ActiveXObject("Microsoft.XMLHTTP");
  if (req) {
   req.onreadystatechange = processReqChange;
   req.open("GET", url, true);
   req.send();
  }
}

function processReqChange() {
 
  if (req.readyState == 4) {
  
   if (req.status == 200) {
    runfunc(element, req.responseXML.getElementsByTagName(element));
   } else {
    alert("Nějaký problém XML data:\n"
      + req.statusText);
   }
  }
}
}

function addline(st) {
    return ( st ? '<div>' + st + '</div>' : '');
}

// ]]>