GOOGLEMAPS显示为灰色后刷新页面 [英] googleMaps appears in grey after refresh page

问题描述

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

i am a beginner in backbone and node js, i have added google maps to my template using these commands:

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

我增加了许多像油膏：

i have added many unction like:

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

或

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

BU徒劳的，同样的事情：谷歌地图上显示的第二次，但为灰色。
问题是地图的可变rmiURL未定义第二次，而在第一次它包含此URLttps://www.google.com/maps/@38.9891271,1.2130107,6z/data=!10m1!1e1!12b1?source=apiv3&rapsrc=apiv3
并为HTML：我的div后会生成带类的通用式和他没有第二次另一个div

bu in vain, the same thing: google Maps appears for the second time but in grey. The problem is the variable rmiURL of map is undefined for the second time, while in the first time it contains this URLttps://www.google.com/maps/@38.9891271,1.2130107,6z/data=!10m1!1e1!12b1?source=apiv3&rapsrc=apiv3 and for the HTML : after my div it generates another div with class 'gm-style' and in the second time he doesn't

推荐答案

对于那些在这里有同样的问题是我找到了解决办法：

for those having the same problem here is the solution i found :

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帆布（样式=宽度：250像素，高度：250像素;'）
  .temp（样式='的位置是：绝对的;能见度：隐藏;'）

.map-canvas(style='width: 250px; height: 250px;') .temp(style='position: absolute; visibility:hidden;')

这篇关于GOOGLEMAPS显示为灰色后刷新页面的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！