Hinzufügen konfigurierbarer Parameter zu Vorlagen

Mittels konfigurierbarer Webanwendungsvorlagen können Benutzer das Aussehen und Verhalten einer Anwendung anpassen. Vorlagen werden in vier Schritten konfigurierbar gemacht:

  1. Erstellen Sie eine Webanwendungsvorlage, falls dies nicht bereits geschehen ist. Eine ausführliche Anleitung dazu finden Sie unter Erstellen von Webanwendungsvorlagen.
  2. Erstellen Sie eine Konfigurationsdatei.
  3. Richten Sie die Vorlage zum Lesen der Konfigurationseigenschaften ein, und wenden Sie sie auf die Anwendung an.
  4. Verknüpfen Sie die Konfigurationsdatei mit dem Element für die benutzerdefinierte Vorlage.

Die ersten Schritte sind in den folgenden Abschnitten beschrieben.

Erstellen einer Konfigurationsdatei

Die Konfigurationsdatei ist eine JSON-Datei, mit der das Eingabedialogfeld für die Vorlage definiert wird. Diese Datei enthält einen oder mehrere Abschnitte, die die benutzerdefinierten Optionen kategorisieren.

Die Eigenschaft fieldName muss innerhalb der Konfigurationseinstellung eindeutig sein.

Erstellen Sie die einzelnen Abschnitte, indem Sie eine Kategorie und eine Reihe von Feldern festlegen.

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

Legen Sie die Konfigurationsoptionen anhand der in der folgenden Tabelle aufgelisteten Feldtypen fest.

Feldtyp

Beschreibung

Absatz

Zeigt einen erläuternden Text im Dialogfeld "Konfiguration" an.

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

Text

Akzeptiert Texteingabe. Beinhaltet die Eigenschaft "stringFieldOption", die den Typ des auf dem Bildschirm angezeigten Textfeldes festlegt. Werte sind "textbox", "textarea" und "richtext". "Textbox" ist der Standardwert und ein einzeiliges Textfeld. "Textarea" zeigt ein größeres Textfeld für die Eingabe von Daten an. "Richtext" zeigt einen Richtext-Editor an, der Benutzern die Anwendung einiger Formatierungsoptionen ermöglicht, z. B. die Einstellung der Textschriftart auf fett oder kursiv.

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

Boolescher Wert

Erstellt ein Kontrollkästchen zum Festlegen von "True"- oder "False"-Werten.

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

Zahl

Erstellt ein Feld, das numerische Werte akzeptiert. Wenn das Feld nur einen bestimmten Wertebereich akzeptiert, können Sie die Einschränkungseinstellung verwenden, um die Eingabe auf einen bestimmten Wertebereich zu beschränken oder die Eingabewerte zu formatieren.

Weitere Informationen zum Erstellen von Einschränkungen mit Dojo NumberTextBox

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

Optionen

Erstellt eine Dropdown-Liste mit einer Reihe von Optionen.

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

Beispiel für eine Konfigurationsdatei

Im Folgenden finden Sie ein Beispiel für eine vollständige Konfigurationsdatei und das resultierende Konfigurationsfenster.

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

Das Konfigurationsfenster
Das resultierende Konfigurationsfenster für den Beispielcode

Einrichten der Vorlage zum Lesen der Informationen der Konfigurationsdatei

Soll die Vorlage konfigurierbarsein, muss die Anwendung die Element-ID für eine Web Mapping-Anwendung als Wert für den URL-Parameter appid akzeptieren. Diese ID wird verwendet, um eine asynchrone Anforderung zum Abrufen der Konfigurationseigenschaften für die Anwendung auszuführen. In der ArcGIS API for JavaScript können Sie mit esri.request die Konfigurationsdetails der Anwendung abrufen.

In diesem Beispiel wird "esri.arcgis.utils.arcgisUrl" in "www.arcgis.com/sharing/content/items" aufgelöst.

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];
      }
    }, 
});

Die Antwort enthält die Änderungen, die der Benutzer über das Konfigurationsfenster an der Anwendung vorgenommen hat. Sie können die Änderungen abrufen und sie auf die Anwendung anwenden. Die Anwendung sollte Standardwerte für die Konfigurationsoptionen definieren, um Situationen zu handhaben, in denen die Vorlage nicht konfiguriert ist.

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

Verknüpfen der Informationen der Konfigurationsdatei mit dem Element für die benutzerdefinierte Vorlage.

Nachdem Sie die Konfigurationsdatei erstellt haben, können Sie sie mit Ihrer benutzerdefinierten Vorlage verknüpfen und die Anwendung konfigurierbar machen. Zunächst fügen Sie die Vorlage als neue Web Mapping-Anwendung in Ihrem Portal hinzu, falls dies nicht bereits geschehen ist. Weitere Informationen zum Hinzufügen einer Anwendung finden Sie unter Hinzufügen von Anwendungen. Öffnen Sie dann die Elementdetailseite Ihrer Webanwendung, klicken Sie auf die Schaltfläche Bearbeiten, kopieren Sie den JSON-Code aus Ihrer Konfigurationsdatei, und fügen Sie ihn in das Feld Konfigurationsparameter unten auf der Elementdetailseite ein.

Elementdetailseite mit dem Feld "Konfigurationsparameter"
Machen Sie Ihre Vorlage konfigurierbar, indem Sie die Informationen der Konfigurationsdatei in das Feld "Konfigurationsparameter" der Vorlagenelementdetails einfügen.

Der Abschnitt "Konfigurationsparameter" ist nun im Modus Bearbeiten des Webanwendungselements verfügbar.

HinweisHinweis:

Für das Feld Konfigurationsparameter ist ein gültiges JSON erforderlich. Sie sollten Ihr JSON über einen Validator wie JSONLint ausführen, um sicherzustellen, dass Sie über ein wohlgeformtes, fehlerfreies JSON verfügen.

Wenn Sie die konfigurierbare Vorlage in der Web Mapping-Vorlagengalerie Ihrer Organisation oder in der Gruppenvorlagengalerie verwenden möchten, geben Sie das Element für die Gruppe frei, die für die Vorlagen verwendet wird. Anschließend kann der Administrator Ihrer Organisation den Map Viewer konfigurieren oder Gruppen konfigurieren, um die Gruppe zu verwenden, die Ihre Vorlage enthält.

5/9/2014