Как получить все видимые маркеры на текущем уровне масштабирования

Вот несколько моментов:

  1. У меня есть несколько маркеров на карте и связанные с ними записи на правой панели помимо карты. Они связаны с помощью числового идентификатора, который хранится как свойство маркера.
  2. Все маркеры хранятся в массиве.
  3. Когда пользователь увеличивает масштаб карты, записи, связанные только с видимыми маркерами, должны отображаться на правой панели.

Итак, как получить список всех видимых маркеров на текущем уровне масштабирования? Я поискал в Интернете и не нашел ничего полезного. То, чего я пытаюсь достичь, можно найти здесь


person nefo_x    schedule 25.05.2010    source источник


Ответы (6)


Если кому-то еще нужен ответ на этот вопрос, у меня есть полная рабочая модель на Codepen.io.

Не стесняйтесь загружать его и настраивать под свои нужды. Просто измените ключ API на свой собственный. (Они бесплатные)

https://codepen.io/pailwriter/pen/bGEpeRv

Вот функция для получения маркеров во вьюпорте.

function showVisibleMarkers() {
    var bounds = map.getBounds(),
        count = 0;
                                   
    for (var i = 0; i < markers.length; i++) {
        var marker = markers[i],
            infoPanel = $('.info-' + (i+1) ); // array indexes start at zero, but not our class names :)
                                           
        if(bounds.contains(marker.getPosition())===true) {
            infoPanel.show();
            count++;
        }
        else {
            infoPanel.hide();
        }
    }
    
    $('#infos h2 span').html(count);
}
person Aubrey Love    schedule 31.07.2020
comment
getBounds () не найден. Пожалуйста, дайте мне знать ваше мнение - person Ronak Gadhia; 11.02.2021

В Google Maps JavaScript API V3 мы можем использовать что-то вроде этого:

let markers
let map
let bounds = map.getBounds()
markers.filter(m => m.isAdded).forEach(m => {
  if (bounds.contains(m.getPosition())) {
    // code for showing your object, associated with current marker
  }
})
person bruha    schedule 13.10.2011
comment
со 100к маркеров вы можете немного ускориться с помощью markers.filter (m = ›m.isAdded) - person gengns; 22.06.2018
comment
Вы должны использовать getBounds только один раз, вне цикла for или в первой позиции цикла for - person neonguru; 06.02.2019
comment
@gengns Не могли бы вы объяснить, что делает m => m.isAdded, чтобы это ускорить? Как-то я этого не понимаю. - person Peter VARGA; 08.05.2021
comment
@PeterVARGA, вам не нужно перебирать все ваши маркеры (например, 100k), только те, которые уже добавлены на карту (например: 3) - person gengns; 09.05.2021
comment
@gengns Что именно означает m => m.isAdded? Ничего не нахожу в документации. Как установлен m.isAdded? В моем массиве markers все маркеры добавлены на карту - поэтому они находятся в этом массиве. Спасибо - person Peter VARGA; 09.05.2021

Используйте GMap2.getBounds(), чтобы найти ограничивающую рамку. Используйте GLatLngBounds.containsLatLng() для проверки каждого маркера, чтобы увидеть, виден ли он.

person Wai Yip Tung    schedule 25.05.2010
comment
спасибо, сработало. для других ищущих решения не забудьте передать GMarker.getLatLng () - person nefo_x; 26.05.2010

Я знаю, что вам нужен API V2, но мне пришлось исправить некоторые вещи, которые я видел в ответе @bruha для V3, на случай, если кто-то придет его искать:

var markers; // your markers
var map; // your map

for(var i = markers.length, bounds = map.getBounds(); i--;) {
    if( bounds.contains(markers[i].getPosition()) ){
        // code for showing your object
    }
}

обратный ход по массиву таким образом проходит через массив маркеров быстрее, плюс мы устанавливаем границы в переменной перед переходом в цикл, поэтому мы не запрашиваем ее каждый раз, когда проходим цикл, и единственный запрос, который мы должны make - это если конкретный маркер находится внутри границ.

РЕДАКТИРОВАТЬ: обманул мой декрементер

РЕДАКТИРОВАТЬ: map.getBounds () должен быть, был map.getBounds

person borbulon    schedule 01.02.2012
comment
Есть идеи, как будет выглядеть то же самое для v2? - person IT_puppet_master; 18.02.2015
comment
Почему обратный ход проходит по массиву быстрее? - person jayp; 25.03.2016
comment
@jayp Обратный переход был быстрее в большинстве JS-движков в 2012 году (когда был написан этот ответ). Это уже не так. Если вы все еще разрабатываете более старые версии IE в качестве вероятного варианта использования (например, если вы делаете много корпоративных внутренних вещей), вы все равно хотите вернуться назад (причина в том, что > 0 раньше была самой быстрой операцией ). В противном случае можете смело идти в любом направлении. - person borbulon; 21.04.2017

Это простой код. Попробуйте этот код.

private boolean CheckVisibility(Marker marker)
{
    if(googleMap != null)
    {
        //This is the current user-viewable region of the map
        LatLngBounds latLongBounds = googleMap.getProjection().getVisibleRegion().latLngBounds;

            if(latLongBounds.contains(marker.getPosition()))
                   //If the item is within the the bounds of the screen
                  return true;
            else
                  //If the marker is off screen
                  return false;
    }
    return false;
}
person Jignesh Goyani    schedule 29.08.2016

Мой фрагмент кода

private boolean isAnyMarkerVisible(LatLng ll) {
    if(gMap != null && markersData != null) {
        final LatLngBounds latLongBounds = LatLngBounds.builder().include(ll).build();
        for (Store store : markersData) {
            if (latLongBounds.contains(store.getLatLng())) {
                return true;
            }
        }
    }
    return false;
}
person Lukas Hanacek    schedule 16.02.2017