Добавление настраиваемых параметров в шаблоны

Настраиваемые шаблоны позволяют пользователям настраивать внешний вид и поведение своих приложений. Чтобы сделать шаблон настраиваемым, необходимо выполнить процесс, состоящий из четырех шагов:

  1. Создайте шаблон приложения, если вы этого еще не сделали.
  2. Создайте файл конфигурации.
  3. Задайте шаблон, установив свойства конфигурации, и примените их к приложению.
  4. Свяжите с ним файл конфигурации для вашего пользовательского шаблона.

Ниже приводится подробное описание шагов по добавлению параметров конфигурации в ваш шаблон приложения. Более подробно о создании шаблонов см. в разделе Создание шаблонов веб-приложений.

Создание файла конфигурации

Файл конфигурации представляет собой файл JSON, который определяет диалог ввода параметров для настраиваемого шаблона. Этот файл содержит одну или несколько секций, которые распределяют возможности пользовательской настройки по категориям.

Свойство fieldName в настройке конфигурации должно быть уникальным.

Создайте секции, указав для каждой категорию и набор полей.

{
    "configurationSettings": [{
         "category": "",
        "fields": []
    }]
}

Укажите опции конфигурации, используя типы полей, перечисленные в следующей таблице.

Тип поля

Описание

Параграф

Отображает пояснительный текст в диалоговом окне настройки.

{
       "type": "paragraph",
       "value": "* These menu items will appear in the application when the web map has layers that require them."
}

Строка

Принимает входной текст. Содержит свойство stringFieldOption, которое определяет тип текстового поля, отображаемого на экране. Значения могут быть следующие: textbox, textarea и richtext. Textbox является значением по умолчанию и представляет собой однострочное текстовое поле. Text area представляет собой более крупное текстовое поле для ввода данных. Rich text имеет редактор, с помощью которого возможно форматирование текста, например, использование жирного шрифта или курсива.

{
        "type": "string",
        "fieldName": "description",
        "label": "Description",
        "tooltip": "",
         "stringFieldOption" :_richtext_ || textarea || textbox,
        "placeHolder": "Text that appears in the text box to provide a hint to users on text to enter"
}

Логический

Создает окно для установки значений Истина (True) или Ложь (False).

{
       "type": "boolean",
       "fieldName": "displaytitle",
       "label": "Show Title",
       "tooltip": ""
 }

Число

Создает поле, поддерживающее числовые значения. Если поле должно принимать только значения определенного диапазона, то вы можете использовать настройки ограничений, которые будут отфильтровывать входные данные либо форматировать входные значения в соответствии с заданным диапазоном.

Более подробно о создании ограничений с помощью Dojo NumberTextBox

{ 
     "type": "number",
     "fieldName": "range",
     "label": "Range:",
     "tooltip": "",
     "constraints" :{min:0,max:10,places:0}
}

Опции

Создает ниспадающий список с возможностями выбора.

{
   "type": "options",
   "fieldName": "theme",
   "tooltip": "Color theme to use",
   "label": "Color Scheme:",
   "options": [{
     "label": "Blue",
     "value": "blue"
   }, {
     "label": "Green",
     "value": "green"
   }, {
     "label": "Orange",
     "value": "orange"
   }]
 }

Пример файла конфигурации

Ниже представлен пример файла конфигурации и панель настройки.

{
"configurationSettings": [
{
"category": "General Settings",
"fields": [
{
"type": "options",
"fieldName": "theme",
"tooltip": "Color theme to use",
"label": "Color Scheme:",
"options": [
{
"label": "Blue",
"value": "blue"
},
{
"label": "Green",
"value": "green"
},
{
"label": "Orange",
"value": "orange"
}
]
},
{
"type": "string",
"fieldName": "layer",
"label": "Analysis Layer",
"tooltip": "Feature Layer with Facilities to search"
},
{
"type": "string",
"fieldName": "orgname",
"label": "Organization Name:",
"tooltip": "",
"stringFieldOption": "_richtext_",
"placeHolder": "Organization Name"
},
{
"type": "number",
"fieldName": "bufferdistance",
"label": "Search Distance (miles)",
"value": "1"
}
]
}
],
"values": {
"theme": "orange",
"bufferdistance": 1
}
}

Панель настройки
Панель конфигурации для примера кода

Настройка шаблона для считывания информации файла конфигурации

Если шаблон будет настраиваемым, то приложению надо будет принять идентификатор приложения как параметр URL. Этот идентификатор (appid) используется для подачи асинхронного запроса для получения свойств конфигурации для приложения. В ArcGIS API for JavaScript для получения информации о конфигурации приложения можно использовать esri.request.

В данном примере esri.arcgis.utils.arcgisUrl превращается в www.arcgis.com/sharing/content/items.

var requestHandle = esri.request({
    url: esri.arcgis.utils.arcgisUrl + "/" + appid + "/data",
    content: {
        f: "json"
     },
    callbackParamName: "callback",
    load: function (response) {
     for (var key in response.values){
      if(response.values[key]!==undefined)configOptions[key]=response.values[key];
      }
    }, 
});

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

{
    "source": "15a34e2c161b4364860854fbc84262c5",
    "folderId": "5705faa4594a4fd09edf01742c16e523",
    "values": {
        "webmap": "32f1438789d34b5e8125f0f7c64b8d63",
        "layer":"http://sampleserver6.arcgisonline.com/arcgis/rest/services/Water_Network/MapServer/2",
        "theme": "green",
        "orgname": "Water Points",
        "bufferdistance": 3
       }
 }

Связывание информации файла конфигурации с элементом для вашего пользовательского шаблона

Когда файл конфигурации будет вами создан, вы можете связать его со своим пользовательским шаблоном и сделать приложение настраиваемым. Прежде всего, в ArcGIS Online добавьте шаблон как новый элемент Картографического веб-приложения, если вы этого еще не сделали. Подробнее о добавлении элементов в ArcGIS Online см. в разделе Добавление приложений. Затем откройте страницу с информацией об элементе вашего веб-приложения, нажмите кнопку Редактировать (Edit) и скопируйте и вставьте код JSON из файла конфигурации в поле Параметры конфигурации (Configuration Parameters), расположенное в нижней части страницы с информацией об элементе.

Страница с информацией об элементе с полем Параметры конфигурации
Сделайте свой шаблон настраиваемым, добавив информацию файла конфигурации в поле Параметры конфигурации (Configuration Parameters) информации об элементе шаблона.

Теперь раздел параметров конфигурации доступен в режиме Редактирование (Edit) элемента веб-приложения в ArcGIS Online.

ПримечаниеПримечание:

Для поля Параметры конфигурации (Configuration Parameters) требуется допустимый JSON. Рекомендуется запускать JSON через валидатор, например через JSONLint, чтобы убедиться в том, что ваш JSON правильно оформлен и не содержит ошибок.

Если вы желаете использовать настраиваемый шаблон в галерее шаблонов веб-карт вашей организации или галерее шаблонов группы, сделайте его общедоступным в группе, используемой для шаблонов. Тогда администратор вашей организации сможет настроить карту или настроить группы, чтобы использовать группу, содержащую ваш шаблон.

4/12/2013