Zrobiłem dzisiaj tak dużo rzeczy, że chyba najlepiej będzie je opisać w formie dziennika. Jeśli kiedyś będę próbował odszukać informacje na tematy, o których tutaj napiszę, mój problem.

Custom URL schemes i iOS

Pracując nad dokumentacją projektu dla klienta, dowiedziałem się, że umieszczając w aplikacji widok SFSafariViewController, a następnie klikając w nim na link ze schematem zarejestrowanym w tej aplikacji, nie pokazuje się okno popup z pytaniem, czy otworzyć tę aplikację. Jest to logiczne - już jesteśmy w tej aplikacji. Nie jest to intuicyjne, ponieważ WKWebView nie potrafi takich cudów, i trzeba nadpisywać delegata, żeby się dowiedzieć, co zostało kliknięte, a następnie przeanalizować to.

Tak sobie myślę, że użycie tego widoku Safari może i jest prostsze, ale za to mniej sportowe. Zintegrowanie Web View do tego samego nie jest dużo trudniejsze - co najwyżej bardziej czasochłonne, ale też mamy dużo większą kontrolę. Za to na pewno jest bardziej sportowe.

Mapa z wieloma punktami

Zdecydowałem, że wybiorę do implementacji Mapy Apostazji Leaflet. Bo jest darmowy, a ma wszystkie możliwości, które są mi potrzebne.

Głównym problemem, który próbowałem rozwiązać, było straszne zacinanie mapy. Pierwsze pomysły, które przyszły mi do głowy, to klastrowanie oraz heat mapa. Niestety, żaden z tych pomysłów nie spełniał moich założeń. Klastrowanie gubiło informację o kolorze, a heatmapa po prostu rysowała gradienty. Ja miałem nadzieję na coś pokroju Airly.

Nie wiedziałem nawet, jak ugryźć temat, więc zacząłem od wyszukiwania i przeczesywania informacji na temat optymalizacji. Po chwili trafiłem na MaskCanvas. Niewiele mi to mówiło, ale załadowanie wszystkich punktów do mapy - bez podziału na kolory - rozwiązało problem; mapa działała błyskawicznie. Tylko była jednokolorowa.

Podzieliłem więc punkty na trzy grupy (żeby móc je pokolorować na różne kolory), dodałem do osobnych warstw, a te do mapy. Niestety płynność spadła. Było i tak o niebo lepiej od pierwowzoru, ale to nadal nie było to, co chciałem. Poza tym, punktów będzie tylko przybywać, więc problem tylko by narastał. Szukałem dalej.

W końcu jednak natrafiłem na rozwiązanie zawarte już w samym Leaflet - CircleMarker. Po doszukaniu informacji dowiedziałem się, że standardowe dodawanie punktów do mapy tworzy dla każdego punktu osobny element DOM, więc 500 punktów to 500 elementów DOM, a z tyloma elementami przeglądarka niekoniecznie chce sobie poradzić. CircleMarker dodaje się za to do płótna mapy (canvas), więc nie ma ani jednego nowego obiektu DOM, a samo przerysowywanie punktów jest błyskawiczne. Każdy punkt jest osobnym bytem, więc można mu nadać dowolny kolor. Jest także klikalny, więc bez problemu będzie można zaimplementować wyświetlenie szczegółów.

Panel ze szczegółami

Tutaj poszło trochę szybciej. Potrzebowałem bocznego panelu do wyświetlenia informacji o klikniętym punkcie. Znalazłem Leaflet Sidebar. Działa całkiem dobrze. Jedyny problem miałem z chowaniem panelu po kliknięciu na mapę, ponieważ kliknięcie markera wywoływało jednocześnie event kliknięcia mapy. Na szczęście CircleMarker ma parametr o wszystkomówiącej nazwie bubblingMouseEvents, więc żeby chowanie panelu działało poprawnie, wystarczyło wyłączyć bąbelkowanie wydarzeń myszki.

Horyzonty

Dzisiaj zdałem sobie też sprawę z tego, że nieświadomie mocno poszerzyłem swoje horyzonty. Na potrzeby projektu Mapa Apostazji napisałem skrypt w Pythonie, zrobiłem stronę w HTML, ostylowałem w CSS, teraz uczę się map Leaflet, wykresów Charts i ogólnie JavaScriptu, nawet silnik do bloga napisałem przy użyciu PHP.

Będę miał do portfolio xD