user1738017
user1738017

Reputation: 627

Google map marker loop only showing first iteration

I've used the code from this: http://jsfiddle.net/ErYub/

But changed it to pull records from my database:

#{ 
(Datacentre.find(:all, :conditions => "longitude != false").map do |d|

"var latLng = new google.maps.LatLng(#{d.latitude}, #{d.longitude})
   marker#{d.id} = new MarkerWithLabel({
     position: latLng,
     draggable: false,
     map: map,
     icon: {url:'/assets/icon_red.png'}

   });

    markers.push(marker#{d.id});

  makeDiv(#{d.id}, 15, 'Marker #');
   google.maps.event.addListener(markers[#{d.id}], 'click', function(e) {
  infowindow.setContent('Marker postion: '  + this.getPosition());
  infowindow.open(map, this);});

"end).join

}


  var clusterOptions = { zoomOnClick: false }
  var markerCluster = new MarkerClusterer(map, markers, clusterOptions);
  globalMarker = markers.slice();
  google.maps.event.addListener(markerCluster, 'clusterclick', function(cluster) {
  var content = '';

var info = new google.maps.MVCObject;
info.set('position', cluster.center_);


var markers = cluster.getMarkers();

var titles = "";
#{ 
(Datacentre.find(:all, :conditions => "longitude != false AND reference != ''").map do |d|

"titles = markers[#{d.id}].labelContent + "\n";
"end).join

}

the code that is shown in the browser looks how i'd expect it to, yet only the first marker is show and the info box doesn't appear.

Generated Code

function initialize() {
var center = new google.maps.LatLng(45.4214, -75.6919);
map = new google.maps.Map(document.getElementById('map'), {
zoom: 3,
center: center,
disableDoubleClickZoom: true,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var markers = [];
var infowindow = new google.maps.InfoWindow();
var latLng = new google.maps.LatLng(50.72385, -1.90664)
marker1 = new MarkerWithLabel({
position: latLng,
draggable: false,
map: map,
icon: {url:'/assets/icon_red.png'}
});
markers.push(marker1);
makeDiv(1, 15, 'Marker #');
google.maps.event.addListener(markers[1], 'click', function(e) {
infowindow.setContent('Marker postion: ' + this.getPosition());
infowindow.open(map, this);});
var latLng = new google.maps.LatLng(52.04062, -0.75942)
marker6 = new MarkerWithLabel({
position: latLng,
draggable: false,
map: map,
icon: {url:'/assets/icon_red.png'}
});
markers.push(marker6);
makeDiv(6, 15, 'Marker #');
google.maps.event.addListener(markers[6], 'click', function(e) {
infowindow.setContent('Marker postion: ' + this.getPosition());
infowindow.open(map, this);}); 

ETC

var titles = "";
;
;
;
;
;
;
;
;
;

Upvotes: 0

Views: 488

Answers (1)

lintu
lintu

Reputation: 1102

Error i think is in this line(here is an error)

google.maps.event.addListener(markers[1], 'click', function(e) {
 //markers[0] contains the marker. not markers[1]
 //the same applies in place of markers[6] also. it is markers[1]

Upvotes: 1

Related Questions