Simple Google Maps API v3 integration in CoffeeScript, with non-JS Static Maps fallback

application.js.coffee

#= require jquery
#= require jquery_ujs
#= require lib/modernizr
#= require lib/jquery.lettering
#= require_tree .

$ ->
  $('*[data-googlemap]').googleMap()
  true

map.html.erb

<section class="location">
  <%= google_map_tag id: "wedding_map", address: "285 S Rochester Rd, Oakland, MI 48363", zoom: 13, mark_center: true, width: 500 %>
</section>

maps.js.coffee

$.fn.googleMap = () ->
  element = $(this).get(0)
  zoomLevel = $(this).data('zoom') || 8

  if $(this).data('size')
    [width, height] = $(this).data('size').split('x')
    $(this).css({width: Number(width), height: Number(height), background: '#fff'})

  wrapperElem = $(this).wrap('<div class="map-wrap"/>').css({background:'#fff'})
  $(this).hide() # To avoid confusing Flash Of Non-interactive Map Content

  geocoder = new google.maps.Geocoder
  geocoderParams =
    address: $(this).data('address') || "1461 North Opdyke Road, Auburn Hills, MI, United States, 48326-2680"
    region: "US"
  results = geocoder.geocode geocoderParams, (results, status) ->
    if status == google.maps.GeocoderStatus.OK
      latlng = results[0].geometry.location

      mapOptions =
        mapTypeControl: false
        overviewMapControl: false
        zoom: zoomLevel
        center: latlng
        mapTypeId: google.maps.MapTypeId.ROADMAP

      map = new google.maps.Map(element, mapOptions)

      marker = new google.maps.Marker
        position: latlng
        map: map

      $(element).show() # Time to re-show the element

maps_helper.rb

module MapsHelper

  def map_locations
    {
      ddjw:  [41.9151097, -87.70237789999],
      hotel: [42.662645, -83.248014000],
      hotel_center: [42.67387866, -83.23805764]
    }
  end

  def google_map_tag(options={})
    options.reverse_merge!(width: 600, height: 300, mark_center: true, zoom: 10)
    static_map_tag = image_tag(static_map_url(options), width: options[:width], height: options[:height], alt: "Map for #{options[:address]}")
    content_tag(:div, static_map_tag, id: options[:id],
      data: {
        googlemap: true,
        size: "#{options[:width]}x#{options[:height]}",
        address: options[:address],
        marker: true,
        zoom:   options[:zoom]
      }
    ).html_safe
  end

  def static_map_url(options)
    map_params = [].tap do |p|
      p << ["size",    "#{options[:width]}x#{options[:height]}"]
      p << ["zoom",    options[:zoom]]
      p << ["center",  options[:address]]
      p << ["markers", options[:address]] if options[:mark_center]
      p << ["maptype", "roadmap"]
      p << ["sensor",  "false"]
    end

    "http://maps.google.com/maps/api/staticmap?" + map_params.map { |p| k,v=*p; "#{k}=#{CGI.escape(v.to_s)}"  }.join("&")
  end

end