Projekt – Sun In Car

Dosyć dawno nie chwaliłem się żadnym nowym projektem, tak więc nadszedł czas aby to zrobić. Tym razem jest to coś większego niż jakiś test nowo poznanej funkcji. Pokażę kompletną stronę internetową dostępną pod adresem http://sun.zajacmarek.com, która powstawała przez ostatni miesiąc.

Sun In Car jest to strona, która pozwala sprawdzić, które miejsca w samochodzie, busie lub autokarze będą w czasie podróży najdłużej nasłonecznione, na których miejscach słońce będzie uciążliwie świecić na wysokości oczu oraz z której strony padać będą promienie. Osoby często podróżujące busami, autokarami lub samochodem na dłuższych trasach na pewno spotkały się z sytuacją, że siadając na wybranym miejscu nie można było spokojnie odpoczywać albo ciężko było prowadzić samochód ponieważ słońce nieustannie świeciło w oczy. Ta strona pozwala właśnie sprawdzić czy godzina, o której zamierzaliśmy wyjechać np. z rodzinnego spotkania jest odpowiednia i słońce nie będzie utrudniało jazdy lub pozwala zdecydować, z której strony autokaru usiąść tak aby móc bez przeszkód poczytać książkę.

Pomysł na ten projekt wpadł nagle podczas jazdy pksem z Krakowa. Jak zwykle w godzinach popołudniowych udało mi się usiąść tak, że cały czas słońce świeciło mi po oczach, wtedy też pomyślałem czy nie dałoby się może tego przewidzieć.

Jako, że jeszcze nie wziąłem się zbytnio za naukę PHP strona powstała jedynie z wykorzystaniem html5 + javascript. Niesie to za sobą pewne większe lub mniejsze problemy, ale o tym później.

Po wejściu na stronę http://sun.zajacmarek.com ukaże nam się taki oto widok:

Od razu widać, że w kwestii projektowania wyglądu jeszcze trochę brakuje mi umiejętności, ale ważne, że udało się zachować jako taką przejrzystość.

Lewą część strony zajmuje mapa. Jest to mapa udostępniona przez Google. Dokładnie to korzystałem z Google Maps API V3, które jest właśnie przeznaczone dla Javascriptu.

Po prawej stronie mamy ustawienia. W polach Początek i Koniec podajemy początkowy i końcowy punkt trasy. Nieco poniżej znajdują się pola, w których należy podać datę i czas rozpoczęcia podróży. Po rozwinięciu Punktów pośrednich dostajemy możliwość podania miejsc, przez które przejeżdżamy, tak aby wyznaczona trasa jak najdokładniej pokrywała się z tą zamierzoną:

Po rozwinięciu Środka transportu możemy wybrać, czy podróż będzie odbywać się samochodem osobowym, minibusem czy autokarem. Wartości dla poszczególnych pojazdów takie jak długość i szerokość pojazdu, wysokość okien, rozmiar i rozmieszczenie foteli zostały dobrane orientacyjnie na podstawie znalezionych w Internecie informacji o tych typach pojazdów. Jeśli ktoś dysponuje średnimi wartościami na temat takich parametrów i mógłbym się nimi podzielić to jak najbardziej z chęcią je przyjmę, dzięki czemu dokładność działania aplikacji na pewno się poprawi.

Kiedy już określimy punkty dla naszej trasy możemy wybrać przycisk Wyznacz trasę, co spowoduje pokazanie naszej drogi na mapie po lewej stronie. Jeśli trasa nie jest do końca taka, jak oczekujemy, to powinniśmy dodać więcej punktów pośrednich. UWAGA: w aktualnej wersji nie ma możliwości przestawiania kolejności punktów pośrednich, dlatego jeśli chcemy wstawić jakiś punkt w innym miejscu niż jako ostatni to niestety musimy usunąć punkty, które się mają znajdować za nim, dodać interesujący nas punkt, a następnie ponownie dodać punkty, które usunęliśmy:

Jeśli wyświetlona trasa jest tą, której oczekiwaliśmy nie pozostaje nam nic innego jak wybrać przycisk Sprawdź, który spowoduje wyświetlenie grafiki prezentującej długość nasłonecznienia poszczególnych miejsc w stosunku do całkowitej długości trasy oraz wykres kierunek padania promieni słonecznych:

Jak widać program prezentuje nasłonecznienie zarówno na wysokości fotela, jak również na wysokości oczu. Im kolor jest bardziej intensywny tym dłużej dane miejsce będzie oświetlane przez słońce w trakcie podróży. Grafika po prawej stronie pokazuje jak długo z danego kierunku będzie padać słońce.

W powyższym przykładzie widać, że najdłużej oświetlony fotel to fotel kierowcy, ale jednak to pasażerowie po prawej stronie samochodu dłużej będą oślepiani przez świecące słońce, które przez większość drogi padać będzie na przód pojazdu.

W przypadku wybrania jako środek transportu autokaru sytuacja będzie przedstawiać się następująco:

Możemy z tej grafiki wywnioskować, że jeśli wybierzemy się w podaną trasę o wybranej porze to lepiej nie siadać po prawej stronie autokaru, zwłaszcza przy oknie ponieważ słońce będzie nam przeszkadzać przez większość trasy. Zaś jeśli planujemy przewozić na siedzeniu coś co nie powinno leżeć na słońcu to lepiej omijać miejsca po lewej stronie pojazdu.

Całość oczywiście pokazuje sytuację podczas bezchmurnej, słonecznej pogody. W czasie zachmurzenia lub opadów słońce nie stanowi problemu.

Informacje o obsłudze programu można wyświetlić wybierając na stronie ikonkę z literą „i” w prawym górnym rogu nagłówka.

Problemy, zastosowane rozwiązania i możliwe modyfikacje

Na pewno po chwili korzystania z programu większość osób dostrzeże uciążliwość konieczności każdorazowego podawania trasy, którą chce się sprawdzić. Aby można było m.in. móc zapisywać swoje trasy konieczne jest dopisanie do istniejącej strony części backendowej np. w języku PHP, co pozwoliłoby na rejestrowanie się użytkowników i zapisywanie tras w bazie danych.

Brakuje też przyjaznego dla użytkownika sposobu wyboru daty i czasu. Niektóre elementy graficzne mogłyby też wyglądać trochę lepiej.

Rzeczą, która może się wydać przydatna dla niektórych mogłaby być również możliwość zapisu wyników do pliku graficznego, jak również generowanie wykresu nasłonecznienia wybranego miejsca w czasie.

Chyba najwięcej problemów podczas pisania tej strony wystąpiło przy stosowaniu wzoru na pozycję słońca. Kod przepisywałem z języka C++, bo w takim właśnie języku znalazłem gotowe rozwiązanie. Brak jawnej deklaracji typów w języku javascript przysporzył problem o tyle, że pierwotny kod korzystał m.in. z tego, że przy konwersji z liczby double na int następowało obcięcie części ułamkowej. Pojawiało się też sporo literówek w trakcie pisania i przepisywania. Sporym wyzwaniem było też sprawdzanie czy dany fotel jest oświetlany przez promienie słoneczne w wystarczająco dużym stopniu. Postanowiłem, że nie będę tego liczył dokładnie, i użyty przeze mnie algorytm sprawdza jedynie z grubsza, czy dane miejsce mieści się w odpowiednim obszarze.

Mimo zastosowania języka Javascript, który w powszechnej opinii uznawany jest za język powolny nie widzę powodów do narzekania na ogólną szybkość działania. Przy sprawdzaniu >1000 punktów na trasie dla ok. 40 foteli czas do wyświetlenia wyniku, nawet na smartfonie, nie przekracza zwykle 1-2 sek.

Jeśli zauważyłeś błędy w działaniu lub masz sugestie co do poprawy funkcjonowania aplikacji to pisz do mnie na adres contact@zajacmarek.com