向模板中添加可配置参数

可配置模板供用户自定义应用程序的外观和行为。可通过以下四个步骤将模板设置为可配置:

  1. 创建模板应用程序(如果尚未进行此操作)。
  2. 创建配置文件。
  3. 设置模板以读取配置属性并将它们应用到应用程序。
  4. 将配置文件与自定义模板项目相关联。

以下详细介绍了向自定义模板应用程序中添加配置参数的步骤。有关创建模板的信息,请参见创建 Web 应用程序模板

创建配置文件

配置文件是 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 属性,它指定在屏幕上显示的文本框类型。这些值是文本框、文本区域和富文本。文本框的默认形式是单行文本框。文本区域显示一个更大的文本框以便输入数据。富文本显示一个供用户在文本中应用某些格式(例如,将字体设置为粗体或斜体)的富文本编辑器。

{
        "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"
}

布尔型

创建指定真值或假值的复选框。

{
       "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
}
}

配置面板
示例代码的相应配置面板

设置模板以读取配置文件信息

如果要将模板设置为可配置,应用程序将需要接受应用程序 ID 作为 URL 参数。此应用程序 ID (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 中添加模板作为新的 Web 制图应用程序项目。有关将项目添加到 ArcGIS Online 的详细信息,请参见添加应用程序。然后,打开 Web 应用程序的项目详细信息页面,单击编辑按钮,并将 JSON 代码从配置文件中复制和粘贴到项目详细信息页面底部的配置参数框中。

带有配置参数字段的项目详细信息页面
将模板设置为可配置,方法是向模板项目详细信息的配置参数字段中添加配置文件信息。

配置参数部分现已可用于 ArcGIS Online 上 Web 应用程序项目的编辑模式。

注注:

配置参数字段需要有效的 JSON。最好通过验证器(例如JSONLint)运行 JSON ,从而确保 JSON 格式正确并且不含错误。

如果希望使用贵组织的 Web 制图模板库或组模板库中的可配置模板,则将项目共享到正在用于模板的组。然后您组织的管理员可以通过配置地图配置组来使用包括模板的组。

4/12/2013