Android mapa ludzi. Nowe Yandex.Maps, które każdy może teraz poprawiać samodzielnie

Yandex.Maps - bezpłatne mapy znanej rosyjskiej firmy. Główną przewagą aplikacji nad jej odpowiednikami jest możliwość przeglądania map w trybie offline. Aby to zrobić, potrzebna mapa miasta musi być najpierw wczytana do pamięci urządzenia. Odbywa się to z interfejsu programu i nie wymaga od użytkownika żadnych specjalnych umiejętności. Co ciekawe, przed pobraniem program zaoferuje Ci wybór, która karta najbardziej Ci odpowiada - oficjalna lub „narodowa”. Jeśli wszystko jest mniej więcej jasne w przypadku pierwszej opcji, musimy bardziej szczegółowo zająć się drugą. Mapy „Ludzie” są tworzone bezpośrednio przez członków społeczności, a także modelowane przy użyciu danych z otwartych źródeł. Na nich znajdziesz znacznie więcej oznaczeń dotyczących instytucji, przystanków i innych codziennych rzeczy. Od razu zauważamy, że tego typu mapy polecamy tylko dla dużych miast.

Wśród innych przydatnych funkcji aplikacji Yandex.Maps można wyróżnić podstawowe funkcje nawigatora. Tryb nawigacji możesz włączyć od razu po wytyczeniu trasy (ręcznej lub automatycznej). Jak każda inna mapa, prezentowane rozwiązanie programowe jest w stanie określić położenie użytkownika na mapie. Program posiada również możliwość przeglądania panoram ulicznych.

Najważniejsze cechy i funkcje

• oferuje użytkownikom mapy offline większości miast Rosji, Ukrainy i Białorusi;
• umożliwia przeglądanie informacji o najbliższych placówkach;
• zawiera możliwość wyboru trybu widoku mapy: diagramu, satelity i „ludowej” wersji mapy;
• umie wytyczyć trasy spacerowe i samochodowe;
• wyświetla informacje o korkach;
• umożliwia oglądanie panoram ulic.

Co nowego w tej wersji?

8.4.2 (28.10.2016)

Witajcie drodzy czytelnicy serwisu blogowego. Dzisiaj chciałem porozmawiać o mapach Yandex i ich wykorzystaniu na mojej stronie internetowej. Większość webmasterów zadowala się najprostszymi funkcjami, które udostępnia konstruktor dostępny online lub po prostu używa odpowiednich wtyczek lub modułów do swojego CMSa.

Ale ci, którzy chcieliby uzyskać więcej funkcji i funkcjonalności z interfejsu API Yandex.Maps, będą musieli nauczyć się JavaScript i zrozumieć ich dokumentację.

Niestety nie jestem dobry w językach, dlatego w tym poście opowiem tylko o najprostszych sposobach wstawienia Yandex Maps na twoją stronę lub bloga, a także pokażę ci, gdzie szukać informacji, jeśli wydaje się to trochę i co możesz dostać, jeśli chcesz.

Szukaj w Yandex Maps, People's Map i Yandex.Directory

Usługa map online firmy Yandex (przeczytaj o tym) pojawiła się w 2004 r. i od tego czasu rozwija się, zwłaszcza że ma bardzo silnego konkurenta w obliczu map Google. Mieszkańcy wielu dużych miast Rosji, Ukrainy, Kazachstanu czy Białorusi korzystają z zaawansowanych funkcji, takich jak Traffic Jams czy Panoramy.

Ostatnia usługa (panoramy) została uruchomiona stosunkowo niedawno (2009) i Yandexmobile (z czterema szerokokątnymi aparatami na dachu) nie zdołał jeszcze podróżować po wszystkich zakątkach naszej rozległej ojczyzny, ale tam, gdzie już pojawiły się panoramy, stał się znacznie łatwiej zaplanować wycieczki po nieznanej trasie.

Oprócz samochodu pracownicy Yandex Maps poruszają się po niektórych obszarach rowerami lub pieszo (na przykład w parkach). Ostatnio pojawiły się też panoramy wykonane z helikoptera, a żeby je zobaczyć, trzeba pod odpowiednim przyciskiem zaznaczyć „Z powietrza”, ale tak naprawdę coś takiego jest dostępne tylko dla Piotra.

Jeśli Twojej firmy tam nie ma, skorzystaj z formularza dodawania nowej organizacji do katalogu, którego przycisk połączenia pojawi się po prawej stronie pod formularzem weryfikacji:

Następnie postępuj zgodnie z instrukcjami na poniższym filmie (określone dane, takie jak np. numer telefonu lub adres, będą musiały zostać potwierdzone, więc nie mogą być fałszywe, w przeciwnym razie nie będzie można dodać do mapy):

Jednocześnie musisz być autoryzowany w Yandex i najlepiej, jeśli nie jest to twoje konto osobiste, ponieważ może być konieczna edycja danych dodanych do mapy (lub rozmieszczenie priorytetów zamówień), a nie zawsze będzie to poprawne powierzyć swoje konto pracownikowi. Wystarczy postępować zgodnie z podanymi instrukcjami.

To, co jeszcze jest atrakcyjne dla użytkowników wyszukiwarki Yandex Maps, to fakt, że mogą czytać i, jeśli chcą, zostawić opinię o organizacji. Co więcej, recenzje są moderowane (oczywiście nie przez właścicieli firmy, ale przez pracowników lustra Runet) i eliminowany jest oczywisty spam lub bzdury.

Klikając w recenzje, zostaniesz przeniesiony na kartę organizacji, gdzie możesz je przeczytać i, jeśli chcesz, zostawić własne. Mogą być również dodatkowe informacje na temat tej firmy.

Tworzenie map w Yandex, tras i aplikacji mobilnych

Opisaliśmy trzy główne źródła, z których Yandex uzyskuje informacje podczas wyszukiwania obiektów geograficznych. Ale jest też czwarta. Są to tzw. tagi, które użytkownik pozostawia na tzw „Moje karty” przechowując je z możliwością publicznego dostępu do nich. Czy rozumiesz o czym mówię? Jeśli nie, to dosłownie w kilku akapitach postaram się trzymać wyjaśnień.

W lewej kolumnie znajduje się zakładka "Moje karty". Jego istota polega na tym, że tutaj możesz zapisać wszystkie te etykiety, selekcje, utwardzone trasy i inne rzeczy, które stworzyłeś w Yandex Maps. Osobiście tak zaznaczyłem miejsca, w których udało mi się wsiąść na rower w okolicach mojego miejsca zamieszkania.

Możesz jednak postawić znak, wybrać dowolny budynek (wykreślić trasę) i napisać, że znajduje się tam Twoja firma, dodając do opisu niezbędne tagi słowa kluczowe(w tym przypadku potwierdzenie informacji nie będzie konieczne), ponieważ istnieje możliwość, że informacje te zostaną wzięte pod uwagę podczas wyszukiwania w Yandex Maps. W takim przypadku lepiej byłoby zapisać mapę jako publiczną (oznaczoną „wszyscy”) na powyższym zrzucie ekranu.

Przeczytaj szczegóły w artykule o uzyskiwaniu bezpłatnego ruchu komercyjnego z Yandex Maps, który został opublikowany przez autora bloga Mystery Online. Opisuje niektóre sztuczki, które zadziałały, przynajmniej w momencie pisania tego tekstu.

Chociaż możliwość zapisywania stworzonych etykiet i oznaczeń może się przydać, jak wspomniałem, tylko do celów osobistych. W takim przypadku najlepiej byłoby zapisać karty, po uprzedniej autoryzacji w Yandex, aby później móc je edytować, zapisać nieograniczoną liczbę sztuk, a także oznaczyć je jako osobiste (tylko dla mnie) lub jako wąsko skupione (tylko przez link, o którym poinformujesz, a podczas przeglądania listy Twoich kreacji przez innego użytkownika, nie będzie on widoczny).

Jeśli chcesz przekazać komuś dalej połączenie z utwardzoną trasą, możesz użyć przycisku znajdującego się w prawym górnym rogu „Linku”, gdzie oprócz zwykłego hiperłącza będziesz również mógł udostępnić link do utworzonej mapy w popularnych sieciach społecznościowych.

Skoro o tym mówimy układanie trasy na Yandex Maps, to powiem o tym kilka słów. Wygodna rzecz. Kiedy nie było samochodu, ważne było wytyczenie trasy komunikacji miejskiej do nieznanego miejsca.

Yandex opowiadał o tym, którym autobusem lub trolejbusem dojechać do najbliższego metra, mówił o przesiadkach podczas jazdy pod ziemią, a następnie nadawał, jak dostać się do punktu końcowego, do liczby metrów, które trzeba będzie przejść.

Ponadto Yandex Maps ostrzega również o czasie rzekomo wymaganym do ukończenia tej pielgrzymki, a nawet oferuje alternatywne trasy do rozważenia.

Kiedy pojawił się samochód, jeszcze bardziej istotne stało się korzystanie z routingu, ponieważ sytuacja z korkami czasami powoduje poważne korekty. Aby to zrobić, wystarczy wpisać dwa adresy (punkt początkowy i końcowy) w lewej kolumnie lub po prostu umieścić te punkty na diagramie za pomocą myszki (pierwsze kliknięcie to początek trasy, drugie to koniec).

Aby policzyć korki, zaznacz odpowiednie pole i aby zmienić trasę w osobnym miejscu, wystarczy kliknąć w to miejsce lewym przyciskiem myszy i gdy pojawi się białe kółko, chwyć je i przeciągnij na wybrane skrzyżowanie lub tor. To prawda, że ​​\u200b\u200bjeśli ręcznie dostosujesz trasę na mapie Yandex, korki przestaną działać - za wszystko odpowiadasz.

Swoją drogą, skoro mówimy o rzeczach oczywistych, zapytam na ile sposobów można zmienić skalę wyświetlania? Osobiście wiedziałem tylko o przyciskach plus i minus (i suwaku między nimi) w lewym górnym rogu oraz o obrocie kółka myszy. Okazało się jednak, że dwukrotne klikanie prawym i lewym przyciskiem myszy pozwala też na zabawę szczegółami, co czasem może być wygodne.

Ale ciekawie jest oczywiście układać trasy i korki w domu, ale najczęściej z tego korzystamy Aplikacje mobilne Yandex(Mapy, Nawigator lub Metro). Myślę, że pierwszy program jest zainstalowany na 90% telefonów w dużych miastach Rosji, gdzie w zwyczaju są ogromne korki. Jest to zrozumiałe, ponieważ jest wygodne, szybkie i niezawodne. Ta shnyaga jeszcze mnie poważnie nie zawiodła.

Aplikacje mobilne będą całkowicie bezpłatne pobieranie z oficjalnej strony internetowej lub rozpoznać podany kod QR, z linkiem do pobrania pliku przez telefon komórkowy (powinieneś mieć na nim jakiś program, który pomoże):

Mobilne mapy Yandex.Maps mają bardzo podobną funkcjonalność do wersji online (korki, wyznaczanie tras, wyszukiwanie), jednak w przypadku podróży po nieznanej trasie najlepiej nadaje się ich Nawigator, którego ogólna zasada jest dobrze pokazana w tym filmie :

Chociaż osobiście trzymam Nawigatora z Yandex Maps w telefonie jako opcję zapasową, ponieważ cienki Garmin z niesamowitym ekranem, sterowaniem głosowym i pięknymi mapami Rosji całkowicie mi odpowiada, z tym wyjątkiem, że nie zawsze są na nim ładowane tylko korki w odpowiednim czasie, bo kanał radiowy jest do tego wykorzystywany, a kiedy cała Moskwa jest tego warta, to trzeba dużo nadawać, a dopóki nie nadejdzie kolej na obszar, w którym podróżujesz, wszystko może się zmienić dziesięć razy.

Mapy Api Yandex i konstruktor do ich tworzenia

Otóż ​​z pytaniami ogólnymi już załatwione, teraz pora przejść do praktyki, czyli jak tworzyć w konstruktorze i wstaw mapę z Yandex na swoją stronę... W rzeczywistości jest to jednocześnie łatwe i trudne.

Jeśli masz stronę wizytówkową, bloga lub prosty sklep internetowy z rozbudowaną siecią biur, to podstawowe możliwości projektanta wystarczą Ci, a nawet amator może wstawić kod do strony.

Właściwie jest bardzo dobry film, który pomoże ci podjąć decyzję o potrzebie zawracania sobie tym głowy - Jak ulepszyć swoją witrynę za pomocą interfejsu API Yandex.Maps(w przykładach):

Jeśli podejdziesz do sprawy dokładnie, to prawidłowo sporządzona mapa trasy lub wyliczenie kosztów dostawy na podstawie wskazanej przez użytkownika lokalizacji może znacząco poprawić użyteczność i ostatecznie uczynić odwiedzającego kupcem.

Aby uzyskać szczegółowe informacje, zobacz wideo, które mówi jak ulepszyć swój sklep internetowy za pomocą map:

To inna sprawa, jeśli musisz wyjść poza podstawowe ramy konstruktora Yandex Maps i stworzyć coś porównywalnego pod względem wielkości do schematów zasięgu wiodących operatorów komórkowych, listy wszystkich bankomatów Kiwi, sytuacji z korkami w Twojej okolicy itp. od rzeczy. Tutaj potrzebujesz programisty, który zna JavaScript.

Yandex.Maps API, na przykład pozwala na nałożenie warstwy z korkami na Twojej stronie, ale do tego możliwości wbudowanego konstruktora niestety nie wystarczą i będziesz musiał skorzystać z usług specjalisty znającego JavaScript , który będzie musiał jedynie zapoznać się z dokumentacją API.

Tak, sam termin API (interfejs programowania aplikacji) oznacza uzyskanie możliwości korzystania z pewnego rodzaju oprogramowania, nie wiedząc w ogóle, jak ono działa, ale mając opis tych narzędzi (długopisów), które są niezbędne do jego podłączenia i wdrożenia określonych funkcji . Ta rzecz jest szeroko rozpowszechniona i często używana.

API Yandex Maps jest opisane pod linkiem podanym powyżej, ale jest też prosty konstruktor, który pozwoli Ci szybko stworzyć mapę potrzebnego obszaru, umieścić na niej niezbędne etykiety z opisami, podświetlić potrzebne obiekty i pokazać ścieżka, którą najłatwiej się do nich dostać np. z najbliższej stacji metra.

Konstruktor map w Yandex

Następnie artykuł lub statyczna strona może być wstaw kod uzyskany w konstruktorze map Yandex, używając następującej konstrukcji, gdzie zamiast "yandexmap" wstaw identyfikator, którego używasz:

Teraz nie boisz się edytora wizualnego, który jest gotowy wyciąć wszystko, co różni się od kodu HTML. Hurra. Jeśli chcesz wstawić wskazówki do ramki bloga (nagłówka, paska bocznego lub stopki), skrypt można wstawić tam bezpośrednio, ale będziesz musiał wybrać ten, który chcesz, aby mapa była wyświetlana tam, gdzie chcesz. Przeczytaj o przeznaczeniu szablonów pod podanym linkiem.

Wstawić Mapy API z Yandex do witryny zarządzanej przez Joomla będzie można użyć tego samego, ale najpierw wyłącz edytor wizualny, aby kod ponownie nie został przez niego wycięty. Po wstawieniu edytor można ponownie włączyć.

Jeśli potrzebujesz dodać kod dojazdu do artykułu Joomla, możesz go po prostu wkleić przy wyłączonym edytorze wizualnym lub wstawić zawartość dowolnego modułu kodu, korzystając z możliwości wtyczki.

W takim przypadku moduł z kodem karty Yandex musi być umieszczony na nieistniejącej pozycji w szablonie (banalne jest wpisanie czegoś takiego jak yandex-karta w polu wyboru pozycji w ustawieniach modułu dla dowolnego kodu HTML). A potem już podczas pisania lub edycji artykułów możesz wstawić strukturę w odpowiednie miejsce:

(pozycja ładowania Yandex-karta)

Nawiasem mówiąc, jeśli nagle ta metoda nie zadziała, przejdź do menedżera wtyczek (z panelu administracyjnego Joomla wybierz pozycje menu „Rozszerzenia” - „Menedżer wtyczek”) i znajdź, a następnie aktywuj „Zawartość - Załaduj moduł ”. Jest zawarty w standardowym pakiecie Joomla, więc musisz go mieć.

W tym miejscu warto również powiedzieć, że możesz wyciągnąć schemat i wstawić go do swojej witryny ze wspomnianych powyżej „Moich kart”. Pamiętaj, że tam mówiłem, że możesz dostać link do zapisanego schematu, oprócz tego możesz też dostać Plik YMapsML, który możesz łatwo dołączyć do witryny, wcześniej podłączając do niej API.

Aby podłączyć Yandex API, wystarczy umieścić następujące wywołanie skryptu między tagami head (w przypadku Joomla lub WordPress można je znaleźć w taki sam sposób, jak opisano w artykule na temat):

Otóż ​​we właściwym miejscu (gdzie mapa lokalizacji powinna być wstawiona i wyświetlona) wystarczy wstawić:

Zakładamy, że jakoś to rozgryźliśmy, tworząc najprostsze wskazówki dojazdu i wstawiając je na naszą stronę internetową. Co dalej? Zapewne warto powiedzieć kilka słów o bardziej rozbudowanych wersjach API Yandex Maps, które nie podlegają już wspomnianemu konstruktorowi, ale z drugiej strony osoba znająca język JavaScript jest całkiem kompetentna.

W tym przypadku, zanim się otworzysz wszystkie możliwości interfejsu API Yandex Maps które są opisane pod podanym linkiem. Znajdziesz tam całą niezbędną dokumentację, a dziewczyna z tego filmu przedstawi Ci aktualne informacje:

Świetnie, przekaż te materiały swojemu programiście, a on spartaczy ci coś takiego (w razie potrzeby):

Jak wstawić mapy Yandex do WordPress i Joomla za pomocą rozszerzeń

W zasadzie opisane powyżej możliwości konstruktora w większości przypadków powinny wystarczyć. Istnieje jednak kilka rozszerzeń, które pozwalają wstawić mapę z Yandex na swoją stronę i dodać do niej niezbędne etykiety objaśniające.

Listę takich rozszerzeń można znaleźć na oficjalnej stronie internetowej. Jeśli weźmiemy pod uwagę WordPressa, to moim zdaniem jest tylko jedna wtyczka do niego o nazwie Mapy Yandex dla WordPress, który można pobrać bezpłatnie pod podanym linkiem. Jest instalowany i aktywowany w standardowy sposób.

Jedyne, co wygląda na to, że jest trochę przestarzałe i nadal wymaga podania klucza API do swojego działania, o sposobie uzyskania którego pisałem nieco wyżej. Musisz wprowadzić ten klucz na stronie "Wtyczki" - "Mapy Yandex". Następnie na stronach do tworzenia lub edycji artykułów można znaleźć na dole formularza wprowadzania danych, aby otrzymać kod Yandex Maps.

W górnym polu wpisz tytuł objaśnienia, który będzie wskazywał żądane miejsce na diagramie. Następnie wprowadź adres miejsca, w którym będzie wyglądać strzałka wskaźnika. Następnie wypełniasz pole opisem, ustawiasz wymiary wstawianej mapy poziomo i pionowo, a także umieszczasz znacznik wyboru, aby wyświetlić skalę do zmiany skali i wyboru typu (schemat, satelita itp.).

Następnie przesuń kursor (kliknij myszą) do miejsca artykułu, w którym chcesz wstawić mapę Yandex, i kliknij przycisk „Wyślij mapę do edytora”. W rezultacie otrzymamy coś podobnego do tego:

Co prawda nie ma paneli z zoomem i wyborem typu karty, ale poza tym wszystko jest w porządku. Pokazano mi zrzut ekranu z innego mojego bloga, ponieważ w tym był drobny konflikt ze stylami CSS (z mojej winy), którego nie chciałem teraz naprawiać.

Istnieje kilka rozszerzeń dla Joomla tego typu, z których nigdy nie próbowałem. Dlatego po prostu je wymienię i podam linki do artykułów, które szczegółowo opisują ich możliwości i jak z nich korzystać, aby wstawić mapę na swoją stronę.

Dziś mamy jedną z najważniejszych aktualizacji Yandex.Maps w jego historii. Po pierwsze, mapa Ludowa jest połączona z główną, co oznacza, że ​​każdy może szybko i łatwo dodać do mapy własny dom lub poprawić nieścisłości. Wyniki zmian będą dostępne dla wszystkich - w Yandex.Maps, a także w Mapach mobilnych i Nawigatorze. Po drugie, Yandex.Maps otrzymał nowy interfejs, którego wersję beta rozmawialiśmy kiedyś na Habré na wczesnych etapach pracy nad nim (wielkie dzięki za wszystkie komentarze i porady, które zostały wówczas wyrażone).

W ramach cięcia opowiem o tym, jak pracowaliśmy nad interfejsem, jak rozwiązaliśmy problem szybkiego ładowania obiektów w przeglądarce, wymyśliliśmy i wdrożyliśmy nowe narzędzia, które powinny chronić edycje użytkowników, jak umożliwiliśmy nowe życie na wszystko i dlaczego mapy będą teraz aktualizowane szybciej niż kiedykolwiek i nadal będą dokładne i nie tylko.

Pierwsza wersja Map Ludowych została uruchomiona dokładnie pięć lat temu – 8 kwietnia 2010 roku. W tamtym czasie Yandex.Maps był całkowicie zależny od dostawców danych mapowych. Uruchamiając Mapę Ludową, chcieliśmy dać ludziom możliwość samodzielnego wpływania na kompletność i jakość danych. Rzeczywistość przerosła wszelkie nasze oczekiwania: w ciągu tych pięciu lat, dzięki wysiłkom użytkowników, przyciągnięto wiele miast i miasteczek Federacji Rosyjskiej i bliskiej zagranicy. Gdy otwierane są nowe węzły, poprawki na mapie wprowadzane są w ciągu dnia, a najczęściej - w godzinę.

Tak wyglądała pierwsza wersja Mapy Ludowej w 2010 roku

Ale świat nie stoi w miejscu, a czekało nas kolejne wyzwanie – zrobienie z mapy Ludowej narzędzia, za pomocą którego nawet osoby nieznające kartografii mogłyby tworzyć profesjonalne mapy nadające się do wykorzystania w wyznaczaniu tras samochodowych.

Ale stawiając sobie taki cel, byliśmy świadomi zadań, które będziemy musieli rozwiązać. Po pierwsze, aby interfejs nowej Mapy Ludowej był tak intuicyjny i przyjazny dla użytkownika, że ​​każdy może z nim pracować. Po drugie, musiałem nauczyć się edytować bardzo duże obiekty w przeglądarce. Na starej mapie People podczas ładowania obiektu z dużą liczbą węzłów (> 20K) przeglądarka zawiesza się. W nowej Mapie Ludowej, jak to sobie wymyśliliśmy, jest to nie do przyjęcia.

I po trzecie, skoro po dzisiejszych zmianach pozwalamy ludziom na edycję danych, które potem będą widziane przez dziesiątki milionów użytkowników Yandex.Maps, konieczne jest jeszcze bardziej niezawodne zabezpieczenie wyników pracy „ludowych” kartografów przed nieuczciwymi użytkownikami , których nazywamy wandalami.

Pracuj nad interfejsem

• początkujący, którzy nigdy nie próbowali edytować mapy;
• doświadczonych użytkowników, wśród których są kartografowie i aktywni użytkownicy Mapy Ludowej.

Postawiliśmy hipotezę, że interfejs powinien być dwupoziomowy. Pierwszy poziom przeznaczony jest dla zupełnie nowych użytkowników, aby mogli realizować proste scenariusze, a drugi poziom przeznaczony jest dla użytkowników zaawansowanych, gdy wymagane jest zrobienie czegoś bardziej złożonego. Poniżej podam przykłady.

Aby przetestować tę hipotezę, zbadaliśmy sesje użytkowników na Mapie ludzi i odkryliśmy, że wśród najpopularniejszych scenariuszy tworzenia i edycji danych wyróżniają się:

• redagowanie organizacji;
• edycja budynku i jego adresu;
• edycję prostych obiektów powierzchniowych (park, trawnik, teren szkoły lub przedszkola);
• edycja drogi.

A skoro te scenariusze zaczynają oswajać się z edycją mapy, oznacza to, że powinny być super logiczne i intuicyjne. Jeśli dana osoba je rozumie, a nadal jest zainteresowana edycją mapy, może kliknąć przycisk „Pokaż więcej”. Po tym kliknięciu użytkownik znajdzie więcej narzędzi, z którymi będzie musiał się rozgryźć - przeczytaj instrukcje, zapytaj o radę bardziej doświadczonych użytkowników.

W procesie projektowania interfejsu użytkownika od razu napotkaliśmy potrzebę dynamicznych prototypów. Omówienie skomplikowanych scenariuszy edycyjnych ze statycznymi układami okazało się bardzo trudne. Pojawiło się wiele pytań typu: „Co się stanie, jeśli nacisnę ten przycisk i zrobię to?” Kiedy scenariuszy jest dużo i rozgałęziają się i przecinają z każdym kliknięciem przycisku, „dynamiczne prototypy” są świetnym rozwiązaniem. Pomagają szybko i wizualnie zademonstrować, jak powinna przebiegać interakcja użytkownika z interfejsem.

Zaczęliśmy z nimi testować interfejs użytkownika. Naszymi pierwszymi tematami byli nasi programiści. Gdy tylko pokazaliśmy im pożądaną interakcję użytkownika z naszym produktem, usłyszeli: „Nie rozumiemy, jak robić tę magię. Uprośćmy to najpierw z punktu widzenia programisty, a potem postaramy się uprościć interfejs dla użytkowników.”

Każde rozwiązanie jest lepsze niż żadne. Dlatego przerobiliśmy wszystkie prototypy interfejsów na implementację, którą rozumiemy. W efekcie mamy prototyp, w którym wszystkie dane są edytowane, ale w niektórych miejscach jest to niewygodne i nielogiczne.

Wyjaśnijmy lepiej na przykładzie. Weźmy jezioro Bajkał. Jak wygodne jest edytowanie przez prostego użytkownika? Bajkał jest obiektem powierzchniowym, więc naturalne jest edytowanie go jako obiektu powierzchniowego. Ale jest problem - Bajkał składa się z 527 zamkniętych konturów (sam kontur plus rzeźbione wyspy), ponad 59 200 węzłów, a ponadto ma wspólne granice z wieloma rzekami.

Jeśli spróbujesz pobrać wszystkie te dane z serwera do użytkownika do przeglądarki, wszystko się zawiesi. Dlatego w naszych danych wszystko przedstawia się trochę inaczej.

Znajduje się tam obiekt hydrograficzny „Jezioro Bajkał”, który ma tylko nazwę i nie ma geometrii.


Po wybraniu obiektu pokazane są wszystkie jego kontury

Z obiektem tym związane są zamknięte kontury, które reprezentują zewnętrzny kontur jeziora i wycięte otwory na wyspy. Mają atrybut „zewnętrzny” lub „wewnętrzny” (kontur), ale również nie mają własnej geometrii.

Pamiętaj, że wybrałem tylko jeden zarys - zniknęły wszystkie inne podświetlenie

Wszystkie te kontury składają się z jednej lub większej liczby hydrograficznych odcinków granicznych, które reprezentują rzeczywistą geometrię.

Na zdjęciu zaznaczono jeden z odcinków zewnętrznego konturu jeziora Bajkał.

Oznacza to, że aby stworzyć takie jezioro, musimy:

• narysuj faktyczne granice jeziora i wszystkich wysp;
• utwórz obiekt „Jezioro Bajkał” i dodaj do niego kontury zebrane z wcześniej narysowanych odcinków granic.

W ten sposób nasi kartografowie widzą i tworzą dane. Wybraliśmy tę opcję do edycji danych jako punkt wyjścia do stopniowego ulepszania interfejsu.

W momencie, gdy w serwisie testowym została opracowana i uruchomiona pierwsza wersja interfejsu edycyjnego, cały nasz zespół poszedł ją przetestować. Na podstawie wyników testów wróciliśmy do siebie i przedyskutowaliśmy, co można poprawić w ten sposób edycji.

Pierwszą rzeczą, na którą zdecydowaliśmy, było to, że rysowanie Bajkała jest rzadkim przypadkiem, a początkujący użytkownik jest bardziej skłonny narysować coś łatwiejszego. Na przykład lokalny staw. A to trywialny przypadek, a staw będzie składał się z jednego obiektu hydrograficznego, jednego konturu i jednego odcinka granic. A więc w takich przypadkach stworzy go jako prosty obiekt powierzchniowy bez tych wszystkich kłopotów z odcinkami granic i konturów, a my zapiszemy go jako trzy oddzielne obiekty (obiekt hydrograficzny, kontur, granica). Nie wcześniej powiedziane, niż zrobione.

Tworzenie granicy obiektu, konturu i obiektu hydrograficznego w jednym kroku

A jeśli okaże się, że w ten sposób tworzy się trywialne obiekty, to edytujmy trywialne obiekty w ten sam sposób. Gotowy!

Edytowanie obiektu składającego się z jednej granicy obiektu, jednego konturu i obiektu hydrograficznego

W porządku! I edytujmy również te obiekty, które składają się z jednego konturu, ale z kilku przekrojów.

Edytowanie obiektu składającego się z trzech granic obiektu, jednego konturu i elementu hydrograficznego

W porządku. Edytujmy też obiekty z „wspólnymi granicami” oraz takie, które mają dużo konturów. Ale tutaj to nie zadziała. W przypadku obiektu, który ma wspólne granice z innymi obiektami, nie wiemy, co użytkownik chce zrobić - przesunąć wspólną granicę lub odłączyć obiekt od tej wspólnej granicy. A w przypadku obiektów o dużej liczbie konturów konieczne jest zrozumienie, który kontur będzie teraz edytowany przez użytkownika. Oznacza to, że konieczne jest przemyślenie scenariuszy dla tych przypadków oraz wdrożenie narzędzi selekcji i edycji.

Staw, który ma jeden kontur zewnętrzny, kilka konturów wewnętrznych i zewnętrznych ma wspólną granicę z kanałem

Dobra, teraz rozumiemy, gdzie leży granica między prostymi i złożonymi scenariuszami edycji. Ale zaimplementowaliśmy już proste przypadki i… nie uwierzycie, wyglądają prawie tak samo, jak interfejsy zostały zaprojektowane na samym początku projektu. Po prostu magia stała się zrozumiała i możliwa do zrealizowania.

W trakcie poniższych badań wymyśliliśmy, jak sprawić, by złożone i złożone scenariusze edycji danych były przejrzyste, ale rozwiązanie okazało się nie tak eleganckie, jak byśmy chcieli. Nauczyliśmy się wykrywać, kiedy użytkownik ma do czynienia ze złożonym scenariuszem. Serwis oferuje zapoznanie się z zasadami edycji sąsiednich obiektów, a nawet podpowiada użytkownikowi, gdzie mógł wystąpić błąd.

Wyświetlany jest błąd wraz z linkiem do dokumentacji i znacznikiem, w którym znaleziono błąd

Prędkość pobierania

Rozwiążmy również ten problem etapami. Możesz edytować atrybuty i geometrię, a jeśli jest wiele konturów, to w jednym kroku możesz opracować geometrię tylko jednego konturu:

Edycja jest możliwa tylko z określonej skali mapy, a użytkownik jest proszony o wybranie geometrii, której kontur chce edytować

I tak, gdy użytkownik wybierze kontur do edycji, „magia” zostaje uruchomiona ponownie – jeśli kontur jest mały (np. kontur wewnętrzny wyspy), wczytujemy go całkowicie i pozwalamy na edycję jako prosty obszar obiekt.

Przypadek edycji prostego obiektu konturowego

A jeśli kontur jest bardzo duży, ładujemy tylko widoczne odcinki granic i pozwalamy na ich edycję. Jeśli użytkownik przesunie mapę i są na niej tylko nowe odcinki granic, wczytamy je również do edycji. W ten sposób użytkownik może edytować złożone obiekty w prawie prostym trybie, nawet tego nie zauważając.

Załadowano tylko jedną część granicy obiektu ze zbioru

W ten sprytny sposób ominęliśmy ograniczenia przeglądarki – szybkość ładowania danych do edycji oraz ograniczenie liczby dostępnych jednocześnie punktów.

Ochrona edycji

W tym celu zmieniliśmy system moderacji dla wszystkich zmian wprowadzanych przez użytkowników – z post-moderacji na pre-moderację. Oznacza to, że od dziś wszystkie edycje na Mapie Ludowej będą podlegały obowiązkowej weryfikacji przez moderatorów. Mamy nadzieję, że przyczyni się to do dalszej poprawy jakości danych.

Nie mamy zadania, aby cofnąć wszystkie dane do określonej daty lub wersji, mamy zadanie - usunąć tylko część zmian wprowadzonych przez użytkownika, zachowując całą resztę, a nawet zachować integralność danych. Rezultatem był nasz wewnętrzny rozwój przechowywania danych, rewizji i oddzielnej prezentacji.

Jedną z ważnych zalet naszego systemu jest to, że nauczyliśmy się dobrze kontrolować integralność danych. Na przykład edytuję odcinek drogi i zmieniam jego geometrię.

Bezpośrednia edycja geometrii odcinka drogi

Następnie przechodzę do sąsiedniego węzła, gdzie przecina się kilka odcinków dróg i próbuję go edytować, ale pośrednio poprawiam geometrię poprzedniego odcinka.

Pośrednia edycja geometrii odcinka drogi

Oznacza to, że mam dwie powiązane zmiany. Gdybyśmy nie wiedzieli, jak kontrolować i wersjonować takie pośrednie edycje, nie bylibyśmy w stanie przywrócić obiektu do stanu, w jakim znajdował się przed edycją pośrednią. Oznacza to, że konieczne byłoby zakazanie wszelkich pośrednich edycji oprócz bezpośrednich.

W zasadzie nie ma nic złego w takim rozwiązaniu, niektóre serwisy mapowe właśnie to robią. Ale takie rozwiązanie całkowicie wyklucza możliwość edycji skrzyżowania, ponieważ przy edycji wykresu drogowego zawsze następują pośrednie zmiany danych.

Innym ważnym tematem związanym z wersjonowaniem danych jest wizualna reprezentacja edycji diff. Zawsze możesz zobaczyć, jak wygląda najnowsza wersja obiektu, ale dla wygodnej moderacji ważne jest, aby zobaczyć, jak obiekt wyglądał przed i po edycji. Szczególnie ważne jest zrobienie takiego porównania dla geometrii obiektu:

Tak wygląda różnica geometryczna i atrybutywna dla edycji, które wprowadziłem, aby zademonstrować bezpośrednią i pośrednią edycję obiektu.

Ale skończyłem rysować drogę dla pieszych, która dzieliła drogę na dwie części.

I tak wygląda diff dla prostych obiektów, takich jak budynek.

Ta wizualna reprezentacja zmian ułatwia i przyspiesza zrozumienie, kto co i jak edytował.

Dzięki temu udało nam się zaimplementować prosty i intuicyjny interfejs dla użytkowników, którzy nie znają się na kartografii i nie chcą rozumieć struktury danych. Jednocześnie stworzyliśmy wygodny i elastyczny interfejs dla doświadczonych użytkowników. Po drodze nauczyliśmy się edytować bardzo duże i „ciężkie” obiekty w przeglądarce oraz umieszczać wszystkie edycje użytkownika pod kontrolą wersji.

A wszystko po to, aby użytkownicy mogli jeszcze wygodniej dzielić się swoją wiedzą na temat obszaru z innymi.