Как вы выполняете поиск в пределах координат полигона на Картах Google? - PullRequest
Новая
       51

Как вы выполняете поиск в пределах координат полигона на Картах Google?

0 голосов
/ 19 февраля 2019

Я реализовал react-google-maps с <Drawing Manager />.

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

Итак, поток:

  1. Пользователь должен нарисовать линию вокруг области(например, Finsbury Circus, London.)
  2. Это вызывает fetchNewsUpdateMarkers()
  3. Это вызывает API, объектов, каждый из которых имеет lat и lng значение.3.5 Я сопоставляю их, их значения lat-lng преобразуются в объекты google LatLng и ...
  4. Я запускаю containsLocation() и возвращаю значения true в markers array.

Так что все хеджирует при получении массива координат области многоугольника из моего onPolylineComplete возвращенного obj ?

Code: 

<DrawingManager
  defaultOptions={{
    drawingControl: true,
    drawingControlOptions: {
      position: google.maps.ControlPosition.TOP_CENTER,
      drawingModes: [
        google.maps.drawing.OverlayType.POLYLINE,
      ],
    },
  }}
  onPolylineComplete={(obj) => props.fetchNewsUpdateMarkers(obj)};
/>

изатем ... 

fetchNewsUpdateMarkers: (obj) => {
  console.log(obj); // <-- this logs out as below
  let markers = [];
  let searchArea = new google.maps.Polygon({ paths: polygonCoords }); // <--that I hope to get from 'obj' somehow!

  let arrayOfAPIlocations = [
    { lat: 51.518420, lng: -0.088690 },
    { lat: 51.518110, lng: -0.087970 },
    { lat: 51.517601, lng: -0.180250 }
  ];

// ^^ only the *last* obj in this array is West London.
// The others are in the same district of East London.

// So maybe something like:

  arrayOfAPIlocations.map(each => {
    let convertedLatLng = new google.maps.LatLng(each.lat, each.lng);
    if (google.maps.geometry.poly.containsLocation(convertedLatLng, searchArea)) {
      markers.push(each);
    }
    return markers;
  });
}

Это то, что в настоящее время происходит от 'obj' ??:

enter image description here

1 Ответ

0 голосов
/ 21 февраля 2019

onOverlayComplete событие имеет следующую подпись: 

onOverlayComplete?(e: google.maps.drawing.OverlayCompleteEvent): void

Когда пользователь завершит рисование многоугольника, OverlayCompleteEvent.overlay свойство возвращает экземпляр объекта Polygon,Следующий фрагмент демонстрирует, как определить, находится ли данная точка внутри указанного многоугольника: 

handleOverlayComplete(e) {

    const polygon = e.overlay;
    const latLng = new google.maps.LatLng(lat, lng);
    const containsPlace = google.maps.geometry.poly.containsLocation(
        latLng,
        polygon
    );
    //...
}

В качестве альтернативы onPolygonComplete событие может использоваться: 

onPolygonComplete?(p: google.maps.Polygon): void

Эта демонстрация демонстрирует, как выделить маркер, если он находится внутри нарисованного многоугольника

...