Блог

У меня установлены карты Google с указателями. Я настроил его так, что всякий раз, когда изменяется масштаб или видовой экран, он соответственно загружает новый набор указателей:

 google.maps.event.addListener(xmap, 'zoom_changed', function(event){
    tm.update();
  });

  google.maps.event.addListener(xmap, 'bounds_changed', function(event){
    tm.update();
  });

  google.maps.event.addListenerOnce(xmap, 'tilesloaded', function(){
    tm.update();
  });
  

Я также установил его так, чтобы нажатие на любой указатель открывало информационное окно, которое будет заполнено данными из запроса ajax. Проблема в том, что мне нужно настроить его так, чтобы, если, скажем, указатель находился на дальних краях порта просмотра, он должен перемещаться к центру или в положение, в котором при открытии infowindow его можно было просматривать во всем порту.

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

Каков наилучший способ справиться с этим.

Итак, что вы могли бы сделать, это иметь что-то вроде логического флага, чтобы указать, вызывать tm.update() или нет. В вашем обработчике событий для щелчков по маркерам (для открытия информационных окон) установите для него значение false. Затем в вашем обработчике событий bounds_changed вызывайте tm.update только в том случае, если это логическое значение равно true. Затем, возможно, в конце bounds_changed сбросьте его обратно в true.

Еще одно предположение — не удалять и не перезаписывать маркеры, которые уже видны (попадают в map.getBounds()). Когда вы получаете ответ с новыми маркерами для добавления — проверьте, если его еще нет.

ОБНОВЛЕНИЕ: после bounds_changed у вас появляются новые границы. Затем вы запрашиваете свой сервер и получаете координаты маркеров и другие необходимые вам связанные данные. При добавлении маркеров на карту сохраняйте ссылки на них, скажем, в хэше. Если у вас есть какой-то уникальный идентификатор — это идеально. В другом случае придумайте какой-нибудь идентификатор для маркера. Затем нам нужно добавить новые маркеры и, возможно, удалить некоторые из них, которые скрыты. Вот так:

 // somewhere initially
var markersOnMap = {}

// when got data and adding new markers
markersData = array of markers you've received from request

for (var i=0; i < markersData.length; i  )
{
  var datum = markersData[i];
  if (typeof(markersOnMap[datum.id]) == 'undefined')
  {
    // add marker to map
    var marker = new google.maps.Marker({
      position: ...,
      etc.
    });
    marker.setMap(mymap);
    markersOnMap[datum.id] = marker;
  }
}

// you may clean up hidden markers or
// leave it for future or what you want.
// suppose we delete out of view markers
for (var id in markersOnMap)
{
  if (!mymap.getBounds().contains(markersOnMap[id].getPosition()))
  {
    // get rid of it
    markersOnMap[id].setMap(null);
    delete markersOnMap[id];
  }
}