@fronter-up

Как загрузить 100000 маркеров, react+google maps?

Добрый день! Подскажите пожалуйста как разумно сделать?
Задача построить путь на карте с большим количеством точек (примерно 100000). Саму линию делаю с помощью Polyline, строится довольно быстро. Проблемы появляется когда начинаю выводить маркеры, все начинает зависать (даже если вывожу только 1000 шт.)
Использую кластеризацию, но все равно подвисает.
В маркерах ничего такого нет, один div только.
Вопрос как грузить маркеры, чтобы все классно работало?
Проект на react + google maps.
Спасибо!
  • Вопрос задан
  • 393 просмотра
Пригласить эксперта
Ответы на вопрос 2
Sanasol
@Sanasol Куратор тега JavaScript
нельзя просто так взять и загуглить ошибку
использовать кластеризацию на сервере только остаётся.
Никак на фронте нормально такой объём не отработает, да и не нужен он там одновременно.

Т.е. с сервера подтягивать только маркеры которые находятся в заданном квадрате карты.

А когда зум далеко, то отдавать с сервера кластеры готовые.
Ответ написан
VoidVolker
@VoidVolker Куратор тега JavaScript
Dark side eye. А у нас печеньки! А у вас?
Рендерить не более 50-100 макркеров на экране. При изменении масштаба - экстраполировать. Т.е. надо сделать свое количество маркеров для каждого уровня масштаба карты. При движении карты - невидимые маркеры прятать, видимые - показывать. Еще лучше, если на экране будет не более 20-30 маркеров, еще 20-30 можно сделать невидимыми в обе стороны маршрута, чтобы при прокрутке пользователь не видел их рендеринг. А еще лучше использовать Canvas для рендеринга маркеров.
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы