Клъстер на маркери на Javascript за Google Карти - 💡 Fix My Ideas

Клъстер на маркери на Javascript за Google Карти

Клъстер на маркери на Javascript за Google Карти


Автор: Ethan Holmes, 2019

Всеки, който работи с големи набори от данни в Google Карти, се е сблъсквал с проблема да покаже група маркери в малка област. Не само наоколо, показвайки нещо повече от сто икони на маркери по едно и също време, което може да накара браузъра да се спре на много платформи, Safari на НПК Macs, които доставят най-много болка.

Решението е да се групират съседни маркери в обобщаващ маркер, когато са показани твърде много маркери или когато маркерите са толкова близки на определено ниво на увеличение, че те напълно се припокриват. За изключително големите масиви от данни това е най-ефикасно направено в задния край, като последователните AJAX обаждания освежават набор от маркери от PHP скрипт, който филтрира видимите маркери от комплекта.

Можете също да се справите с клъстерирането от страна на клиента, като използвате javascript, за да сканирате целия набор от местоположения и динамично да определите какво е видимо и какво трябва да се групира. Недостатъкът е, че трябва да изтеглите целия комплект и да го съхраните в паметта на браузъра, но ако не започнете да се оправяте в десетки хиляди маркери, това не е голяма работа. Ползата за метода от страна на клиента е, че тя е по-малко сложна, тя ви позволява да работите с големи множества от резултати от крайни API, които не можете да контролирате, и с библиотеката за клъстери на ACME Labs, която е изключително лесна за кодиране.

За да използвате Clusterer, първо изтеглете и включете файла Clusterer2.js от връзката по-долу в страницата на картите си. След това трябва да създадете обект на Clusterer, като предадете обекта на картата на неговия конструктор:

var clusterManager = нов клъстер (карта);

Оттам можете да я използвате вместо традиционните MarkerManager или други обаждания за addOverlay, като извикате метода на AddMarker на Clusterer. Отнема два параметъра, маркера за добавяне и текстов низ, който ще бъде включен в съдържанието на клъстера, когато се кликне:

clusterManager.AddMarker (маркер, "Описание на маркера");

Мениджърът на клъстера ще се погрижи за цялата мръсна работа, само ще покаже елементи, когато те са в рамките на вашия изглед, и динамично ги групира по подходящ начин, когато на екрана има твърде много наведнъж. Когато някой от клъстерите бъде натиснат, той ще покаже списък с местоположенията вътре в него. Повечето от това, което бихте искали да промените, като прага, при който да се стартира клъстерирането и иконата, използвана за представяне на клъстер, всичките могат да се регулират чрез API чрез някои методи за разбиране, като SetMaxVisibleMarkers (n) и SetIcon (икона) , Следвайте връзката по-долу за повече информация или прочетете източника за някои от по-малко документираните опции.

Документация за клъстера Източник на клъстера



Може Да Се Интересувате

Изграждане на "Невъзможна пейка"

Изграждане на "Невъзможна пейка"


Отворете изчислителния център за управление на движението със снимки

Отворете изчислителния център за управление на движението със снимки


Защо все още говорим за джендър в 200-та годишнина на Ада Лавлейс

Защо все още говорим за джендър в 200-та годишнина на Ада Лавлейс


Тези роботи крадат и споделят вашите данни, защото ги оставяте

Тези роботи крадат и споделят вашите данни, защото ги оставяте