Set bounds for markers generated by jQuery table loop?
Posted
by abemonkey
on Stack Overflow
See other posts from Stack Overflow
or by abemonkey
Published on 2010-04-27T22:56:42Z
Indexed on
2010/04/27
23:13 UTC
Read the original article
Hit count: 186
I have some jQuery code that goes through a table of location results and puts corresponding pins on a map. I am having trouble figuring out how to set the bounds so that when it goes through the loop and generates the markers on the map that it zooms and pans to fit the markers in the view. I've tried implementing code from some similar questions on this site but nothing seems to be working. Please let me know what code I should be using and where the heck I should put it in my script:
$(function() {
var latlng = new google.maps.LatLng(44, 44);
var settings = {
zoom: 15,
center: latlng,
disableDefaultUI: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), settings);
$('tr').each(function(i) {
var the_marker = new google.maps.Marker({
title: $(this).find('.views-field-title').text(),
map: map,
clickable: true,
position: new google.maps.LatLng(
parseFloat($(this).find('.views-field-latitude').text()),
parseFloat($(this).find('.views-field-longitude').text())
)
});
var infowindow = new google.maps.InfoWindow({
content: $(this).find('.views-field-title').text() +
$(this).find('.adr').text()
});
new google.maps.event.addListener(the_marker, 'click', function() {
infowindow.open(map, the_marker);
});
});
});
`
© Stack Overflow or respective owner