Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

What can I incorporate into my current code below to offset markers, as markers at the same address don't show.

Here's example

UPDATE: I've changed the way the map works by running it from a database.

   <script type="text/javascript">

    var customIcons = {
      restaurant: {
        icon: '',
        shadow: ''
      bar: {
        icon: '',
        shadow: ''

    function load() {
      var cluster = [];
      var map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(53.4788, -3.9551),
        zoom: 6,
        mapTypeId: 'roadmap'
var infowindow = new google.maps.InfoWindow();

      // Change this depending on the name of your PHP file
      downloadUrl("<?php bloginfo('stylesheet_directory'); ?>/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(
          var html = "<b>" + name + "</b> <br/>" + address;
          var icon = customIcons[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            shadow: icon.shadow
          google.maps.event.addListener(marker, 'click', (function(marker, i) {
                        return function() {
                  , marker);
                    })(marker, i));
        var mc = new MarkerClusterer(map,cluster);

    function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);, 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);
      };'GET', url, true);

    function doNothing() {}

share|improve this question

add your 'get_posts(array' to the var markers for the MarkerCluster Manager to build the dynamic marker.

var center = new google.maps.LatLng(37.4419, -122.1419);
var options = {
  'zoom': 13,
  'center': center,
  'mapTypeId': google.maps.MapTypeId.ROADMAP

var map = new google.maps.Map(document.getElementById("map"), options);

var mcOptions = {gridSize: 50, maxZoom: 15};
var markers = [...]; // Create the markers you want to add and collect them into a array.
var mc = new MarkerClusterer(map, markers, mcOptions);


V3 ClusterMarker Reference

share|improve this answer
I've changed the way the map generates (i.e from a database) but obviously the same problem still exists. I've updated my question with the new code. – Rob Jun 20 '12 at 11:20
Once you've obtained an array of your markers (it's not important how they are fetched) then pass them to the marker clusterer, as in the last line of code above. – Stephen Lead Aug 19 '12 at 23:18
MarkerClusterer won't solve this issue, because MarkerClusterer is intended for Markers that don't share the same lat/long. – Gady Oct 8 '12 at 23:02

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.