title: Google Map v3 not rendering using backbone
body: <p>Using backbone in a Ruby on Rails app, I call the API loader in application.html.erb:</p>
  
  <pre><code>&lt;head&gt;
   &lt;title&gt;TrailBlazer&lt;/title&gt;
    &lt;script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBl2bJ7tGHzHEz_7o4nNl_rXKitL4xpMEQ&amp;sensor=false"&gt;&lt;/script&gt;
    &lt;%= javascript_include_tag "application" %&gt;
    &lt;%= stylesheet_link_tag    "application", media: "all", "data-turbolinks-track" =&gt; true %&gt;
    &lt;%= csrf_meta_tags %&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>Then my Map Model:</p>
  
  <pre><code>var Map = Backbone.Model.extend({
    defaults: {
    zoom: 5
   },
  
  initialize: function(){
      console.log("map model loaded");
      this.center = new google.maps.LatLng(40.612732, -75.912438);
      this.mapTypeId = google.maps.MapTypeId.TERRAIN;
  //plots coordinates for Polyline
      this.shelterCoordinates = [
        new google.maps.LatLng(34.62673, -84.193656),
        new google.maps.LatLng(34.7398, -83.9369),
        new google.maps.LatLng(35.035482, -83.537977),
        new google.maps.LatLng(35.55, -83.5) 
      ];
    }
  });
  </code></pre>
  
  <p>and finally my Map View:</p>
  
  <pre><code>var MapView = Backbone.View.extend({
    id: 'map',
  
    initialize: function(options){
      console.log("map view loaded");
      this.player = options.player;
      this.icon =   'http://www.marcellusgas.org/images/gmap/beachflag.png';
      this.map =    new google.maps.Map(this.el, this.model.attributes);
  
  
      this.path = new google.maps.Polyline({
        path: this.model.shelterCoordinates,
        geodesic: true,
        strokeColor: '#9900CC',
        strokeOpacity: 0.5,
        strokeWeight: 2
      });
  
      this.path.setMap(this.map);
  
      // set up listeners to changing model
      this.listenTo(this.player, 'change:shelter', this.render);
      this.listenTo(this.player, 'change:over', this.remove);
  
      this.render();
    },
  
    render: function(){
      var lat = this.player.get("shelter").get("lat");
      var lng = this.player.get("shelter").get("long");
      console.log(this.myLatLng = new google.maps.LatLng(lat, lng))
      this.marker = new google.maps.Marker({
        position: this.myLatLng,
        map:      this.map,
        icon:     this.icon
      });
      $('#map').replaceWith( $(this.el));
      $("body").append( $(this.el));
      google.maps.event.trigger(this.map, 'resize');
    }
  
  });
  </code></pre>
  
  <p>I have no errors appearing, the DOM elements appear to be in place, and the model and view are load with a grey box appearing. </p>