Super-simple Google Maps

map.html.slim

= javascript_include_tag "http://maps.googleapis.com/maps/api/js?sensor=false"

#map style="height: 500px;"

javascript:
  var pings = #{@pings.to_json(root: false).html_safe};

  $(document).ready( function() {
    var mapOptions = {
      zoom: 13,
      center: new google.maps.LatLng(37.7750, -122.4183),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map($("#map")[0], mapOptions)

    for (var i in pings) {
      var ping = pings[i];
      var marker = new google.maps.Marker({
          position: new google.maps.LatLng(ping.lat, ping.lng),
          title: ping.created_at
      });

      // To add the marker to the map, call setMap();
      marker.setMap(map);
    }

  })