Веб-приложение показывает передвижение автобусов на карте Москвы.
- Скачайте код
- Откройте в браузере файл index.html
Внизу справа на странице можно включить отладочный режим логгирования и указать нестандартный адрес веб-сокета.
Настройки сохраняются в Local Storage браузера и не пропадают после обновления страницы. Чтобы сбросить настройки удалите ключи из Local Storage с помощью Chrome Dev Tools —> Вкладка Application —> Local Storage.
Если что-то работает не так, как ожидалось, то начните с включения отладочного режима логгирования.
Фронтенд ожидает получить от сервера JSON сообщение со списком автобусов:
{
"msgType": "Buses",
"buses": [
{"busId": "c790сс", "lat": 55.7500, "lng": 37.600, "route": "120"},
{"busId": "a134aa", "lat": 55.7494, "lng": 37.621, "route": "670к"},
]
}
Те автобусы, что не попали в список buses
последнего сообщения от сервера будут удалены с карты.
Фронтенд отслеживает перемещение пользователя по карте и отправляет на сервер новые координаты окна:
{
"msgType": "newBounds",
"data": {
"east_lng": 37.65563964843751,
"north_lat": 55.77367652953477,
"south_lat": 55.72628839374007,
"west_lng": 37.54440307617188,
},
}
Код написан в учебных целях — это урок в курсе по Python и веб-разработке на сайте Devman.