谷歌地图标记不递增数组 [英] Google Maps markers not incrementing array

问题描述

我到处都找过，但无法找到答案。我有一张地图，当我点击它添加标记来我点击的地方。我推这些标记到一个数组但是当我做一个标记似乎只是覆盖，这就是一个数组中之前，而不是增加一个索引数组。数组只是一直是这样的[我]无论多少都标记在地图上。这里是code

I have looked all over but can't find an answer to this. I have a map that when I click on it adds markers to where I clicked. I am pushing those markers into an array but when I do one marker just seems to override the one that was in the array before instead of adding another index to the array. The array just always looks like this [me] no matter how many markers are on the map. Here is the code

addLatLng: function(event) {
    var path = this.poly.getPath();
    var markers = [];

    path.push(event.latLng);
    this.calcDistance(path);

    var marker = new google.maps.Marker({
      position: event.latLng,
      title: '#' + path.getLength(),
      map: this.map
    });
    markers.push(marker);

    console.log(markers);
    console.log(marker);
    // debugger;
    function removeMarkers(map) {
      for (var i = 0; i < markers.length; i++) {
        markers[i].setMap(map);
      }
      markers = [];
    }

    $('#btn-clear-map').on('click', function(event) {
      event.preventDefault();
      removeMarkers(null);
    });

    $('#btn-clear-point').on('click', function(event) {
      event.preventDefault();
      markers[markers.length -1].setMap(null);
    });
  },

这是一个骨干视图的一部分，如果有什么差别。我只是不知道为什么，当我推一个标记似乎覆盖一个已经在那里。

this is part of a backbone view if that makes any difference. I just have no idea why when I push a marker in it seems to override the one that was already in there.

编辑：好吧，我只是想通了，为什么，我每次点击做一个新的标记，它被重新标记数组。任何聪明的方式来解决这个问题？

Ok I just figured out why, every time I click to make a new marker, it is resetting the marker array. Any clever ways to get around this?

推荐答案

的问题是，您要重新声明标记每次通话阵列 addLatLng 方法（也你是新的事件处理程序和创建 removeMarkers 函数和一个封闭的每一次）

The problem is that you are re-declaring the markers array on each call to addLatLng method (Also you're new event handlers and creating removeMarkers function and a closure each time)

相反，你应该保持标记阵列作为视图的属性，如下所示：

Instead, you should keep the markers array as a property of the view as shown below:

Backbone.View.extend({
  initialize: function() {
    this.markers = [];
  },
  events: {
    'click #btn-clear-map': 'removeMarkers',
    'click #btn-clear-point': 'clearPoint',
  },
  render: function() {},
  addLatLng: function(event) {
    var path = this.poly.getPath();
    path.push(event.latLng);
    this.calcDistance(path);
    var marker = new google.maps.Marker({
      position: event.latLng,
      title: '#' + path.getLength(),
      map: this.map
    });
    this.markers.push(marker);
  },
  removeMarkers: function(event) {
    event.preventDefault();
    for (var i = 0; i < this.markers.length; i++) {
      this.markers[i].setMap(null);
    }
    this.markers = [];
  },
  clearPoint: function(event) {
    event.preventDefault();
    this.markers[this.markers.length - 1].setMap(null);
  }
});

这篇关于谷歌地图标记不递增数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！