Search Results

Search found 3 results on 1 pages for 'abemonkey'.

Page 1/1 | 1 

  • Google maps API V3 code to V2 help.

    - by abemonkey
    I've started working on a project to inject markers into a map with jQuery by looping through rows on a table in the page. After getting it working I realized that I was accessing the V3 API and using V3 syntax. I've been beating my head against a wall trying to get this working in google maps API V2. If someone could please take a look at my code and help that would be great! Thanks! You can see my little test in action at www.axtsweapons.com/maptest.html. Here is the JS code: <script type="text/javascript"> $(function() { var latlng = new google.maps.LatLng(45.440000,-122.630000); var settings = { zoom: 12, center: latlng, disableDefaultUI: false, mapTypeControl: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 bounds = new google.maps.LatLngBounds(); 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.close(); infowindow.open(map, the_marker); }); }); }); </script>

    Read the article

  • Need help writing jQuery to loop through table and inject markers into google map?

    - by abemonkey
    I am new to jQuery. I've done some simple things with it but what I am attempting now is a over my head and I need some help. I am building a locator for all the firearms dealers in the US for a client. I am working within Drupal. I have a proximity search by zip code that works great. If you search by zip a list of paginated results shows up in an html table that can by paged through via ajax. I would like a map to be above this list with markers corresponding to the names and addresses being listed. I already have all the lat and long values in the table results. I want the script to update the markers and automatically zoom to fit the markers in the view when a user changes the sort order of the table or pages through the results. Also, I'd like to have a hover highlight effect over the rows of the table that simultaneously highlight the corresponding marker, and have a click on the table row equal a click on a marker that pops up a marker info window to be populated using jQuery to read the name and address fields of the table. Hope this all makes sense. I know I'm putting a lot out there, I'm not asking for someone to write the whole script, just wanted to give as many details as possible. Thanks for any help. I'm just lost when it comes to looping and moving data around. If you want to check out what I have so far on the project please visit: www.axtsweapons.com and login with the username: "test" and the password: "1234" and then visit this direct link: www.axtsweapons.com/ffllocator. For just a simple page that would be easy to manipulate and play with goto: http://www.axtsweapons.com/maptest.html Thanks!

    Read the article

  • Set bounds for markers generated by jQuery table loop?

    - by abemonkey
    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); }); }); }); `

    Read the article

1