Страница перенесена в Confluence
http://abills.net.ua:8090/pages/viewpage.action?pageId=9601527
Maps Javascript модули
Скрипты для карт лежат в /js/map/
- maps.js - Основной скрипт для карт. Отвечает за общую логику и интерфейс для всех типов карт
- maps-google.js - Скрипт реализации интерфейса для Google Maps.
- maps-google-drawing.js - Библиотека для создания основных обьектов карт:
- Маркеры
- InfoWindows
Каждый JS - модуль карт реализует:
- Переход к точке
- Поиск
- Создание элементов контрольной панели
- Отображение маркера на карте
- Отображение балуна (infoWindow) на карте
Переход к точке
Параметры: &COORDX=xx.xxxxx&COORDY=yy.yyyyyy
После создания карты, переход в заданую точку с установкой маркера.
При заданом параметре &TITLE=string
маркеру присваивается поле title и infoWindow c контентом, дублирующим title, если не задан &CONTENT=html_string
При заданом &CONTENT=html_string
маркеру присваивается infoWindow с контентом переданым в параметре.
Поиск
Поиск работает с Google Locations API
в случае использования Google Maps.
Поиск ведётся относительно координаты в переменной mapCenterLatLng
. Возможные варианты установки переменной:
- через переменные
$form{COORDX}
и$form{COORDY}
Для поиска относительно програмно заданых координат. - через заданый параметр
%MAPCENTER%
Если ни один из этих параметров не задан, вызывается метод goToRealPosition()
, который оправляет запрос получения текущих координат пользователя, при успешном ответе центрирует карту в полученных координатах и устанавливает mapCenterLatLng
в этой точке
Поиск локаций по ключевым словам
Параметры: &search_query='query1;query2'
, где query1
, query2
ключевые слова для поиска для поиска.
Произойдёт отправка запроса на поиск по query1
, потом отправка запроса на поиск по query2
.
Для задания иконки маркера результатов поиска, необходимо передать параметр ICON. ICON может задаваться как:
- имя файла в папке
/img/google_map/
Указывать без расширения .png - URL адрес картинки
При поиске по ключевым словам в нижней части InfoWindow маркера, указывается адрес. При клике вызывается метод createNavigationRoute(origin, destination)
с параметрами mapCenterLatLng
и координатами последнего открытого infoWindow соответственно.
Поиск по типам
Параметры: &search_type='atm,bank'
, где atm
, bank
типы обьектов.
Типы обьектов для поска можно посмотреть здесь :
Google Developers: Типы, которые можно использовать при поиске и добавлении мест
Визуализация объектов
Точечные объекты
- содержат только одну координату. Сюда входят:
- Маркеры
- infoWindow (информационные панели)
Маркеры
Маркерами отображаются:
- Дома
- Точки подключения
- Сообщения
- Колодцы
Маркеры создаются с помощью объекта AMarkerBuilder
.
Обведение района
Для обведения района по крайним точкам используется объект ADistrictPolygoner
;
Методы:
addBuild(districtId, latLng) | latLng = {lat: Number, lng: Number}. Вызов сбрасывает флаг computed. |
compute() | Вычисляет полигоны для добавленых точек. Вызов сбрасывает выполняет hidePolygons() и сбрасывает polygonsArray |
showPolygons() | Показывает рассчитаные полигоны. Если не был вызван compute() , рассчитает полигоны. |
hidePolygons() | Прячет полигоны, не изменяет внутреннюю структуру |
toggle() | Включает, если полигоны спрятаны и наоборот |
При инициализации карты, создаётся глобальный объект aDistrictPolygoner.
Все рассчитанные полигоны сохраняются во внутреннем массиве polygonsArray
.
Отображение событий на карте
Модуль Maps при открытой вкладке с картой, расширяет AMessageChecker для приёма сообщений с типом MAP_EVENT
.
Формат сообщений:
{ "TYPE": "MAP_EVENT", "OBJECTS": [ { "ID" : $point->{id}, "MARKER": { "ID" : $point->{id}, "COORDX" : $point->{coordy}, "COORDY" : $point->{coordx}, "INFO" : "<strong>$lang{TYPE}</strong>: $point->{type_name} <br> <strong>$lang{NAME}</strong>: $point->{name}", "TYPE" : "nas_green" }, "LAYER_ID" : 6 } ] }
Соответсвует формату, которым передаются обьекты на карту. Если обьект не имеет установелнного слоя, нужно указывать 6
(Слой «Обьекты»),
События карты
Во время загрузки и настройки карты вызываются определённые события.
Асинхронная обработка реализуется благодаря PubSub модели обьектом Events
.
Последовательность событий во время загрузки карты
onbeforemapcreate | Перед загрузкой скриптов карты |
---|---|
mapsloaded | Происходит после загрузки внешних скриптов карты |
layersready | После формирования слоёв карты |
controlsready | После формирования панели управления (кнопок) |
mapsconfigured | После настройки карты и обработки дополнительных условий |
controlblockshowed | Показана панель управления |
controlblockcached | Ссылки на DOM-элементы кнопок панели управления сохранены в кеш |
new_point_rendered_%LAYER_ID% | Происходит каждый раз при рендеринге точки слоя |
billingdefinedlayersshowed | После обработки ObjectsArray (обьекты, переданные в странице) |
layerenabled, %LAYER_ID% | После включения слоя, %LAYER_ID% передаётся аргументом функции-обработчику события |
layerdisabled, %LAYER_ID% |
Дополнительные события, возникающие во время работы
mapsclick, (event) | Возникает каждый раз при клике по карте, координаты можно получить как (event.latLng.lat(), event.latLng.lng()) |
---|---|
savingmapconfig | При закрытии страницы, во время сохранения настроек карты |
clearmapconfig | Перед очисткой сохранённой конфигурации |
realpositionretrieved, position | Получены координаты от браузера клиента |
realpositionfailed | Произошла ошибка получения координат |
События редактирования пользовательских слоев
currentmapobjectfinished | При готовности слоя отправлять обьекты (Пользователь подтвердил завершение редактирования) |
---|---|
proceedingaddingpoints | (Пользователь не подтвердил завершение редактирования) |
point_removed_%LAYER_ID% | Отправлен запрос на удаление точки слоя %LAYER_ID% |