Kaaboeld
@Kaaboeld
Web-разработчик

Как рассчитать массив кластеров на основе координат, масштаба/относительный радиус?

На данный момент кластеризация не реализована в компонентах google карт для react-native, есть только некие отсылки к компонентам react(которые завязаны на подключаемую оригинальную библиотеку google api js) и планы в roadmap.
В native-компоненте карт платформы(в частности android) кластеризация есть и успешно работает например в native script.
Хотелось бы найти готовое решение если таковое существует которое бы на выход выдавало бы массив маркеров-кластеров, а на вход ожидало: список маркеров, масштаб(зум), относительный радиус находящиеся в котором маркеры должны кластеризовываться. Относительный так как радиус меняется в зависимости от масштаба.
Оригинальный пример

Нашел вот такую библиотеку, но там относительно "смещения" сделано.

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

Возможно кто-то встречал варианты или может я чего пропустил в самом react-native?
  • Вопрос задан
  • 156 просмотров
Решения вопроса 1
Kaaboeld
@Kaaboeld Автор вопроса
Web-разработчик
Вопрос снимается, решение:
supercluster + geo-viewport + lat/lngDelta region:
export function region(points) {
    if(isNaN(points[0].latitude) ) return null;
  var minX, maxX, minY, maxY;

  // init first point
  ((point) => {
    minX = point.latitude;
    maxX = point.latitude;
    minY = point.longitude;
    maxY = point.longitude;
  })(points[0]);

  // calculate rect
  points.map((point) => {
    minX = Math.min(minX, point.latitude);
    maxX = Math.max(maxX, point.latitude);
    minY = Math.min(minY, point.longitude);
    maxY = Math.max(maxY, point.longitude);
  });

  console.log(points, minX,maxX, (minX + maxX) / 2)
  var midX = (minX + maxX) / 2;
  var midY = (minY + maxY) / 2;
  var midPoint = [midX, midY];

  var deltaX = (maxX - minX);
  var deltaY = (maxY - minY);

  return {
    latitude: midX, longitude: midY,
    latitudeDelta: deltaX, longitudeDelta: deltaY,
  };
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы