Не изменяется позиция маркера в массиве

223

12 января 2017, 06:59

Есть массив, в котором 5 значений долготы и широты, то есть расположение разных объектов. Посмотрел документацию, сделал массив как там. Получилось. Данные отображаются, но вот в интервале, когда в массиве данные обновляются, он не хочет менять позицию. Почему? Речь идет о данных myLatLng

Вот кусок кода:

//Получаю значения и обновляю.ве ок 
var znak = parseFloat($('td').eq(2).html()) || 0,
    lng0 = znak;
var znac = setInterval(function (){
   znak = lng0 = parseFloat($('td').eq(2).html());
},2000);
var znak1 = parseFloat($('td').eq(3).html()) || 0,
    lat1 = znak1;
var znac = setInterval(function (){
   znak1 = lat1 = parseFloat($('td').eq(3).html());
},2000);
console.log(znak);
console.log(znak1);

//затем кладу его в массив;

var myLatLng ={lat:znak,lng:znak1};
  var locations = [
      ['Azer', myLatLng, 4],
      ['Coogee Beach', -33.923036, 151.259052, 5],
      ['Cronulla Beach', -34.028249, 151.157507, 3],
      ['Manly Beach', -33.80010128657071, 151.28747820854187, 2],
      ['Maroubra Beach', -33.950198, 151.259302, 1]
    ];

Добавляю на карту и тут все хорошо отображается

 var marker, i;
   for (i = 0; i < locations.length; i++) {  
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });

//но вот проблема: далее в интервале массив не хочет изменять свое значение

 var setId=setInterval(function (){
   for (i = 0; i < locations.length; i++){
  marker.setPosition( new google.maps.LatLng(locations[i][1], locations[i][2]))
  console.log(locations[i][1]);
   }
   }, 2500);

Answer 1

Проблема заключается в том, что все 4 позиции применяются быстро в цикле. В итоге всегда должна показываться последняя

А, не, тут все хуже.

Создается 4 маркера в первом цикле

var marker, i;
for (i = 0; i < locations.length; i++) {  
   marker = new google.maps.Marker({
     position: new google.maps.LatLng(locations[i][1], locations[i][2]),
     map: map
   });
}

Но ссылка сохраняется только на последний. Из-за этого следует

во втором цикле
```
for (i = 0; i < locations.length; i++){
  marker.setPosition( new google.maps.LatLng(locations[i][1], locations[i][2]))
  console.log(locations[i][1]);
}
```
Ты меняешь позицию только последнего маркера, причем она всегда остается той какой и была, так как в итоге маркеру присваивается его исходная координата.
Кроме этого, даже если поправить хранение маркеров, при изменении переменных znak, и znak1 НЕ изменяется значение в массиве locations. То есть у тебя всегда постоянные координаты.

Для решения:

Сохранять все маркеры, например используя массив

var markers=[];
for (var i = 0; i < locations.length; i++) {  
   markers[i] = new google.maps.Marker({
     position: new google.maps.LatLng(locations[i][1], locations[i][2]),
     map: map
   });
}

Обновлять позицию только маркеров, которые должны меняться, в данном случае это первый маркер, Без цикла.
```
markers[0].setPosition( new google.maps.LatLng(locations[i][1], locations[i][2]))
```
либо в цикле обновлять все, если все могут меняться, текущий код уже работает для этого случая.
чтобы менялись значения в массиве, нужно менять их в объекте, который в этом массиве находится:
```
setInterval(function (){
   myLatLng.lat = parseFloat($('td').eq(2).html());
   myLatLng.lng= parseFloat($('td').eq(3).html());
},2000);
```
Раз уже интервалы у таймеров одинаковые, нет смысла запускать несколько таймеров, все можно разместить в одном.