Cтатьи и комментарии

Создание справочной системы политико-административного деления Эквадора на базе GIS WebServer SE

Авторы: Стасюк Валерий Владимирович, Касьянов Олег Викторович

Программное обеспечение GIS WebServer SE предоставляет разработчикам геопорталов достаточно много функций и режимов. Однако трудно заранее предусмотреть все возможные пожелания пользователей к функционалу системы. Поэтому важнейшей особенностью GIS WebServer SE является возможность самостоятельной доработки функционала или перенастройки существующих режимов работы под требования конкретного заказчика. В этой статье мы расскажем, как изменить интерфейс и функционал системы, построенной на основе GIS WebServer SE.

Рассмотрим задачу создания справочной системы политико-административного деления страны. В нашем примере это будет Эквадор – небольшое государство в Южной Америке, территория которого делится на провинции, кантоны, городские и сельские приходы.

Начнём с функционала, которым будет обладать наш портал. Во-первых, мы хотим обеспечить пользователю возможность просматривать карту политико-административного деления, находить на ней административные единицы, населённые пункты и другие географические объекты, просматривать атрибутивную информацию этих объектов, измерять расстояния или площади на карте, выводить выбранный фрагмент карты на печать. Все перечисленные операции умеет делать GIS WebServer SE. Для реализации этих функций нам достаточно подготовить и разместить данные, а также выполнить несложные настройки.

Во-вторых, мы хотим представить данные об организации территории страны в виде дерева, на первом уровне иерархии которого провинции, затем составляющие их кантоны, и далее городские и сельские приходы. Также нам нужно, чтобы, найдя необходимую административную единицу в дереве, пользователь мог сразу же посмотреть на карте страны, какую территорию занимает эта административная единица, и получить справочную информацию по ней. Справочная информация – это короткий текст, изображение герба для провинций и список административных единиц следующего уровня иерархии, составляющих данную единицу. Все это хранится где-то во внешней базе данных на сервере MySQL. А вот это уже оказывается не так-то и просто – подобных режимов у GIS WebServer SE нет. Значит, нужно создать их своими силами!

И так, к существующему функционалу GIS WebServer SE нам нужно добавить следующие режимы:

  • визуализация организации территории в виде раскрывающегося списка с тремя уровнями иерархии;
  • режим автоматического выделения на карте территории выбранной административной единицы с перемещением карты и изменением её масштаба на более удобный для просмотра (рис. 1);
  • режим вывода справочных данных (текстовых или графических) о выбранной в списке административной единице (читаются из базы данных MySQL) (рис. 2).

Выглядеть все это будет так.

Рисунок 1. Иерархический список и отображение на карте территории, выбранной административной единицы

Рисунок 2. Отображение справочных данных о выбранной административной единице

Поскольку пользователь может просматривать наш геопортал на устройствах с небольшим по размеру экраном, то предусмотрим возможность скрывать/раскрывать панель со списком административных единиц, оставляя больше места для отображения карты.

И еще один, предусмотренный нами собственный режим – это возможность при выборе на карте административной единицы с помощью стандартных режимов поиска/выделения дополнительно к атрибутивным данным, взятым из карты, посмотреть справочную информацию об этом объекте, хранящуюся в базе данных MySQL.

Теперь, когда мы знаем, что хотим получить, давайте приступим к реализации задуманного.

Исходные данные

Картографические данные проекта состоят из карты Эквадора в масштабе 1:1000000 и схемы организации территории (рис. 3). Эти карты считываются с GIS WebService SE. Доступ к ним осуществляется по протоколам WMS, WMTS и WFS.

Рисунок 3. Карты проекта

Справочная информация размещается в таблицах базы данных MySQL (рис. 4). Три таблицы хранят соответственно данные о провинциях, кантонах и приходах. Для связи записей таблицы с соответствующими объектами схемы организации территории служат поля LinkSheet и LinkObject, в которые записываются название карты и номер объекта на ней.

Рисунок 4. Таблица с данными о провинциях Эквадора

Чтобы обеспечить уникальность связей территории административных единиц на схеме организации территории, были собраны в мультиполигоны. Например, состоящая из множества островов провинция Галапагос представлена на схеме всего одним объектом, состоящим из множества контуров (рис. 5).

Рисунок 5. Объект "Провинция Галапагос" на схеме организации территории

Панель политико-административного деления

При входе на сайт пользователь видит в левой части окна панель со списком провинций Эквадора - административных единиц первого порядка (рис. 6). Нажав на значок раскрывающегося списка рядом с названием провинции, можно увидеть список составляющих ее кантонов, а затем список приходов каждого кантона.

Рисунок 6. Панель политико-административного деления

Кнопка в панели инструментов позволяет скрыть панель или показать её снова.

Для реализации этих функций первым шагом добавим в DOM GIS WebServer SE следующие элементы:

  • панель дерева территориального деления;
  • окно справочной информации для вывода данных из БД;

Для решения этой задачи напишем функцию panelAdminTerrDiv(), текст которой приведен ниже.


Для работы с деревом административно-территориального деления необходимо создать новый класс.
Конструктор класса getAdminTerrDiv (листинг 2) имеет следующие свойства:

infoCountry = {

"country" : "название страны",
"idContainer" : "id контейнера страны",
"idLayer" : "id слоя прописанное в GIS WebService SE",
"idContainer_lvl_1" : " id контейнера провинции",
"idContainer_lvl_2" : " id контейнера кантона ",
"idContainer_lvl_3" : " id контейнера прихода

};
param – данные текстовых переменных из paramATD.json;
drawing – свойство для рисования объекта слоя.

Листинг 2:

Метод tree – создает дерево территориального деления.

Листинг 3:

Функция onLoaded (листинг 4) метода tree добавляет в DOM названия территорий и кнопки:

«Показать на карте»
«Информация»

Листинг 4:

При раскрытии дерева административной единицы отправляем post запрос серверу (листинг 5) с данными: id административной единицы и id контейнера. В ответ получим список дочерних административных единиц.

Листинг 5:

Рассмотрим работу кода на примере выборки провинции (листинг 6). Если на сервер приходит пост запрос 'idContainer' == 'Provincias' – обращаемся к базе данных и производим выбор всех провинций. Ответ сервера – данные в формате json с информацией:

  • id – идентификатор объекта в БД;
  • title – название (провинций);
  • LinkObject – id объекта слоя (для проверки на вывод кнопок "Показать на карте");
  • isFolder – если значение = 1 провинция имеет дочерние админ. ед, 0 – нет.

Листинг 6:

Добавляем обработчик (листинг 7), который по нажатию на кнопку '+' (открыть дерево) запускает функцию load(), а она в свою очередь загружает список дочерних админ. единиц.

Листинг 7:

Реализация режимов "Показать на карте" и "Информация"

Напротив названий провинций и кантонов в панели политико-административного деления расположены кнопки "Показать на карте" и "Информация". При нажатии на кнопку "Показать на карте" соответствующая административная единица будет выделена цветом. При этом произойдет смещение и изменение масштаба изображения, так чтобы данная единица была в области видимости.

При нажатии на кнопку "Информация" открывается панель с короткой справкой по данной административной единице.

Для того, чтобы нарисовать объект, нам нужно запросить данные у GIS WebService SE. Функция getFeatureObject (листинг 8) получает у сервиса xml-данные об объекте слоя и запускает функцию drawObj.

Параметры getFeatureObject:
gid – идентификатор объекта карты;
center – центр.

Листинг 8:

Функция drowObj (листинг 9) формирует json, определяет масштаб и рисует объект карты.

Параметры drowObj():

  • bbox – Габариты области вывода карты в указанной CRS, две пары координат в виде «minx, miny, maxx, maxy»;
  • geom – геометрия объекта;
  • perimeter – периметр объекта;
  • area – площадь;
  • code – код;
  • name – имя;
  • center – центр объекта (в нашем примере широта и долгота столиц административных единиц Эквадора).

Листинг 9:

Используя методы компонента Map GIS WebServer SE, обращение к которой через переменную theMap, установим центр положения карты setViewport (center) и масштаб отображения setZoom (zoom).

Свойство drawing класса getAdminTerrDiv – обеспечивает нанесение на карту векторных изображений объектов, метрика которых представлена в формате GeoJSON. Метод draw(geoJSON, addSvg, options) (листинг 10) разбирает входные параметры и наносит объекты на карту.

Входные параметры draw():

  • geoJSON – GeoJSON-объект;
  • addSvg – если true, то рисование продолжится на текущем холсте без его чистки;
  • options – параметры рисования.

Листинг 10:

Если нажатие было по кнопке "показать на карте" – отправляем запрос на сервер:

  • idObj – уникальный номер записи объекта в БД;
  • idContainer – название контейнера территории (например Provincias);
  • request – 'getMap'.

При успешном запросе выполняем функцию getFeatureObject().

Аналогичные параметры отправляем при нажатии на кнопку "информация" (request = 'getInfo') (листинг 11). После получения ответа от сервера выводим данные в окне справочной информации.

Листинг 11:

Рассмотрим код скрипта infoObject.php на примере запроса информации о провинциях (листинг 12). Схема работы: если получен запрос 'getMap', делаем запрос на выборку из БД информации о провинции и выводим json, содержащий gid объекта и координатами центра.

Листинг 12:

При запросе 'getInfo' (листинг 13) информации про объект, выводим json с данными административной единицы и названием заголовка 'Datos de la provincia'. Результат вывода информации о провинции на рис. 7.

Листинг 13:

Рисунок 7. Панель с информацией о выбранном объекте списка

Вывод дополнительной информации при выборе объекта на карте

Чтобы при поиске/выделении с помощью стандартных режимов объектов - административных единиц пользователь мог посмотреть также дополнительную информацию об этом объекте, хранящуюся в базе данных MySQL, нужно создать внешнюю функцию слоя и назначить ее соответствующей карте.

Для реализации внешней функции слоя нам нужно получить имя объекта от сервиса, чтобы выбрать из нужной таблицы данные. Метод getInfoObj (листинг 14) принимает gid и id слоя, отправляет запрос сервису, получает имя объекта (Provincia или Canton). Далее отправляем запрос серверу с параметрами:

  • gidObj – gid объекта;
  • name – имя объекта;
  • request – запрос clickMap.

В результате выводится панель справочной информации с данными административной единицы Эквадора.

Листинг 14:

Приведенный ниже код модуля infoObject.php по запросу внешней функции выводит информацию о провинциях Эквадора (листинг 15).

Листинг 15:

Подключение к GIS WebServer SE

Теперь, когда все необходимые для реализации наших задач модули созданы, нам нужно добавить информацию о них в файл index.php, расположенный в корневом каталоге GIS WebServer SE.

Листинг 16:

В приведенном выше фрагменте кода:

  • переменная paramATD - хранит текстовые переменные (тексты сообщений об ошибках) из файла paramATD.json;
  • объект ATD – внешняя функция слоя.

Вот собственно и все, что нужно для реализации задуманных нами новых режимов GIS WebServer SE. Посмотреть, как это работает, можно, перейдя по ссылке: www.ecuador.gisinfo.ru