omnisearch
The omnisearch bundle offers a user interface to search in one or more search stores. Furthermore, it offers handlers for zooming and drawing search results.
Usage
No configuration is needed. Default values are applied.
The following widgets can be registered in a template by calling its widget role:
Widget Role | Component | Description |
---|---|---|
omniSearch |
OmniSearchFactory | Displays the omnisearch UI |
omniSearchMobile |
OmniSearchMobileFactory | Displays the omnisearch UI optimized for touch devices |
Configuration Reference
OmniSearchFactory
The following code sample shows the default values for the configurable properties in the app.json
file:
"omnisearch": {
"OmniSearchFactory": {
"displayLoadingIcon": true,
// Options for the combo box class. Is handed over as arguments for the comboBoxClass instance.
"comboBoxOpts": {
// selects the first result from the result list when pressing enter
"selectFirstResultOnEnter" : true,
// automatically selects highlighted items in drop-down list
"autoSelect" : false
},
// delay in milliseconds until an item is selected
"selectItemDelay": 500
}
}
ZoomHandler
The following code sample shows the default values for the configurable properties in the app.json
file:
"omnisearch": {
"ZoomHandler": {
// default scale to zoom to if no extent is set
"scale": 1000,
// always uses the configured scale (independent of the geometry's extent)
// if set to false scale is only applied for point geometries
"fixedScale": false,
//set scale for specific storeId to zoom to if no extent is set
"scaleByStore": {
"myStore": 5000
},
// options to control the goTo animation
// see the ArcGIS Maps SDK for JavaScript documentation for further configuration options
"animationOptions" : {
"animate": true,
"duration": 500,
"easing": "ease-in-out"
}
}
}
DrawHandler
The following code sample shows the default values for the configurable properties in the app.json
file:
"omnisearch": {
"DrawHandler": {
// symbols by graphic type to draw result
"_symbolTable": {
"point": {
"url": "resource('images/mapMarker.png')",
"width": 37,
"height": 36,
"xoffset": 4,
"yoffset": 16,
"type": "esriPMS"
},
"polyline": {
"color": [10, 10, 10, 255],
"style": "esriSLSSolid",
"type": "esriSLS",
"width": 1.3
},
"polygon": {
"type": "esriSFS",
"style": "esriSFSSolid",
"color": [125, 205, 234, 100],
"outline": {
"type": "esriSLS",
"style": "esriSLSSolid",
"color": [10, 10, 10, 255],
"width": 1
}
},
"point-3d": {
"url": "resource('images/mapMarker.png')",
"width": 37,
"height": 36,
"xoffset": 4,
"yoffset": 16,
"type": "esriPMS"
},
"polyline-3d": {
"color": [10, 10, 10, 255],
"style": "esriSLSSolid",
"type": "esriSLS",
"width": 1.3
},
"polygon-3d": {
"type": "esriSFS",
"style": "esriSFSSolid",
"color": [125, 205, 234, 100],
"outline": {
"type": "esriSLS",
"style": "esriSLSSolid",
"color": [10, 10, 10, 255],
"width": 1
}
}
}
}
}
If no styles are defined for 3D mode, the styles for 2D are applied.
ActionsHandler
This handler delegates to the map-actions API.
The default configuration is:
"omnisearch": {
"ActionsHandler": {
"actions" : ["openpopup"]
}
}
The DrawHandler
and ZoomHandler
prepare their configuration options to be used in this action. For example they automatically add the additional actions highlight
and zoomto
to the list of actions.
Property | Type | Description |
---|---|---|
actions |
Array | A list of the IDs of the actions to execute after the search completes. See the bundle map-actions for a list of available actions. |
<action-property> |
Any | This is a placeholder for properties defined by actions listed in the property actions . |
To disable the default behavior of openpopup
change the configuration to:
"omnisearch": {
"ActionsHandler": {
"actions" : []
}
}
To disable zooming or highlighting disable the components DrawHandler
and/or ZoomHandler
:
"omnisearch": {
"DrawHandler": {
"componentEnabled" : false
},
"ZoomHandler": {
"componentEnabled" : false
}
}
Use Cases
How to use stores in Omnisearch
The Omnisearch uses the dijit.form.ComboBox
widget.
It also offers an additional widget for choosing between different search stores.
The Omnisearch uses suggest queries to query for search results.
It is capable of handling one or many different stores.
Settings, such as label attribute or search attribute, are defined by the stores themselves.
Pressing the down arrow starts an empty search.
All stores need to support the "Complex Query Language" (at least the suggest operator has to be supported).
Furthermore, stores that shall be used in the Omnisearch UI need to specify the value omnisearch
in property useIn
:
"properties": {
"useIn": ["omnisearch"]
}
All stores may define further properties that control the UI:
Property | Type | Mandatory | Default | Description |
---|---|---|---|---|
omniSearchSearchAttr | String | yes | "name" |
Attribute name to query against |
omniSearchLabelAttr | String | no | Attribute name that contains the label of the entry to show in the menu. If not defined omniSearchSearchAttr is used. | |
omniSearchLabelString | String | no | A custom string used as label for the entry. Attributes are replaced, for example ${city_name} (${zip_code}). | |
omniSearchDefaultLabel | String | no | Default placeholder to display a message in the input field, for example "Enter name of country...". | |
omniSearchTypingDelay | Integer | no | 200 | Time [ms] to detect typing. The store is not queried if a new character is typed within the typing delay period. |
omniSearchPageSize | Integer | no | 20 | Amount of results to be displayed in the menu. |
omniSearchPriority | Integer | no | Defines the priority for a search store. Stores with a higher priority are placed at the top of the store selection list. | |
omniSearchAutoActivate | Boolean | no | If set to true, the search store is activated at the startup of an app. | |
omniSearchDisableSortOptions | Boolean | no | false | If this flag is enabled, OmniSearch is not adding any "sort" flags to the query options, so the results are left as returned by the server. |
How to use a 3D objects for omnisearch result highlighting
By default, the 3D object pushpin.json
is delivered with map.apps and can be used as in the following sample:
"omnisearch": {
"DrawHandler": {
"_symbolTable":
"point-3d":{
"type": "PointSymbol3D",
"symbolLayers": [{
"anchor": "bottom",
"width": 18,
"type": "Object",
"resource": {
"href": "resource('images/pushpin.json')"
}
}]
},
"polyline-3d": {
"type": "LineSymbol3D",
"symbolLayers": [{
"material": {
"color": [255, 0, 102],
"transparency": 50
},
"type": "Path",
"size": 50
}]
},
"polygon-3d": {
"type": "PolygonSymbol3D",
"symbolLayers": [{
"material": {
"color": [241, 196, 15],
"transparency": 50
},
"type": "Extrude",
"size": 30000
}]
}
}
}
}