Question

我是骨干和节点js的初学者，我使用这些命令将谷歌地图添加到我的模板中：

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);
  });

徒劳无功，同样的事情：谷歌地图第二次出现，但是灰色。问题是地图的变量rmiURL是第二次未定义，而在第一次它包含此URLttps：//www.google.com/maps/@38.9891271,1.2130107,6z/data=！10m1！1e1！12b1 ？源= apiv3＆安培; rapsrc = apiv3 对于HTML：在我的div之后，它会生成另一个带有类＆＃39; gm-style＆＃39;而且他第二次没有

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-canvas（style =＆＃39; width：250px; height：250px;＆＃39;） .temp（style =＆＃39; position：absolute; visibility：hidden;＆＃39;）

googleMaps在刷新页面后显示为灰色

1 个答案: