Question

所以我在这里问了这个问题：Google Maps markers not incrementing array

我意识到我需要重构，所以现在我试图在视图中的一个div中渲染谷歌地图，而另一个有清除它的按钮等。这是呈现地图的视图中的当前代码：

'use strict';

var MapView = Backbone.View.extend({
  id: 'div-container',

  // Initialize the google map in the map key of the Map model
  initialize: function() {
    this.render();
    this.renderPolyline();
  },

  renderMap: function() {
    this.model.set('map', new google.maps.Map(document.getElementById('map-container'), this.model.get('mapOptions')));
  },

  renderPolyline: function() {
    this.map = this.model.get('map');

    this.poly = new google.maps.Polyline({
      strokeColor: '#000000',
      strokeOpacity: 1.0,
      strokeWeight: 3
    });
    this.poly.setMap(this.map);

    var boundAddLatLng = _.bind(this.addLatLng, this);
    this.map.addListener('click', boundAddLatLng);

    var boundRemoveLine = _.bind(this.removeLine, this);
    $('#btn-clear-map').on('click', boundRemoveLine);
  },

  render: function() {
    _.defer(this.renderMap());
    $('#div-container').replaceWith(this.el);
    return this;
  },

这会将地图渲染到它应该是的地方但是从lodash抛出一个空白的Uncaught TypeError并且点击地图什么都不做。如果我在$（'＃div-container'）下移动_.defer。replaceWith（this.el）;像这样

render: function() {
    $('#div-container').replaceWith(this.el);
    _.defer(this.renderMap());
    return this;
  },

然后我收到此错误 - 未捕获的TypeError：无法从Google地图中读取null的属性'offsetWidth'，并且地图根本无法渲染。我很困惑为什么，不知道该怎么做。

在骨干视图中呈现谷歌地图

0 个答案: