LearningRoR
LearningRoR

Reputation: 27192

How to connect Google Maps to my tables or resources

i wanted to know if this is even possible. I'm trying to figure out how to connect a resource to the Google Maps API. I am trying to do something like Yelp. This is what i mean:

  1. Users add Dogs(name) and the weight (number)
  2. Users type in location ( or near) to bring up results just like using Google Search.
  3. Users verify address and then they can click Done, thus adding where the dog is located, name and weight and my application checks for all validations or the presence of the 3 parts needed.

So can anyone please help a RoR newbie out? Tips, tricks, other methods of doing this and guides would be great. I looked at the Google API but wasn't exactly sure where to start. if you need more information let me know!

Thank you!

P.S. Here is the first way i had in mind how to do this:

Users add Dog name and weight ------> then Users find location by Ajax search bar in my page -----> click to submit that it is the correct location and it places a Marker ----> Users click done and it saves Marker on site along with a remembering the Marker for the specific Dog/weight.

Upvotes: 0

Views: 1025

Answers (2)

scradge
scradge

Reputation: 146

You can pass your rails variables into javascript making it fairly easy to create markers to add to a Google map. You do this by using the embedded ruby like var lat = <%= dog.lat %>;.

Here is some code to get you started:

<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript"> 
  var map;
  var markersArray = [];

function initialize() {
  var start = new google.maps.LatLng(0, -73.15);
  var mapOptions = {
    zoom: 1,
    center: start,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  };
  map = new google.maps.Map(document.getElementById("map_canvas"),
    mapOptions);
  markerFromDB();
}

function markerFromDB() {
<% dogs.each do |pin| %>
    var lat = <%= pin.lat %>;
    var lon = <%= pin.lon %>;
    addMarker(lat, lon, gbid);
<%end%>
}

function addMarker(lat, lon) {
  var marker = new google.maps.Marker({
  map: map,
      position: new google.maps.LatLng(lat, lon)
  });
  markersArray.push(marker);
}

// Initialize map on window loading
google.maps.event.addDomListener(window, 'load', initialize);

</script>

Remember that the google maps is just an "image" of sorts and that every time you modify your database and the page reloads your map will be redrawn matching your database.

Upvotes: 2

Trott
Trott

Reputation: 70055

Have you checked the Google-Maps-For-Rails project? Not sure if it does exactly what you need, but it would seem like the place to look first. https://github.com/apneadiving/Google-Maps-for-Rails

Additionally, you could do worse than start off by watching http://www.youtube.com/watch?v=OvpcnRzkzuE. Starting at 6:35 into the video, the presenter starts showing how to write an app that will allow people to create and rank coffee shops on a Google Map. This sounds not unlike what you are trying to achieve. No Ruby on Rails content in the talk, but if you're trying to figure out where to start with Google Maps API, then it should be helpful.

Upvotes: 2

Related Questions