Após você ter criado um modelo de aplicativo da web, você tem a opção de torná-lo configurável. Os aplicativos da web configuráveis permitem aos usuários personalizar a aparência e comportamento de um aplicativo. A criação de um modelo de aplicativo configurável é um processo de quatro etapas:
- Se você ainda não fez isto, crie um modelo de aplicativo da web.
- Crie um arquivo de configuração para definir as propriedades de configuração que deseja.
- Configure o modelo para ler as propriedades de configuração e aplicá-las no aplicativo.
- Associe o arquivo de configuração com o item para seu modelo de aplicativo.
Criar um arquivo configurável
O arquivo de configuração é um arquivo JSON que define as opções de configuração do modelo de aplicativo. Veja um exemplo completo de um arquivo de configuração.
Anotação:
É uma boa prática executar o código JSON por um validador como JSONLint para garantir que você tenha um JSON bem formado, livre de erros.
O arquivo de configuração contém uma ou mais seções que categorizam as opções.
Crie cada seção especificando uma categoria e conjunto de campos.{
"configurationSettings": [
{
"category": "",
"fields": []
}
]
}
Especifique as opções de configuração utilizando os tipos de campo listados na tabela abaixo. Ao criar o arquivo de configuração, assegure que a propriedade fieldName seja única dentro do parâmetro de configuração.
| Tipo de campo | Descrição |
|---|---|
Parágrafo | Exibe um texto explicativo na caixa de diálogo da configuração. |
String | Aceita a entrada de texto. Inclui a propriedade stringFieldOption que especifica o tipo da caixa de texto exibida na tela. Os valores são textbox, textarea e richtext. A opção textbox é o padrão e é uma caixa de texto de única linha. A opção textarea exibe uma caixa de texto maior para inserir os dados. A opção richtext exibe um editor de texto eficiente que permite aos usuários aplicar algumas formatações, como configurar a fonte para texto em negrito ou itálico. Saída de amostra |
Booleano | Cria uma caixa de seleção para especificar os valores true ou false. Utilize condition para verificar se o mapa contém a funcionalidade especificada. Se o mapa não atender a condição, a caixa de seleção e rótulo não serão exibidos no painel de configuração. Saída de amostra |
Número | Cria um campo que aceita valores numéricos. Se o campo tiver que aceitar somente um intervalo de valores específico, você poderá utilizar a configuração constraints para restringir a entrada para um intervalo de valores em particular ou formatar os valores de entrada. Saída de amostra |
Opções | Cria uma lista suspensa com uma série de opções de escolha. Saída de amostra |
Seletor de Cores | Exibe um seletor de cores para escolher uma cor de uma paleta ou para especificar os valores de hex, rgb ou hsv. Saída de amostra |
Diálogo Mapa da Web | Exibe uma caixa de diálogo para procurar ou pesquisar um novo mapa para exibir em um aplicativo. Opcionalmente especifique uma condição para testar o mapa. Se a condição especificada não for atendida, uma mensagem de validação aparecerá no painel de configuração confirmando que o mapa não atende aos requisitos. As strings de condições válidas são:
Saída de amostra |
Diálogo Grupo | Exibe uma caixa de diálogo para procurar ou pesquisar um novo grupo para exibir em um aplicativo. Saída de amostra |
Múltiplas Camadas e Seletor de Campo | Apresenta uma visão de árvore das camadas e campos no mapa que corresponde aos tipos de geometria e tipos suportados. Permite aos usuários finais do aplicativo selecionarem múltiplas camadas e múltiplos campos para cada camada. Saída de amostra |
Camada e Seletor de Campo | Exibe uma lista suspensa de camadas no mapa filtradas pelos tipos e geometrias listadas. Opcionalmente especifique um ou mais seletores de campo para permitir aos usuários selecionar uma camada e campos. Saída de amostra |
Rádio | Cria uma botão de opção onde somente uma opção pode ser selecionada de cada vez. A opção selecionada será configurada para verdadeira. Saída de amostra |
Mapas Base | Exibe uma lista suspensa de todos os mapas base nomeados da Esri. Saída de amostra |
Condicional | Exibe ou oculta conteúdo com base em uma condição verdadeira ou falsa. Por exemplo, se uma caixa de seleção Exibir lista de camada estiver desmarcada, a lista de camada e todas as opções relacionadas (por exemplo Incluir subcamadas na lista de camada) estarão ocultas. |
Pesquisar | Configure um painel de pesquisa para localizar feições dentro de um campo de uma camada de feição ou endereços utilizando um localizador. Se você configurar uma pesquisa de feição, os usuários podem escolher a camada de feição e campos de pesquisa. Saída de amostra |
ScaleList | Exibe uma lista de níveis de escala pré-definidos que uma usuário pode escolher. Por exemplo, Países, Estados, Estado, Municípios, Metro, Cidade, Vizinhança. Resultado |
Exemplo de arquivo de configuração
O seguinte é um exemplo de um arquivo de configuração completo:
{
"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 }
}
Configurar o modelo para ler as informações do arquivo de configuração
Para tornar o modelo configurável, o aplicativo precisará aceitar o ID do item para um Aplicativo de Mapeamento da Web como o valor do parâmetro da URL appid. Este ID é utilizado para criar uma solicitação assíncrona para recuperar as propriedades de configuração do aplicativo. No ArcGIS API for JavaScript, você pode utilizar esri.request para recuperar os detalhes de configuração do aplicativo.
Neste exemplo, esri.arcgis.utils.arcgisUrl soluciona 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];
}
},
});A resposta incluirá as alterações feitas no aplicativo pelo usuário utilizando o painel de configuração. Você pode então recuperar as alterações e aplicá-las no aplicativo. O aplicativo deve definir os valores padrões das opções de configuração para lidar com as situações onde o modelo não estiver configurado.
{
"source": "15a34e2c161b4364860854fbc84262c5", "folderId": "5705faa4594a4fd09edf01742c16e523", "values": {
"webmap": "32f1438789d34b5e8125f0f7c64b8d63", "layer":"https://sampleserver6.arcgisonline.com/arcgis/rest/services/Water_Network/MapServer/2", "theme": "green", "orgname": "Water Points", "bufferdistance": 3 }
}Associe as informações do arquivo de configuração com o item para seu modelo de aplicativo
Após ter criado seu arquivo de configuração, você está pronto para associá-lo ao modelo de aplicativo personalizado e tornar o aplicativo configurável.
- Se você ainda não tiver criado, adicione o modelo como um novo item do aplicativo.
- Na página de item do modelo de aplicativo, clique na guia Configurações e localize a seção Aplicativo de Mapeamento na Web .
- No menu suspenso Propósito, selecione Configurável.
- No campo Parâmetros de Configuração , cole o código JSON de seu arquivo de configuração.
Anotação:
O campo Parâmetros de Configuração exige um JSON válido. É uma boa prática executar o JSON por um validador como JSONLint para garantir que você tenha um JSON bem formado, livre de erros.
- Clique em Salvar para salvar suas configurações.
Se você desejar utilizar um modelo configurável na galeria de aplicativo do Map Viewer Classic ou galeria de aplicativo do grupo da sua organização, compartilhe o item no grupo sendo utilizado para esta galeria de aplicativo. Então o administrador de sua organização pode configurar o mapa ou configurar grupos para utilizar o grupo que inclui seu modelo.