Получить список маркеров в пределах карты mapbox - PullRequest
Новая
       41

Получить список маркеров в пределах карты mapbox

0 голосов
/ 18 октября 2018

Я пытаюсь получить все маркеры в пределах карты.Когда пользователь взаимодействует с картой (увеличивать / уменьшать, перемещать, щелкать), я хочу, чтобы все маркеры в пределах карты отображали список этих маркеров.

Я пытался реализовать некоторые изфункции, которые имел этот пример без какой-либо удачи: https://www.mapbox.com/mapbox-gl-js/example/filter-features-within-map-view/

Вот рабочая версия карты на codepen: https://codepen.io/anon/pen/MPGgWq

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

map.on('moveend', function (e) {
    var features =  map.queryRenderedFeatures();
    var bounds = map.getBounds();

    console.log(features);
    console.log(bounds);
});

Ответы [ 2 ]

0 голосов
/ 19 октября 2018

1) Mapbox gl js don't store references for markers - https://github.com/mapbox/mapbox-gl-js/issues/5821#issuecomment-356704579

2) Если маркер добавляется на карту, а не сохраняется, то его единственным представлением является элемент html внутри контейнера карты.

3) Таким образом, вы можете использовать getBoundingClientRect, чтобы определить, виден ли маркер в контейнере карты: 

function intersectRect(r1, r2) {
  return !(r2.left > r1.right ||
    r2.right < r1.left ||
    r2.top > r1.bottom ||
    r2.bottom < r1.top);
}

function getVisibleMarkers() {
  var cc = map.getContainer();
  var els = cc.getElementsByClassName('marker');
  var ccRect = cc.getBoundingClientRect();
  var visibles = [];
  for (var i = 0; i < els.length; i++) {
    var el = els.item(i);
    var elRect = el.getBoundingClientRect();
    intersectRect(ccRect, elRect) && visibles.push(el);
  }
  if (visibles.length > 0) console.log(visibles);
}

[https://jsfiddle.net/rkqdz5g2/]

0 голосов
/ 18 октября 2018

Насколько я понимаю mapbox gl js API, вы не можете маркеры запросов.Я хотел бы получить список маркеров в некоторой структуре данных и запросах с использованием функции turf.js pointsWithinPolygon .Где первым вводом будут ваши маркеры, а вторым ваш текущий видовой экран.

...