8. Настройка веб-представлений

Формат

Настройки веб-представления карты или слоя хранятся в "Параметры слоя/карты" в поле "Параметры представления" и доступны в веб-интерфейсе администратора геопортала. Настройки представлены в виде массива "приложений" - группы параметров, объединенных по общему функционалу.

Настройки веб-представления реализованы в json формате со следующей структурой:

[
    {
        "application": "<название приложения 1>",
        "options": "<настройки приложения 1>"
    },
    {
        "application": "<название приложения 2>",
        "options": "<настройки приложения 2>"
    },
    ...
    {
        "application": "<название приложения N>",
        "options": "<настройки приложения N>"
    }
]

Пример настроек с одним приложением:

[
    {
        "application": "checkbox",
        "options": {}
    }
]


Приложения

Приложение "checkbox" позволяет управлять видимостью чекбоксов в легенде. При наличии этого приложения в легенде включаются чекбоксы.

Cтруктура:

{
    "application": "checkbox",
    "options": {}
}


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

Cтруктура:

{
    "application": "query",
    "options": {
        "type": "<тип формирования результата запроса>",
        "output": "<формат данных, передаваемых в шаблон или внешнее приложение>",
        "template": "<twig шаблон ответа на запрос>",
        "script": "<внешняя url ссылка на приложение, формирующее ответ на запрос>",
        "box": {
            "width": "<фиксированная ширина информационного окна (integer)>",
            "height": "<фиксированная высота информационного окна (integer)>",
            "minwidth": "<минимальная ширина информационного окна (integer)>",
            "minheight": "<минимальная высота информационного окна (integer)>",
            "maxwidth": "<максимальная ширина информационного окна (integer)>",
            "maxheight": "<максимальная высота информационного окна (integer)>"
        },
        "action": {
            "extjs": ["<массив url с адресами внешних javascript библиотек (string)>", ...],
            "extcss": ["<массив url с адресами внешних css библиотек (string)>", ...],
            "show": "<javascript код, выполняемый при открытии информации по объекту (string)>",
            "hide": "<javascript код, выполняемый при закрытии информации по объекту (string)>"
        }
    }
}

Где:

type (строка) - тип формирования результата. Предусмотрены следующие варианты:

  • twig - результат запроса формируется на основе twig шаблона из параметра template
  • script - результат запроса формируется во внешнем приложении, доступным по ссылке из параметра script

 

output (строка) - формат данных, передаваемых в шаблон или внешнее приложение. Предусмотрены следующие варианты:

  • index - индексированный массив
  • assoc - ассоциативный массив

Если параметр не установлен или установлен неверно, данные передаются в формате index.

 

template (строка) - twig шаблон ответа на запрос. Русская документация по языку шаблонов доступна на сайте x-twig.ru, официальный сайт языка шаблонов доступен по адресу twig.sensiolabs.org. Перед записью шаблона в настройки веб-представления необходимо экранировать ряд символов (символы переноса и конца строки, знаки табуляции, двойные кавычки - ", косые - /\ и другие специальные символы). Параметр является обязательным для type=twig.

script (строка) - внешняя url ссылка на приложение. По ссылке в качестве параметров передается результат запроса по карте в виде массива атрибутов найденных объектов слоя или слоев.
Параметры передаются в виде POST запроса в переменной data в json формате. Параметр является обязательным для type=script.

box (объект) - настройки размеров информационного окна. Возможные параметры для определения размеров: width, height, minwidth, minheight, maxwidth, maxheight. При отсутствии параметра размеры информационного окна устанавливаются из настроек геопортала.
Если определен параметр width, параметры minwidth и maxwidth игнорируются. Аналогично с height. Значения параметров должны быть указаны в виде целых чисел.
Для информационных окон определены минимальные и максимальные допустимые размеры ширины или высоты.

action (объект) - настройки действий, выполняемых при отображении информационного окна.
Для подключения внешних javascript библиотек используется параметр extjs. Значение параметра задается в виде массива url адресов.
Для подключения внешних библиотек стилей используется параметр extcss. Значение параметра задается в виде массива url адресов. Внешние библиотеки стилей использовать не рекомендуется, т.к. эти библиотеки могут нарушить внешний вид всего картографического приложения.
Javascript код, заданный в параметре show, выполняется перед отображением информационного окна. Массив с данными доступен в переменной с имененем layers. Формат массива описан ниже.
Javascript код, заданный в параметре hide, выполняется перед закрытием информационного окна. В этом параметре необходимо удалить все объекты, созданные перед отображением информационного окна.

 

При формировании html результата запроса на основе шаблона или внешнего приложения, в него передаются данные с именем layers в формате:

 

при output=index:

[ // Массив слоев
    { // Данные слоя
        "attributes": [ // Название атрибутивных полей слоя (N - номер атрибутивного поля)
            "field_title_1",
            "field_title_2",
            ...
            "field_title_N"
        ],
        "data": [ // Массив объектов с данными (N - номер атрибутивного поля, M - номер объекта)
            [
                object_1_value_1,
                object_1_value_2,
                ...
                object_1_value_N,
            ],
            [
                object_2_value_1,
                object_2_value_2,
                ...
                object_2_value_N,
            ],
            ...
            [
                object_M_value_1,
                object_M_value_2,
                ...
                object_M_value_N,
            ]
        ],
        "bounds": [x0, y0, y1, y1],
        "title": "<название слоя>",
        "layerid": "<идентификатор слоя>"
    }
]

при output=assoc:

{ // Массив слоев
    "layer_id_X": { // Данные слоя
        "attributes": [ // Название атрибутивных полей слоя (N - номер атрибутивного поля)
            "field_name_1": "field_title_1",
            "field_name_2": "field_title_2",
            ...
            "field_name_N": "field_title_N"
        ],
        "data": [ // Массив объектов с данными (N - номер атрибутивного поля, M - номер объекта)
            [
                "field_name_1": object_1_value_1,
                "field_name_2": object_1_value_2,
                ...
                "field_name_N": object_1_value_N,
            ],
            [
                "field_name_1": object_2_value_1,
                "field_name_2": object_2_value_2,
                ...
                "field_name_N": object_2_value_N,
            ],
            ...
            [
                "field_name_1": object_M_value_1,
                "field_name_2": object_M_value_2,
                ...
                "field_name_N": object_M_value_N,
            ]
        ],
        "bounds": [x0, y0, y1, y1],
        "title": "<название слоя>",
        "layerid": "<идентификатор слоя>"
    }
}

 

Пример twig шаблона, используемого по умолчанию.

 

<style>
    table.infoMapTable {
        border: solid 1px #000;
    }
    table.infoMapTable td {
        border: solid 1px #000;
    }
</style>

<table class="infoMapTable">
{% for layer in layers %}

    {% if layers|length > 1 %}

        {% if loop.first == false %}
            <tr><td>&nbsp;</td></tr>
        {% endif %}
        <tr><td><b>{{ layer.title }}</b></td></tr>

    {% endif %}

    <tr><td>

        <table class="infoTable">
            {% for attr in layer.attributes %}
                {% set di = loop.index-1 %}
                <tr>
                    <td width="10%"><b>{{ attr }}</b></td>
                    {% for dt in layer.data %}
                        <td>{{ dt[di] }}</td>
                    {% endfor %}
                </tr>
            {% endfor %}

            {% if layer.attributes|length == 0 %}
                <tr><td>Пустой результат</td></tr>
            {% endif %}

        </table>

    </td></tr>
{% endfor %}
</table>