GoogleMaps появляется в сером после обновления страницы

Question

я новичок в системообразующих и узлов JS, я добавил карты Google в шаблон, используя следующие команды:

script(src='/lib/google-maps/lib/Google.js') 
script(src='http://maps.googleapis.com/maps/api/js') 
script(src='http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js') 
div.googleMap(style='width: 250px; height: 250px;') 

и в моих взглядах:

mod.mapTemplate = Marionette.ItemView.extend({ 
template: '#actors-map-template', 
initialize: function() { 
    var mapProp = this.model.get('mapProp'); 
    map = new google.maps.Map(this.$el[0], this.model.get('mapProp')); 
    } 
}); 

я добавил много помазания, как:

 google.maps.event.trigger(map, 'resize'); 

или

google.maps.event.addDomListener(window, 'resize', function() { 
    map.setCenter(mapProp.center); 
    }); 

bu тщетно, то же самое: google Maps появляется во второй раз, но в сером. Проблема заключается в том, что переменная rmiURL карты не определена во второй раз, в то время как в первый раз она содержит этот URLttps: //www.google.com/maps/@38.9891271,1.2130107,6z/data=! 10m1! 1e1! 12b1 источник = apiv3 & rapsrc = apiv3 и для HTML: после моего DIV он генерирует другой DIV с «GM-стиля» класса и во второй раз он не

Answer 1

для тех, кто имеет такую ​​же проблему здесь решение я нашел:

initMap: function() { 
    this.$el.addClass('temp'); 
    $('body') 
    .append(this.$el); 
    var mapProp = this.model.get('mapProp'); 
    this.map = new google.maps.Map(this.$el.find('.map-canvas')[0], 
    mapProp); 
    this.$el.remove(); 
    this.$el.removeClass('temp'); 
}, 
render: function() { 
    this.$el.html(_.template($('#actors-map-template') 
    .html())); 
    this.initMap(); 
}, 

и в представлении:

.map-холст (ширина стиль = ': 250px; высота: 250px; ') .temp (style =' position: absolute; видимость: скрытая; ')