RE:CYCLE - интересен и малък алгоритъм за покритие
За проекта RE:CYCLE ни трябваше да зареждаме точки малко по малко, а не всичко наведнъж.
И за да не се повтаря зареждането на едни и същи точки, трябваше да знаем какво вече е заредил потребителя. Тази задача на следенето какво е заредил и какво не се оказа не много проста. Един вид трябва да изградим покритие на това което е видял потребителя.
За покритието се помисли относно случаите:
- потребителят зарежда сайта за първи път - това е ясно
- потребителят мърда картата малко с мишката - не искаме всеки път като мръдне с 1см да зареждаме точки.
- потребителят zoom-ва картата (назад или напред) - това означава че след zoom, във видимата част от картата все още има точки от предишно зареждане, но все пак е нужно и ново зареждане за областите около тези точки
- потребителят рязко сменя локацията на картата чрез полето за смяна на адрес - това означава че покритието ще е разпокъсано, а не винаги сменящо се от едно място на друго
За решението:
- когато потребителят зареди първи път сайта му се зареждат точки от район 9 пъти по-голям от видимия на екрана му. От всяка страна на екрана му по още един екран. Нещо такова:
Това прави покритието в размери на 9 екрана, за да може, ако човек мръдне екрана малко да не трябва веднага да се прави зареждане.
- когато потребителят излезе извън началното покритие (било то с zoom, доста мърдане или въвеждане на нов адрес далеч от текущния) се проверява дали четирите ъгъла на видимия екран попадат в покритието, ако не попадат, тогава се прави ново зареждане за точки. Зареждането е отново в размер 9x текущия екран. Паралено с това, новозареденият район се слива със стария, за да се опресни покритието.
За изграждането и поддържането на покритието се се сливат райони с различни размери, различни правоъгълници в размери на екрана, с различен zoom. За да стане това сливане се използва библиотека за манипулация на вектори: Clipperjs.
Ето как би изглеждало покритието от 2 слети района ако потребителят е заредил сайта в центъра на София и е преместил картата на югоизток:
А ето и кода за покритието:
Tweetcomments powered by Disqus