gmaps4rails

[Juan José Ramírez Gónzalez]

El ejemplo es el siguiente:

Genere un nuevo proyecto llamdo gmapsRails

rails new gmapsRails

Dentro de la carpeta del proyecto modifique el archivo Gemfile agregando las siguientes líneas 

gem 'gmaps4rails', '~> 2.0.4'
gem 'geokit-rails'

 y luego ejecute

bundle install

Dado que en mi versión de rails no existe la gema geokit-rails  (mi versión es la 4.0.1) prosegui con lo siguiente:

rake db:create
rails g scaffold Direcciones address:string latitude:float longitude;float gmaps:boolean
rake db:migrate

con lo cual genero mi base de datos, el cntrolador y las acciones CRUD para la tabla correspondiente (Direccione)

 

Lo siguiente es 

rails g gmaps4rails:install

En este punto, si les marca un error al aplicar el comando anterior, por no conecer la accion generate para la gema

lo resolvemos copiando los archivos que necesitamos de la siguiente manera

rails g gmaps4rails:copy_js
rails g gmaps4rails:copy_coffee

agregamos el archivo underscore.js (el cual les adjunto y que pueden obtener  de la págna: underscorejs.org/) 

en la carpeta app/assets/javascripts

y agregamos  las siguientes lineas al archivo application.js en la misma carpeta

//= require underscore
//= require gmaps/google

Agregamos las siguientes lineas en nuestro archivo app/views/layouts/application.html.erb

NOTA:para el uso de direcciones necesitan revisar lo siguiente:
https://developers.google.com/maps/documentation/geocoding/index?hl=es

https://developers.google.com/maps/documentation/javascript/geocoding?hl=es

<!-- aqui va el resto del código del archivo -->
<%= yield %>



<%= yield :scripts %>
<!-- Bibliotecas específicas de google maps que usaremos, si van a trabajar con direcciones les recomiendo cargar google maps geocoder -->
<script src="//maps.google.com/maps/api/js?v=3.13&amp;sensor=false&amp;libraries=geometry" type="text/javascript">
</script>
<script src='//google-maps-utility-library-v3.googlecode.com/svn/tags/markerclustererplus/2.0.14/src/markerclusterer_packed.js' type='text/javascript'>
</script>


<!-- mediante este script agregaremos los markers que vamos a procesar-->
<script>


handler = Gmaps.build('Google');
handler.buildMap({ provider: {}, internal: {id: 'map'}}, function(){


//marker por defecto, en caso de que no agreguems uno nosotros
markers = handler.addMarkers([
    {
      "lat": 19.323734,
      "lng": -99.178971,
      "infowindow": "Zocalo capitalino, Marca por defecto"
    }]);


// los markers que agregaremos lo haremos mediante esta línea
markers = handler.addMarkers(<%=raw @hash.to_json %>);
 
  handler.bounds.extendWith(markers);
  handler.fitMapToBounds();
});
</script>


</body>

Ahora, dentro de direcciones_controller.rb modificamos el método index:

 
  def index
    #se obtiene todas las direcciones
    #esta parte del código rails previamente la generó con el scaffold
    @direcciones = Direccione.all


    #obtenemos auellos registros donde gmaps=true
    #en clase les explique por que estan comentados
    #al descomentar estas lineas hay que comentar el siguiente @hash
    #@hash = Gmaps4rails.build_markers(
    # @direcciones.where(:gmaps=> true)) do |dir, marker|


    #procesamos todos los registros.
      @hash = Gmaps4rails.build_markers(@direcciones) do |dir, marker|
     #agregamos latitud, longitud, y descripción
    marker.lat dir.latitude
    marker.lng dir.longitude
    marker.infowindow  dir.address
    end
  end

por último  en  app/views/direcciones/index.html.erb agregamos al final lo siguiente

<div style='width: 800px;'>
  <div id="map" style='width: 800px; height: 600px;'></div>
</div>

después de todo lo anterior, ejecuten en la terminal

rails server

y, mediante un navegador, ingresen a 

localhost:3000/Direcciones

referencia principal:

http://www.slideshare.net/Alecsnder/google-maps-para-rails

https://github.com/apneadiving/Google-Maps-for-Rails/

http://andyglassblog.wordpress.com/2012/07/06/google-maps-for-rails-with-gmaps4-rails-tutorial-on-how-to-post-and-filter-locations/

podrian checar también

https://github.com/alexreisner/geocoder

https://www.ruby-toolbox.com/categories/geocoding___maps