Quick & Dirty Geolocation ...en Rails

Presentation.md

#Quick & Dirty Geolocation ...en Rails

¿Qué necesitamos?

• Rails app

$ rails new geostore

• gemas: geocoder y gmaps4rails

Primeros pasos

• Agregar campos para ubicación en nuestro modelo

attr_accessor :address, :city, :state, :zip, :country

• Agregar método que combine los campos de ubicación y regrese un string

def full_address
  [address, city, state, zipcode, country].compact.join(', ')
end

geocoder

Facilita estos métodos:

request.ip
#=> "201.171.235.87"
request.location.city
#=> "Ensenada"
request.location.country
#=> "Mexico"
Modelo.near("location", distance)
#=> [ ]

Implementando en el modelo:

class Modelo
  geocoded_by :full_address
  #hook
  after_validation :geocode
end

gmaps4rails

• Implementar en el modelo:

acts_as_gmappable :address => :full_address, :check_process => false

• Cargamos javascripts en el proyecto
• Creamos instancia de nuestra coleccion en formato json

@model_json = Modelo.all.to_gmaps4rails

• Customizamos infowindow

def gmaps4rails_infowindow
  # contenido html que queremos al hacer click
  # en los marcadores, ejemplo:
  # "<strong>Nombre</strong><br />
  # 1200 First St.<br />Springfield, OR, 99999, US"

  infowindow = "<strong>#{name}</strong><br />#{address}<br />"
  infowindow << [ city, state, zipcode, country ].compact.join(', ')
  return infowindow
end

Dibujamos mapa

• básico:

<%= gmaps4rails(@model_json) %>

peeeeero... rara vez el default resuelve nuestros requerimientos.

Customizando mapa

requerimientos

• mapa debe centrarse en la ubicación de la ip si no hay parámetro de búsqueda

• mapa debe centrarse en el parámetro de búsqueda si lo hay

• solo debe dibujar los marcadores que se encuentren:

  • 20 millas a la redonda de la ubicación de la ip si no hay parámetro de búsqueda
  • N millas a la redonda (definido por el usuario) si hay parámetros de búsqueda

entonces

gmaps(
  "map_options" => {
  "center_latitude" => latitude,
  "center_longitude" => longitude,
  "auto_adjust" => true,
  "auto_zoom" => true
  },
  "markers" => { "data" => results_json }
)

Muéstranos código

https://github.com/antillas21/geostore

App en vivo

http://antillasgeostore.herokuapp.com/