Reputation: 627
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
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